{Développementd’extensionsCode is Poetrysamirmember@gmail.com Par Samir IZZA
 Prérequis Introduction Avant de commencer Le Header Licence du Plugin Les fonctions Activate etDesactivate Interna...
 Avoir des notions dans le langage PHP Avoir des connaissances rudimentaire àl’HTML Un peu d’Anglais Prérequis
WordPress populaire.Facile à personnaliser.Comprendre l’API de WordPress.Introduction
 Choisir un nom unique pour votre extensions. Les fichiers des plugins sont dans le répertoire wp-content/plugins/ de Wo...
Le Header Doit être au top Doit être seulement sur le fichier principal Exemple de HeaderLe Header
Licence du Plugin
Fonctions Activate & Desactivate
 L’internationalisation (i18n). L’internationalisation n’est pas obligatoire.1. La fonction _ _():2. La fonction _e():3....
Internationalisation
 Fin de traduction Chargement du fichier de localisationInternationalisation
➤ WP_CONTENT_URL➤ WP_CONTENT_DIR➤ WP_PLUGIN_URL➤ WP_PLUGIN_DIR➤ WP_LANG_DIRLes Constantes
1. Actions: Les actions sont les crochets que lenoyau de WordPress lance à des pointsspécifiques en cours dexécution, ou l...
2. Filtres: Les filtres sont les crochets queWordPress lance pour modifier le texte dedivers types, avant de lajouter à la...
 Liste des Filtres:http://codex.wordpress.org/Plugin_API/Filter_Reference Liste des Actions:http://codex.wordpress.org/P...
 publish_post create_category switch_theme wp_head admin_headActions populaires
 wp_footer init admin_init user_register comment_postActions populaires
Filtres populaires the_content the_content_rss the_title comment_text wp_title the_permalink
1. Sauvegarde des options du Plugin: add_option etupdate_optionRécupérer une valeur:Supprimer une valeur :Réglages du Plugin
2. Tableau d’options :Réglages du Plugin
 Pour récupérer les données de ces options, utilisezla fonction get_optionRéglages du Plugin
Menu principal Sous menuMenu & Sous-Menu
1. Créer un menu principal:Plusieurs pages de réglages  utiliser lafonction add_menu_page comme suit:Menu & Sous-Menu
2. Créer un sous menu:Utilisez la fonctionadd_submenu_pageMenu & Sous-Menu
3. Ajouter un sous menu au menu principalMenu & Sous-Menu
 add_dashboard_page add_posts_page add_media_page add_links_page add_pages_page add_comments_pageMenu & Sous-Menu
  Sauvegarder des options facilement  Comment créer des pages pour cesoptions ???  Créer un menu facilement  Et le...
Page d’options
 Le hook ‘admin_init’ exécute la fonctionwpday_register_settings comme suit:  Définition des optionsPage d’options
 Création de la fonction de la page d’options:Page d’options
Page d’options
1. Meta Box2. Sidebar3. Widget4. ShortCodeIntégration WordPress
1. Meta Box: Pour ajouter une meta box il faut utiliser lafonction add_meta_box en utilisant les 6paramètres suivants: C...
 $id: l’attribut ID CSS du meta box $title: Le titre affiché dans le header du meta box $callback: Nom de la fonction p...
 Maintenant il faut créer la fonctionwpday_meta_boxMeta Box
Meta Box
 Création du Meta Box  OK Création du formulaire  OK Sauvegarder les données à chaque enregistrementd’une page  Pas ...
 Affichage des valeurs de vos éléments MetaBoxdans votre site:Meta Box
2. Shortcodes:Shortcodes
 [mysite]  http://example.com Vous pouvez aussi utiliser les paramètres dansles fonction du Shortcode[mysite param=valu...
3. Widget:Widget
 Pour commencer, il faut étendre la classeWP_Widget en créant une nouvelle classe avecun nom unique Il reste à créer le ...
 Vous n’avez pas besoin d’ajouter la balise<form> ou le bouton de soumission, ceci estpris en charge par la classe de Wid...
Widget
 La dernière fonction de votre classewpday_widget, c’est celle qui affiche votrewidget:Widget
 Il faut développer la fonction wpday_install()Tables Personnalisées
Tables Personnalisées
 Une fonctionnalité intéressante à inclure dansvotre plugin Le meilleur scénario de désinstallation est de nelaisser auc...
 Si un plugin contient des failles de sécurité, ilouvre lensemble du site WordPress pour lespirates à faire des ravages. ...
 C’est quoi les Nonces? Et comment créer manuellement et vérifier lesnonces?Nonces
Nonces
Soumission de formulaire  vérifier votre clésecrète nonce en utilisant la fonctioncheck_admin_refererCette technique perm...
 Nommage standard des fonctions devalidations:Validation de données1) esc_: le prefix de la fonction d’échappement2) attr...
