WCMTL 15 - Create your own shortcode (Fr)

Montreal WordCamp 2015@MichaelBontyes

[i-am-a-shortcode]

A shortcode is a WordPress-specific codethat lets you do nifty things with very little effort. Shortcodes can embed files or create objects that would normally require lots of complicated, ugly code in just one line.

Shortcode = shortcut.

https://en.support.wordpress.com/shortcodes/

// Use shortcode in a PHP file (outside the post editor).echo do_shortcode( '[hello]' );

https://codex.wordpress.org/Function_Reference/do_shortcode

<?phpfunction hello() {

return "Hello WordCamp Mtl !"; } add_shortcode( 'hello' , 'hello' ); ?>

Site / Page

Editor

Functions

Hello WordCamp Mtl !

[hello]

Wordpress.com … & WordCamp.org![gallery type=”rectangular”]

https://en.support.wordpress.com/shortcodes/

Jetpack.me

http://jetpack.me/support/subscriptions/

[jetpack_subscription_form]

Développeurs de thèmes

Développeurs de plugins[geo_mashup_map]

https://github.com/cyberhobo/wordpress-geo-mashup/wiki/Getting-Started

Développeurs de plugins[timeline-express]

https://github.com/EvanHerman/Timeline-Express

++

un peu de

Simpleadd_shortcode()

Paramétrableshortcode_atts()

Flexibledo_shortcode()

Complexeob_start()

add_shortcode()

Functions.php / includes / plugin Shortcode

1 <?php

Résultat

add_shortcode()


12345678

<?php

// Create the function for the shortcodefunction message_maker() {

}

?>

Résultat

add_shortcode()


12345678910

<?php


return 'Hello WordCamp Mtl !';

}

?>

Résultat

add_shortcode()


12345678910111213

<?php



}

// Register the Shortcode using the APIadd_shortcode('message' , 'message_maker' );

?>

Résultat

add_shortcode()


12345678910111213

<?php



}


?>

[message]

Résultat

add_shortcode()


12345678910111213

<?php



}


?>

[message]

Résultat

Hello WordCamp Mtl !


12345678910111213

<?php

// Create the function for the shortcodefunction current_year() {

return date('Y');

}

// Register the Shortcode using the APIadd_shortcode('year' , 'current_year' );

?>

Résultat


12345678910111213

<?php


return date('Y');

}


?>

[year]

Résultat


12345678910111213

<?php


return date('Y');

}


?>

[year]

Résultat

2015




Complexeob_start()

shortcode_atts()


123456789

<?php// Create the shortcode function function lorem_ipsum() {

} // Register the Shortcode using the API add_shortcode( 'lorem' , 'lorem_ipsum' ); ?>

Résultat

shortcode_atts()


12345678910111213

<?php// Create the shortcode function function lorem_ipsum( $atts ) {

// Handling the Attributes $a = shortcode_atts( array(

'sentences' => 1), $atts );

} // Register the Shortcode using the API add_shortcode( 'lorem' , 'lorem_ipsum' ); ?>

Résultat

shortcode_atts()


1234567891011121314151617




// Get the Lorem Ipsum$lorem_ipsum = get_lorem_ipsum( $a['sentences'] );

return $lorem_ipsum; } // Register the Shortcode using the API add_shortcode( 'lorem' , 'lorem_ipsum' ); ?>

Résultat

shortcode_atts()


1234567891011121314151617






[lorem sentences=“2”]

Résultat

shortcode_atts()


1234567891011121314151617






[lorem sentences=“2”]

Résultat

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Aliter enim explicari, quod quaeritur, non potest.

shortcode_atts()


1234567891011121314151617

<?php// Create the shortcode functionfunction get_thumbnail( $atts ) {

// Handling the Attributes$a = shortcode_atts( array(

'size' => 'thumbnail', 'class' => 'circle'

), $atts );

// Get the Thumbnailecho get_the_post_thumbnail(get_option('page_on_front'), $a['size'], array( 'class' => $a['class'] ) );

} // Register the Shortcode using the APIadd_shortcode( 'thumbnail' , 'get_thumbnail' );?>

Résultat

shortcode_atts()


