Créer un simple plugin Twitter pour WordPress

Code

Voyons comment pouvons-nous créer un plugin très simple montrant les derniers messages d'un compte Twitter.

Étape 1 Télécharger les scripts

Avant de commencer à écrire notre plugin, nous avons besoin de code JavaScript.

Obtenez tweetable v1.6 ici!
Prenez le dernier jquery ici!

Étape 2 Créer une structure de fichier et copier des fichiers

Créez ce répertoire: / wp-content / plugins / tweetfeed-light, puis copiez ces fichiers.

 / css style.css / img buttons.png interface.png interface_dark.png twitter_bird.png / js jquery.tweetable.min.js jquery-1.7.2.min.js

Étape 3 Données de base du plugin

Continuer avec la création tweetfeed-light.php (notre nom de fichier de plugin principal) avec le contenu donné ci-dessous.

 / * Nom du plugin: Tweetfeed Light Plugin URI: http://wp.tutsplus.com Description: Afficher les derniers Tweets dans la barre latérale pour un utilisateur Twitter donné Version: 1.0 Auteur: Adam Burucs URI de l'auteur: http://wp.tutsplus.com * /

Étape 4 La classe de plugin

La déclaration de base de notre classe de plugin.

 classe AB_Tweetfeed_Light

Étape 5 Fonction constructeur

Il est judicieux de définir les paramètres et exigences initiaux dans cette fonction. Dans cette section, nous définissons les éléments suivants:

chemin du plugin
petit code
importer des scripts
importer des styles

Le code pour ces tâches:

 fonction publique __construct () // définir le chemin du plugin $ this-> pluginUrl = WP_PLUGIN_URL. '/ tweetfeed-light'; // set shortcode add_shortcode ('tweetfeed-light', tableau ($ this, 'shortcode')); // scripts d'importation wp_enqueue_script ('script-tweetable', $ this-> pluginUrl. '/js/jquery.tweetable.min.js', array ('jquery')); // import style wp_enqueue_style ('tweetable-style', $ this-> pluginUrl. '/css/style.css');

Étape 6 Récupération des tweets

Recevez les derniers tweets d'un utilisateur. Nous pouvons également définir la variable limite contrôlant le nombre de tweets.

 fonction publique loadTweets ($ user, $ limit) // rend les tweets à l'élément div echo '
'; // rend le code javascript pour faire l'écho magique '';

Étape 7 Fonction Shortcode

Ceci est le script d'aide pour utiliser le plugin avec un shortcode.

 // rend les tweets avec shortcode fonction publique shortcode ($ data) return $ this-> loadTweets ($ data ['nomutilisateur']);

Étape 8 Instancier la classe

Faire un objet de la classe de plugin.

 // lance le plugin $ tweetfeed_light = new AB_Tweetfeed_Light ();

Étape 9 Code final

Voici à quoi ressemble le code quand il est fini.

 / * Nom du plugin: Tweetfeed Light Plugin URI: http://wp.tutsplus.com Description: Afficher les derniers Tweets dans la barre latérale pour un utilisateur Twitter donné Version: 1.0 Auteur: Adam Burucs URI de l'auteur: http://wp.tutsplus.com * / class AB_Tweetfeed_light fonction publique __construct () // définir le chemin d'accès du plugin $ this-> pluginUrl = WP_PLUGIN_URL. '/ tweetfeed-light'; // set shortcode add_shortcode ('tweetfeed-light', tableau ($ this, 'shortcode')); // scripts d'importation wp_enqueue_script ('script-tweetable', $ this-> pluginUrl. '/js/jquery.tweetable.min.js', array ('jquery')); // import style wp_enqueue_style ('tweetable-style', $ this-> pluginUrl. '/css/style.css');  fonction publique loadTweets ($ user, $ limit) // rend les tweets à l'élément div echo '
'; // rend le code javascript pour faire l'écho magique '';  // rend les tweets avec shortcode fonction publique shortcode ($ data) return $ this-> loadTweets ($ data ['utilisateur'], $ data ['limite']);  // exécuter le plugin $ tweetfeed_light = new AB_Tweetfeed_Light ();

Étape 10 Utilisation du code court

Pour utiliser ce plugin, vous pouvez écrire le [tweetfeed-light user = "johnb" limit = "10"] shortcode dans la source de page que vous voulez. Par exemple:

… … 
 [tweetfeed-light user = "johnb" limit = "10"] … 
…

Étape 11 Le look

Voici à quoi ressemble le plugin dans le thème WordPress par défaut inséré dans un objet de page.

Résumé

Comme vous pouvez le constater, c’est une solution simple mais excellente pour notre mini-mission Twitter. Pour peaufiner davantage (couleur), vous devriez regarder dans la feuille de style incluse. Merci à Icontexto pour la photo Twitter!

Code