wcmtl 15 - create your own shortcode (fr)

47
Montreal WordCamp 2015 @MichaelBontyes

Upload: michaelbontyes

Post on 14-Aug-2015

139 views

Category:

Technology


1 download

TRANSCRIPT

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()

Functions.php / includes / plugin Shortcode

12345678

<?php

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

}

?>

Résultat

add_shortcode()

Functions.php / includes / plugin Shortcode

12345678910

<?php

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

return 'Hello WordCamp Mtl !';

}

?>

Résultat

add_shortcode()

Functions.php / includes / plugin Shortcode

12345678910111213

<?php

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

return 'Hello WordCamp Mtl !';

}

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

?>

Résultat

add_shortcode()

Functions.php / includes / plugin Shortcode

12345678910111213

<?php

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

return 'Hello WordCamp Mtl !';

}

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

?>

[message]

Résultat

add_shortcode()

Functions.php / includes / plugin Shortcode

12345678910111213

<?php

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

return 'Hello WordCamp Mtl !';

}

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

?>

[message]

Résultat

Hello WordCamp Mtl !

Functions.php / includes / plugin Shortcode

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

Functions.php / includes / plugin Shortcode

12345678910111213

<?php

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

return date('Y');

}

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

?>

[year]

Résultat

Functions.php / includes / plugin Shortcode

12345678910111213

<?php

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

return date('Y');

}

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

?>

[year]

Résultat

2015

Simpleadd_shortcode()

Paramétrableshortcode_atts()

Flexibledo_shortcode()

Complexeob_start()

shortcode_atts()

Functions.php / includes / plugin Shortcode

123456789

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

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

Résultat

shortcode_atts()

Functions.php / includes / plugin Shortcode

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()

Functions.php / includes / plugin Shortcode

1234567891011121314151617

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

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

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

// 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()

Functions.php / includes / plugin Shortcode

1234567891011121314151617

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

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

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

// 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' ); ?>

[lorem sentences=“2”]

Résultat

shortcode_atts()

Functions.php / includes / plugin Shortcode

1234567891011121314151617

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

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

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

// 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' ); ?>

[lorem sentences=“2”]

Résultat

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Aliter enim explicari, quod quaeritur, non potest.

shortcode_atts()

Functions.php / includes / plugin Shortcode

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()

Functions.php / includes / plugin Shortcode

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' );?>

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

Résultat

shortcode_atts()

Functions.php / includes / plugin Shortcode

1234567891011121314151617

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

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

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

), $atts );

// Get the Thumbnailreturn 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' );?>

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

Résultat

Simpleadd_shortcode()

Paramétrableshortcode_atts()

Flexibledo_shortcode()

Complexeob_start()

$content

Functions.php / includes / plugin Shortcode

1234567891011

<?php

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

}

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

?>

Résultat

$content

Functions.php / includes / plugin Shortcode

1234567891011121314

<?php

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

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

}

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

?>

Résultat

$content

Functions.php / includes / plugin Shortcode

1234567891011121314

<?php

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

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

}

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

?>

[message]tout ce paragraphe devrait être en

lettres capitales[/message]

Résultat

$content

Functions.php / includes / plugin Shortcode

1234567891011121314

<?php

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

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

}

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

?>

[message]tout ce paragraphe devrait être en

lettres capitales[/message]

Résultat

TOUT CE PARAGRAPHE DEVRAIT ÊTRE EN

LETTRES CAPITALES

do_shortcode()

Functions.php / includes / plugin Shortcode

1234567891011121314

<?php

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

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

}

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

?>

Résultat

do_shortcode()

Functions.php / includes / plugin Shortcode

1234567891011121314

<?php

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

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

}

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

?>

[message]Hello WordCamp Montreal

[year] ![/message]

Résultat

do_shortcode()

Functions.php / includes / plugin Shortcode

1234567891011121314

<?php

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

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

}

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

?>

[message]Hello WordCamp Montreal

[year] ![/message]

Résultat

HELLO WORDCAMP MONTREAL 2015 !

Simpleadd_shortcode()

Paramétrableshortcode_atts()

Flexibledo_shortcode()

Complexeob_start()

ob_start()

Functions.php / includes / plugin Shortcode

12345678

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

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

Résultat

ob_start()

Functions.php / includes / plugin Shortcode

1234567891011

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

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

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

Résultat

ob_start()

Functions.php / includes / plugin Shortcode

1234567891011121314151617

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

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

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

</ul> <?php

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

Résultat

ob_start()

Functions.php / includes / plugin Shortcode

1234567891011121314151617

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

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

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

</ul> <?php

// Lecture du buffer et effacementreturn ob_get_clean();

}

Résultat

ob_start()

Functions.php / includes / plugin Shortcode

1234567891011121314151617

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

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

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

</ul> <?php

// Lecture du buffer et effacementreturn ob_get_clean();

}

[message]

Résultat

ob_start()

Functions.php / includes / plugin Shortcode

1234567891011121314151617

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

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

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

</ul> <?php

// Lecture du buffer et effacementreturn ob_get_clean();

}

[message]

Résultat

• Post Title 1• Post Title 2

Functions.php / includes / plugin Shortcode

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(); ?> <!-- Build the HTML --><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”