Restrictions: Plugin doit être sous licence GPL Plugin ne doit pas faire quelque chose dillégal oumoralement choquant ...
1. Créer un compte WordPress.org2. Sur « Développer Center » cliquez sur« Add your Plugin »3. Remplir le formulaire: Nom ...
4. Créez votre fichier readme.txt (Obligatoire) Récupérer le standard de fichier sur votre compteWordpress.org  Developp...
 Après configuration de SVN  3 répertoiresvont être créé branches tags trunk Mettre le contenu de votre plugin dans...
 Are you ready?  Yes !1. Commitez le contenu du trunk2. Taguez votre version  Après 15mn, le plugin apparaitra dans le...
Questions / Réponses
Prochain SlideShare
Chargement dans…5
×

Dévelopement extensions WordPress

770 vues

Publié le

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

Publié dans : Technologie
3 commentaires
3 j’aime
Statistiques
Remarques
Aucun téléchargement
Vues
Nombre de vues
770
Sur SlideShare
0
Issues des intégrations
0
Intégrations
1
Actions
Partages
0
Téléchargements
46
Commentaires
3
J’aime
3
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Dévelopement extensions WordPress

  1. 1. {Développementd’extensionsCode is Poetrysamirmember@gmail.com Par Samir IZZA
  2. 2.  Prérequis Introduction Avant de commencer Le Header Licence du Plugin Les fonctions Activate etDesactivate 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 PluginSommaire
  3. 3.  Avoir des notions dans le langage PHP Avoir des connaissances rudimentaire àl’HTML Un peu d’Anglais Prérequis
  4. 4. WordPress populaire.Facile à personnaliser.Comprendre l’API de WordPress.Introduction
  5. 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 deWordPress.Avant de commencer
  6. 6. Le Header Doit être au top Doit être seulement sur le fichier principal Exemple de HeaderLe Header
  7. 7. Licence du Plugin
  8. 8. Fonctions Activate & Desactivate
  9. 9.  L’internationalisation (i18n). L’internationalisation n’est pas obligatoire.1. La fonction _ _():2. La fonction _e():3. La fonction _ _ngettext (pluriel): Disant que voussouhaitez traduire la phrase suivante:Internationalisation
  10. 10. Internationalisation
  11. 11.  Fin de traduction Chargement du fichier de localisationInternationalisation
  12. 12. ➤ WP_CONTENT_URL➤ WP_CONTENT_DIR➤ WP_PLUGIN_URL➤ WP_PLUGIN_DIR➤ WP_LANG_DIRLes Constantes
  13. 13. 1. Actions: Les actions sont les crochets que lenoyau de WordPress lance à des pointsspécifiques en cours dexécution, ou lorsquedes événements spécifiques. Votre pluginpeut spécifier que lune ou plusieurs de sesfonctions PHP sont exécutés à ces points.Syntaxe:Actions & Filters
  14. 14. 2. Filtres: Les filtres sont les crochets queWordPress lance pour modifier le texte dedivers types, avant de lajouter à la base dedonnées ou de lenvoyer au navigateur. Votreplugin peut spécifier que lune ou plusieurs deses fonctions PHP est exécuté pour modifier lecontenu du texte ou des données.Syntaxe:Actions & Filters
  15. 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. 16.  publish_post create_category switch_theme wp_head admin_headActions populaires
  17. 17.  wp_footer init admin_init user_register comment_postActions populaires
  18. 18. Filtres populaires the_content the_content_rss the_title comment_text wp_title the_permalink
  19. 19. 1. Sauvegarde des options du Plugin: add_option etupdate_optionRécupérer une valeur:Supprimer une valeur :Réglages du Plugin
  20. 20. 2. Tableau d’options :Réglages du Plugin
  21. 21.  Pour récupérer les données de ces options, utilisezla fonction get_optionRéglages du Plugin
  22. 22. Menu principal Sous menuMenu & Sous-Menu
  23. 23. 1. Créer un menu principal:Plusieurs pages de réglages  utiliser lafonction add_menu_page comme suit:Menu & Sous-Menu
  24. 24. 2. Créer un sous menu:Utilisez la fonctionadd_submenu_pageMenu & Sous-Menu
  25. 25. 3. Ajouter un sous menu au menu principalMenu & Sous-Menu
  26. 26.  add_dashboard_page add_posts_page add_media_page add_links_page add_pages_page add_comments_pageMenu & Sous-Menu
  27. 27.   Sauvegarder des options facilement  Comment créer des pages pour cesoptions ???  Créer un menu facilement  Et le contenu de sa page? Créer une page d’option = Créer la fonctionde la page d’options que vous avez définitlors de la création de son menu.Page d’options
  28. 28. Page d’options
  29. 29.  Le hook ‘admin_init’ exécute la fonctionwpday_register_settings comme suit:  Définition des optionsPage d’options
  30. 30.  Création de la fonction de la page d’options:Page d’options
  31. 31. Page d’options
  32. 32. 1. Meta Box2. Sidebar3. Widget4. ShortCodeIntégration WordPress
  33. 33. 1. Meta Box: Pour ajouter une meta box il faut utiliser lafonction add_meta_box en utilisant les 6paramètres suivants: Chaque paramètre indique comment et ouvotre meta box sera affiché.Meta Box
  34. 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 vosinformations 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 doitafficher (’normal’,‘advanced’, or ‘side’) $priority: La priorité dans le context d’affichage du MetaBox (’high’, ‘core’, ‘default’, or ‘low’)Meta Box
  35. 35.  Maintenant il faut créer la fonctionwpday_meta_boxMeta Box
  36. 36. Meta Box
  37. 37.  Création du Meta Box  OK Création du formulaire  OK Sauvegarder les données à chaque enregistrementd’une page  Pas encore : wpday_save_meta_box quidoit être déclencher après chaque action hook save_postMeta Box
  38. 38.  Affichage des valeurs de vos éléments MetaBoxdans votre site:Meta Box
  39. 39. 2. Shortcodes:Shortcodes
  40. 40.  [mysite]  http://example.com Vous pouvez aussi utiliser les paramètres dansles fonction du Shortcode[mysite param=value]Shortcodes
  41. 41. 3. Widget:Widget
  42. 42.  Pour commencer, il faut étendre la classeWP_Widget en créant une nouvelle classe avecun nom unique Il reste à créer le formulaire des réglages duWidgetWidget
  43. 43.  Vous n’avez pas besoin d’ajouter la balise<form> ou le bouton de soumission, ceci estpris en charge par la classe de Widget.Il reste à sauvegarder les réglages de votreWidget:Widget
  44. 44. Widget
  45. 45.  La dernière fonction de votre classewpday_widget, c’est celle qui affiche votrewidget:Widget
  46. 46.  Il faut développer la fonction wpday_install()Tables Personnalisées
  47. 47. Tables Personnalisées
  48. 48.  Une fonctionnalité intéressante à inclure dansvotre plugin Le meilleur scénario de désinstallation est de nelaisser aucune trace du plugin.Désinstaller le Plugin
  49. 49.  Si un plugin contient des failles de sécurité, ilouvre lensemble du site WordPress pour lespirates à faire des ravages. WordPress proposecertains outils intégrés de sécurité que vouspouvez utiliser pour vous assurer que vosplugins sont aussi sûrs que possible.Sécurité du Plugin
  50. 50.  C’est quoi les Nonces? Et comment créer manuellement et vérifier lesnonces?Nonces
  51. 51. Nonces
  52. 52. Soumission de formulaire  vérifier votre clésecrète nonce en utilisant la fonctioncheck_admin_refererCette technique permet de se protéger contre leCross-Site Scripting ou XSS.Nonces
  53. 53.  Nommage standard des fonctions devalidations:Validation de données1) esc_: le prefix de la fonction d’échappement2) attr_: le contexte d’échappement(attr, html, js, sql, url, et url_raw)3) _e: le suffix optionnel de traduction (_ _ et _e)
  54. 54. Restrictions: Plugin doit être sous licence GPL Plugin ne doit pas faire quelque chose dillégal oumoralement choquant Vous devez utiliser Subversion (SVN) pour hébergervotre plugin Plugin ne doit pas inclure des liens externes sur lesite de lutilisateur (tel que « Powered by ») sansdemander la permission à lutilisateur du pluginPublier votre Plugin
  55. 55. 1. Créer un compte WordPress.org2. Sur « Développer Center » cliquez sur« Add your Plugin »3. Remplir le formulaire: Nom du plugin (Important) Description du Plugin (fonctionnalités, butdu plugin, les instructions dinstallation) URL du Plugin (non requis).Soumettre votre Plugin
  56. 56. 4. Créez votre fichier readme.txt (Obligatoire) Récupérer le standard de fichier sur votre compteWordpress.org  Developper Center  Readme Standard Remplir le fichier avec vos informations Validez votre fichier à l’aide du validateur deWordPress: WordPress.org  Developper Center Readme Validator5. Configuration SVN: le répertoire de Plugin deWordPress est sous SVN et pour publier unPlugin, vous auriez besoin d’installer et de configurerun client SVN (vous pouvez utiliser TortoiseSVN)Soumettre votre Plugin
  57. 57.  Après configuration de SVN  3 répertoiresvont être créé branches tags trunk Mettre le contenu de votre plugin dans lerépertoire trunk avec la présence du fichierreadme.txtSoumettre votre Plugin
  58. 58.  Are you ready?  Yes !1. Commitez le contenu du trunk2. Taguez votre version  Après 15mn, le plugin apparaitra dans lerépertoire de Plugin de WordPressSoumettre votre Plugin
  59. 59. Questions / Réponses

×