Dévelopement extensions WordPress

59
{ Développement d’extensions Code is Poetry [email protected] Par Samir IZZA

description

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

Transcript of Dévelopement extensions WordPress

Page 1: Dévelopement extensions WordPress

{

Développement d’extensions

Code is Poetry

[email protected] Par Samir IZZA

Page 2: Dévelopement extensions WordPress

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

Page 3: Dévelopement extensions WordPress

Avoir des notions dans le langage PHP

Avoir des connaissances rudimentaire à l’HTML

Un peu d’Anglais

Prérequis

Page 4: Dévelopement extensions WordPress

WordPress populaire.Facile à personnaliser.Comprendre l’API de WordPress.

Introduction

Page 5: Dévelopement extensions WordPress

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

Page 6: Dévelopement extensions WordPress

Le Header

Doit être au top Doit être seulement sur le fichier principal Exemple de Header

Le Header

Page 7: Dévelopement extensions WordPress

Licence du Plugin

Page 8: Dévelopement extensions WordPress

Fonctions Activate & Desactivate

Page 9: Dévelopement extensions WordPress

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

Page 10: Dévelopement extensions WordPress

Internationalisation

Page 11: Dévelopement extensions WordPress

Fin de traduction Chargement du fichier de localisation

Internationalisation

Page 12: Dévelopement extensions WordPress

➤ WP_CONTENT_URL ➤ WP_CONTENT_DIR ➤ WP_PLUGIN_URL ➤ WP_PLUGIN_DIR ➤ WP_LANG_DIR

Les Constantes

Page 13: Dévelopement extensions WordPress

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

Page 14: Dévelopement extensions WordPress

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

Page 15: Dévelopement extensions WordPress

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

Page 16: Dévelopement extensions WordPress

publish_post

create_category

switch_theme

wp_head

admin_head

Actions populaires

Page 17: Dévelopement extensions WordPress

wp_footer

init

admin_init

user_register

comment_post

Actions populaires

Page 18: Dévelopement extensions WordPress

Filtres populaires

the_content

the_content_rss

the_title

comment_text

wp_title

the_permalink

Page 19: Dévelopement extensions WordPress

1. Sauvegarde des options du Plugin: add_option et update_option

Récupérer une valeur:

Supprimer une valeur :

Réglages du Plugin

Page 20: Dévelopement extensions WordPress

2. Tableau d’options :

Réglages du Plugin

Page 21: Dévelopement extensions WordPress

Pour récupérer les données de ces options, utilisez la fonction get_option

Réglages du Plugin

Page 22: Dévelopement extensions WordPress

Menu principal Sous menu

Menu & Sous-Menu

Page 23: Dévelopement extensions WordPress

1. Créer un menu principal: Plusieurs pages de réglages utiliser la fonction add_menu_page comme suit:

Menu & Sous-Menu

Page 24: Dévelopement extensions WordPress

2. Créer un sous menu: Utilisez la fonction add_submenu_page

Menu & Sous-Menu

Page 25: Dévelopement extensions WordPress

3. Ajouter un sous menu au menu principal

Menu & Sous-Menu

Page 26: Dévelopement extensions WordPress

add_dashboard_page

add_posts_page

add_media_page

add_links_page

add_pages_page

add_comments_page

Menu & Sous-Menu

Page 27: Dévelopement extensions WordPress

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

Page 28: Dévelopement extensions WordPress

Page d’options

Page 29: Dévelopement extensions WordPress

Le hook ‘admin_init’ exécute la fonction wpday_register_settings comme suit:

Définition des options

Page d’options

Page 30: Dévelopement extensions WordPress

Création de la fonction de la page d’options:

Page d’options

Page 31: Dévelopement extensions WordPress

Page d’options

Page 32: Dévelopement extensions WordPress

1. Meta Box

2. Sidebar

3. Widget

4. ShortCode

Intégration WordPress

Page 33: Dévelopement extensions WordPress

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

Page 34: Dévelopement extensions WordPress

$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

Page 35: Dévelopement extensions WordPress

Maintenant il faut créer la fonction wpday_meta_box

Meta Box

Page 36: Dévelopement extensions WordPress

Meta Box

Page 37: Dévelopement extensions WordPress

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

Page 38: Dévelopement extensions WordPress

Affichage des valeurs de vos éléments MetaBox dans votre site:

Meta Box

Page 39: Dévelopement extensions WordPress

2. Shortcodes:

Shortcodes

Page 40: Dévelopement extensions WordPress

[mysite] http://example.com Vous pouvez aussi utiliser les paramètres

dans les fonction du Shortcode [mysite param=value]

Shortcodes

Page 41: Dévelopement extensions WordPress

3. Widget:

Widget

Page 42: Dévelopement extensions WordPress

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

Page 43: Dévelopement extensions WordPress

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

Page 44: Dévelopement extensions WordPress

Widget

Page 45: Dévelopement extensions WordPress

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

Widget

Page 46: Dévelopement extensions WordPress

Il faut développer la fonction wpday_install()

Tables Personnalisées

Page 47: Dévelopement extensions WordPress

Tables Personnalisées

Page 48: Dévelopement extensions WordPress

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

Page 49: Dévelopement extensions WordPress

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

Page 50: Dévelopement extensions WordPress

C’est quoi les Nonces?

Et comment créer manuellement et vérifier les nonces?

Nonces

Page 51: Dévelopement extensions WordPress

Nonces

Page 52: Dévelopement extensions WordPress

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

Page 53: Dévelopement extensions WordPress

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)

Page 54: Dévelopement extensions WordPress

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

Page 55: Dévelopement extensions WordPress

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, but du plugin, les instructions d'installation)

URL du Plugin (non requis).

Soumettre votre Plugin

Page 56: Dévelopement extensions WordPress

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

Page 57: Dévelopement extensions WordPress

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

Page 58: Dévelopement extensions WordPress

Are you ready? Yes !

1. Commitez le contenu du trunk2. Taguez votre version

Après 15mn, le plugin apparaitra dans le répertoire de Plugin de WordPress

Soumettre votre Plugin

Page 59: Dévelopement extensions WordPress

Questions / Réponses