Présentation de l'API de WordPress, et des outils qu'il offre pour développer un plugin WordPress

1. {
Développement
d’extensions
Code is Poetry
samirmember@gmail.com Par Samir IZZA

2.  Prérequis
 Introduction
 Avant de commencer
 Le Header
 Licence du Plugin
 Les fonctions Activate et
Desactivate
 Internationalisation
 Les Constantes
 Actions & Filters
 Réglages du Plugin
 Menu & Sous-Menu
 Page d’options
 Intégration WordPress
 Tables Personnalisées
 Désinstaller le Plugin
 Sécurité du Plugin
 Publier votre Plugin
 Soumettre votre Plugin
Sommaire

3.  Avoir des notions dans le langage PHP
 Avoir des connaissances rudimentaire à
l’HTML
 Un peu d’Anglais 
Prérequis

4. WordPress populaire.
Facile à personnaliser.
Comprendre l’API de WordPress.
Introduction

5.  Choisir un nom unique pour votre extensions.
 Les fichiers des plugins sont dans le répertoire wp-
content/plugins/ de WordPress.
 Encodez toujours vos fichiers en UTF-8
 Testez toujours l’extension avec la dernière version de
WordPress.
Avant de commencer

6. Le Header
 Doit être au top
 Doit être seulement sur le fichier principal
 Exemple de Header
Le Header

7. Licence du Plugin

8. Fonctions Activate & Desactivate

9.  L’internationalisation (i18n).
 L’internationalisation n’est pas obligatoire.
1. La fonction _ _():
2. La fonction _e():
3. La fonction _ _ngettext (pluriel): Disant que vous
souhaitez traduire la phrase suivante:
Internationalisation

10. Internationalisation

11.  Fin de traduction
 Chargement du fichier de localisation
Internationalisation

12. ➤ WP_CONTENT_URL
➤ WP_CONTENT_DIR
➤ WP_PLUGIN_URL
➤ WP_PLUGIN_DIR
➤ WP_LANG_DIR
Les Constantes

13. 1. Actions: Les actions sont les crochets que le
noyau de WordPress lance à des points
spécifiques en cours d'exécution, ou lorsque
des événements spécifiques. Votre plugin
peut spécifier que l'une ou plusieurs de ses
fonctions PHP sont exécutés à ces points.
Syntaxe:
Actions & Filters

14. 2. Filtres: Les filtres sont les crochets que
WordPress lance pour modifier le texte de
divers types, avant de l'ajouter à la base de
données ou de l'envoyer au navigateur. Votre
plugin peut spécifier que l'une ou plusieurs de
ses fonctions PHP est exécuté pour modifier le
contenu du texte ou des données.
Syntaxe:
Actions & Filters

15.  Liste des Filtres:
http://codex.wordpress.org/Plugin_API/Filter_Reference
 Liste des Actions:
http://codex.wordpress.org/Plugin_API/Action_Reference
 Un autre lien très recommandé:
http://wordpress.org/extend/plugins/
Actions & Filters

16.  publish_post
 create_category
 switch_theme
 wp_head
 admin_head
Actions populaires

17.  wp_footer
 init
 admin_init
 user_register
 comment_post
Actions populaires

18. Filtres populaires
 the_content
 the_content_rss
 the_title
 comment_text
 wp_title
 the_permalink

19. 1. Sauvegarde des options du Plugin: add_option et
update_option
Récupérer une valeur:
Supprimer une valeur :
Réglages du Plugin

20. 2. Tableau d’options :
Réglages du Plugin

21.  Pour récupérer les données de ces options, utilisez
la fonction get_option
Réglages du Plugin

22. Menu principal Sous menu
Menu & Sous-Menu

23. 1. Créer un menu principal:
Plusieurs pages de réglages  utiliser la
fonction add_menu_page comme suit:
Menu & Sous-Menu

24. 2. Créer un sous menu:
Utilisez la fonction
add_submenu_page
Menu & Sous-Menu

25. 3. Ajouter un sous menu au menu principal
Menu & Sous-Menu

26.  add_dashboard_page
 add_posts_page
 add_media_page
 add_links_page
 add_pages_page
 add_comments_page
Menu & Sous-Menu

27.   Sauvegarder des options facilement
  Comment créer des pages pour ces
options ???
  Créer un menu facilement
  Et le contenu de sa page?
 Créer une page d’option = Créer la fonction
de la page d’options que vous avez définit
lors de la création de son menu.
Page d’options

28. Page d’options

29.  Le hook ‘admin_init’ exécute la fonction
wpday_register_settings comme suit:
  Définition des options
Page d’options

30.  Création de la fonction de la page d’options:
Page d’options

31. Page d’options

32. 1. Meta Box
2. Sidebar
3. Widget
4. ShortCode
Intégration WordPress

33. 1. Meta Box:
 Pour ajouter une meta box il faut utiliser la
fonction add_meta_box en utilisant les 6
paramètres suivants:
 Chaque paramètre indique comment et ou
votre meta box sera affiché.
Meta Box

34.  $id: l’attribut ID CSS du meta box
 $title: Le titre affiché dans le header du meta box
 $callback: Nom de la fonction pour afficher vos
informations de Meta Box
 $page: Ou vous voulez afficher votre Meta Box
(’post’, ‘page’, or ‘link’)
 $context: La partie de la page que le Meta Box doit
afficher (’normal’,‘advanced’, or ‘side’)
 $priority: La priorité dans le context d’affichage du Meta
Box (’high’, ‘core’, ‘default’, or ‘low’)
Meta Box

35.  Maintenant il faut créer la fonction
wpday_meta_box
Meta Box

36. Meta Box

37.  Création du Meta Box  OK
 Création du formulaire  OK
 Sauvegarder les données à chaque enregistrement
d’une page  Pas encore : wpday_save_meta_box qui
doit être déclencher après chaque action hook save_post
Meta Box

38.  Affichage des valeurs de vos éléments MetaBox
dans votre site:
Meta Box

39. 2. Shortcodes:
Shortcodes

40.  [mysite]  http://example.com
 Vous pouvez aussi utiliser les paramètres dans
les fonction du Shortcode
[mysite param=value]
Shortcodes

41. 3. Widget:
Widget

42.  Pour commencer, il faut étendre la classe
WP_Widget en créant une nouvelle classe avec
un nom unique
 Il reste à créer le formulaire des réglages du
Widget
Widget

43.  Vous n’avez pas besoin d’ajouter la balise
<form> ou le bouton de soumission, ceci est
pris en charge par la classe de Widget.
Il reste à sauvegarder les réglages de votre
Widget:
Widget

44. Widget

45.  La dernière fonction de votre classe
wpday_widget, c’est celle qui affiche votre
widget:
Widget

46.  Il faut développer la fonction wpday_install()
Tables Personnalisées

47. Tables Personnalisées

48.  Une fonctionnalité intéressante à inclure dans
votre plugin
 Le meilleur scénario de désinstallation est de ne
laisser aucune trace du plugin.
Désinstaller le Plugin

49.  Si un plugin contient des failles de sécurité, il
ouvre l'ensemble du site WordPress pour les
pirates à faire des ravages. WordPress propose
certains outils intégrés de sécurité que vous
pouvez utiliser pour vous assurer que vos
plugins sont aussi sûrs que possible.
Sécurité du Plugin

50.  C’est quoi les Nonces?
 Et comment créer manuellement et vérifier les
nonces?
Nonces

51. Nonces

52. Soumission de formulaire  vérifier votre clé
secrète nonce en utilisant la fonction
check_admin_referer
Cette technique permet de se protéger contre le
Cross-Site Scripting ou XSS.
Nonces

53.  Nommage standard des fonctions de
validations:
Validation de données
1) esc_: le prefix de la fonction d’échappement
2) attr_: le contexte d’échappement
(attr, html, js, sql, url, et url_raw)
3) _e: le suffix optionnel de traduction (_ _ et _e)