1234567891011121314151617




), $atts );

// Get the Thumbnailecho get_the_post_thumbnail(get_option('page_on_front'), $a['size'], array( 'class' => $a['class'] ) );


[thumbnail size=”medium” class=“circle”]

Résultat

shortcode_atts()


1234567891011121314151617




), $atts );

// Get the Thumbnailreturn get_the_post_thumbnail(get_option('page_on_front'), $a['size'], array( 'class' => $a['class'] ) );


[thumbnail size=”medium” class=“circle”]

Résultat




Complexeob_start()

$content


1234567891011

<?php

// Create the function for the shortcodefunction message_maker( $atts ) {

}


?>

Résultat

$content


1234567891011121314

<?php

// Create the function for the shortcodefunction message_maker( $atts, $content = null ) {

// Upper the $contentreturn strtoupper($content);

}


?>

Résultat

$content


1234567891011121314

<?php



}


?>

[message]tout ce paragraphe devrait être en

lettres capitales[/message]

Résultat

$content


1234567891011121314

<?php



}


?>

[message]tout ce paragraphe devrait être en

lettres capitales[/message]

Résultat

TOUT CE PARAGRAPHE DEVRAIT ÊTRE EN

LETTRES CAPITALES

do_shortcode()


1234567891011121314

<?php


// Upper the $contentreturn strtoupper(do_shortcode($content));

}


?>

Résultat

do_shortcode()


1234567891011121314

<?php



}


?>

[message]Hello WordCamp Montreal

[year] ![/message]

Résultat

do_shortcode()


1234567891011121314

<?php



}


?>

[message]Hello WordCamp Montreal

[year] ![/message]

Résultat

HELLO WORDCAMP MONTREAL 2015 !




Complexeob_start()

ob_start()


12345678

<?php// Create the shortcode function function message_maker() {

} // Register the Shortcode using the APIadd_shortcode('message' , 'message_maker' ); ?>

Résultat

ob_start()


1234567891011


// Démarrage du buffer de sortieob_start();


Résultat

ob_start()


1234567891011121314151617


// Démarrage du buffer de sortieob_start(); ?> <ul>

<li>Post title 1</li> <li>Post title 2</li>

</ul> <?php


Résultat

ob_start()


1234567891011121314151617




</ul> <?php

// Lecture du buffer et effacementreturn ob_get_clean();

}

Résultat

ob_start()


1234567891011121314151617




</ul> <?php


}

[message]

Résultat

ob_start()


1234567891011121314151617




</ul> <?php


}

[message]

Résultat

• Post Title 1• Post Title 2


12345678910111213141516171819202122232425

function show_posts( $atts, $content = null ) { // Handling the Attributes $a = shortcode_atts( array(

'type' => 'projects'), $atts );

// Get the posts filtered by Post Type$query = new WP_Query( array( 'post_type' => $a['type'] ) );

ob_start(); echo '<h1>'.do_shortcode($content).'</h1>'; echo '<ul>‘;// The WP Query Loopwhile ( $query->have_posts() ) { $query->the_post(); ?> <li><?php the_title(); ?></li></ul><?php } echo '</ul>‘;// Restore the Global $post variable - Avoid WP Query inception conflictwp_reset_postdata(); return ob_get_clean();

} add_shortcode('posts' , 'show_posts' );

[posts type=“projects”]

Mes derniers projets :[/posts]

Résultat

Mes derniers projets :

• Project Title 1• Project Title 2• Project Title 3

http://gndev.info/shortcodes-ultimate/

Shortcodes Ultimate for WordPress Including a custom shortcode maker API / Addon

https://github.com/gndev/shortcodes-ultimate

https://codex.wordpress.org/Shortcode_API

Wordpress Codex – Shortcode API

Montreal WordCamp 2015 | @MichaelBontyes

https://github.com/michaelbontyes/Presentation-Create-Your-Own-Shortcode

Presentation “How to create your own shortcode”

WCMTL 15 - Create your own shortcode (Fr)

Technology

plugin shortcode

shortcode hello https

shortcode complexe ob

circle rsultat

year rsultat

atts flexible

rsultat lorem ipsum

map https