plonger dans les plugins - wordcamp2015 - fsottolichio

Plonger dans les plugins

WordCamp Montréal 2015Francisco Sottolichio

www.utopsie.com

@fran6co

googlez-moi!

Plonger dans les plugins

WordCamp Montréal 2015Francisco Sottolichio

• Présentation

• Meilleures pratiques - et les autres

• Exemples

Présentation

• Designer graphique

• Designer web depuis le début du web

• WordPress depuis 10 ans

WordCamp Montréal 2015Francisco Sottolichio

Plugins - quantité

• Permettent de tout faire

• Quantité vertigineuse

• On n’en a jamais assez

WordCamp Montréal 2015Francisco Sottolichio

Plugins - qualité

• Chaque plugin est long à apprivoiser

• On s’y perd rapidement

• 95% du chemin

WordCamp Montréal 2015Francisco Sottolichio

Plugins

• Il faut modifier votre plugin!

WordCamp Montréal 2015Francisco Sottolichio

Plugins

• Changer les CSS

• Modifier à la mitaine

• Utiliser les Thèmes et les Hooks

WordCamp Montréal 2015Francisco Sottolichio

Plugins - CSS

WordCamp Montréal 2015Francisco Sottolichio

Inspecteur

Plugins - Mitaine

WordCamp Montréal 2015Francisco Sottolichio

Inspecteur

Plugins - Mitaine

WordCamp Montréal 2015Francisco Sottolichio

Plugins 11

Users

Comments

Plugins - Mitaine

WordCamp Montréal 2015Francisco Sottolichio

Diff

Plugins - Thèmes

WordCamp Montréal 2015Francisco Sottolichio

Plugins - Hooks

WordCamp Montréal 2015Francisco Sottolichio

Filtres et Actions

• Filtres modifient les valeurs dans une fonction

• Actions modifient le comportement d’une fonction

• Beaucoup de Hooks sont built-in dans WordPress

Plugins - HooksFiltres et Actions

WordCamp Montréal 2015Francisco Sottolichio

Filtres : add_filter() et apply_filter()

Actions : add_action() et do_action()

Plugins - Hooks

WordCamp Montréal 2015Francisco Sottolichio

Plugins - HooksCustom Hooks

WordCamp Montréal 2015Francisco Sottolichio

• Le moins de modifications au plugin original

Exemple

WordCamp Montréal 2015Francisco Sottolichio

Exemple - CSS

WordCamp Montréal 2015Francisco Sottolichio

Exemple - Thème

WordCamp Montréal 2015Francisco Sottolichio

Exemple - Template

WordCamp Montréal 2015Francisco Sottolichio

Exemple - Hooks

WordCamp Montréal 2015Francisco Sottolichio

Exemple

WordCamp Montréal 2015Francisco Sottolichio

Exemple

WordCamp Montréal 2015Francisco Sottolichio

• CSS

• Thème

• Filtre

Autre exemple

WordCamp Montréal 2015Francisco Sottolichio

Autre exemple - Plugin de base

WordCamp Montréal 2015Francisco Sottolichio

Autre exemple - CSS

WordCamp Montréal 2015Francisco Sottolichio

• Arranger la typo

• Changer la couleur du fond #overlay

• Changer le bouton «Close»

Autre exemple - CSS

WordCamp Montréal 2015Francisco Sottolichio

Autre exemple - CSS

WordCamp Montréal 2015Francisco Sottolichio

Autre exemple - PHP/JS

• Javascript : Trouver où on appelle le titre, ajouter Metadata : Medium, Dimensions, Date

• PHP : Back-end, ajouter option Border Width

WordCamp Montréal 2015Francisco Sottolichio

Autre exemple - PHP/JS

WordCamp Montréal 2015Francisco Sottolichio

Autre exemple - PHP/JS

WordCamp Montréal 2015Francisco Sottolichio

Autre exemple - PHP/JS

WordCamp Montréal 2015Francisco Sottolichio

Le bordel

Autre exemple

WordCamp Montréal 2015Francisco Sottolichio

• CSS

• JS

• PHP

Résumé

• Changer les CSS - simple et rapide

• Modifier à la mitaine - complexe et difficile à gérer

• Utiliser les Thèmes et les Hooks - idéalement

WordCamp Montréal 2015Francisco Sottolichio

3 niveaux d’intervention pour modifier un plugin

• Liens Plugin API : Hooks, Actions, Filters https://codex.wordpress.org/Plugin_API Ian Dunn : The Right Way to Customize a WordPress Plugin https://iandunn.name/the-right-way-to-customize-a-wordpress-plugin/ Creating Custom Hooks https://developer.wordpress.org/plugins/hooks/creating-custom-hooks/

• Plugins WP Slick Slider https://wordpress.org/plugins/wp-slick-slider/ WP jQuery Lightbox https://wordpress.org/plugins/wp-jquery-lightbox/

• Éditeur Espresso http://macrabbit.com/espresso/

• Slideshare http://www.slideshare.net/utopsie/plonger-dans-les-plugins-wordcamp2015-fsottolichio

WordCamp Montréal 2015Francisco Sottolichio

Ressources

WordCamp Montréal 2015

Francisco Sottolichio www.utopsie.com @fran6co

Merci!