54. Restrictions:
 Plugin doit être sous licence GPL
 Plugin ne doit pas faire quelque chose d'illégal ou
moralement choquant
 Vous devez utiliser Subversion (SVN) pour héberger
votre plugin
 Plugin ne doit pas inclure des liens externes sur le
site de l'utilisateur (tel que « Powered by ») sans
demander la permission à l'utilisateur du plugin
Publier votre Plugin

55. 1. Créer un compte WordPress.org
2. Sur « Développer Center » cliquez sur
« Add your Plugin »
3. Remplir le formulaire:
 Nom du plugin (Important)
 Description du Plugin (fonctionnalités, but
du plugin, les instructions d'installation)
 URL du Plugin (non requis).
Soumettre votre Plugin

56. 4. Créez votre fichier readme.txt (Obligatoire)
 Récupérer le standard de fichier sur votre compte
Wordpress.org  Developper Center  Readme Standard
 Remplir le fichier avec vos informations
 Validez votre fichier à l’aide du validateur de
WordPress: WordPress.org  Developper Center 
Readme Validator
5. Configuration SVN: le répertoire de Plugin de
WordPress est sous SVN et pour publier un
Plugin, vous auriez besoin d’installer et de configurer
un client SVN (vous pouvez utiliser TortoiseSVN)
Soumettre votre Plugin

57.  Après configuration de SVN  3 répertoires
vont être créé
 branches
 tags
 trunk
 Mettre le contenu de votre plugin dans le
répertoire trunk avec la présence du fichier
readme.txt
Soumettre votre Plugin

58.  Are you ready?  Yes !
1. Commitez le contenu du trunk
2. Taguez votre version
  Après 15mn, le plugin apparaitra dans le
répertoire de Plugin de WordPress
Soumettre votre Plugin

59. Questions / Réponses