Share
Dans cette série, nous travaillons sur un plugin dans le seul but d'introduire un sélecteur de date jQuery dans l'éditeur de publication à l'aide d'une méta-boîte de publication, puis de l'afficher sur le site du site..
Plutôt que de faire une série complète et détaillée sur un sujet approfondi dans WordPress - le but de cette série est de se concentrer sur un sujet très spécialisé..
Dans le premier article de la série, nous avons accompli ce qui suit:
Dans cet article, nous allons reprendre le travail en implémentant le sélecteur de date jQuery, en stockant la date dans la publication, puis en préparant le plugin pour la publication..
Nous avons déjà effectué trois des six étapes nécessaires à la mise en œuvre de notre plugin. Il s’agit maintenant d’incorporer tout le code JavaScript nécessaire pour afficher le sélecteur de couleurs et récupérer les données..
Mais grâce à WordPress, ce n’est pas si difficile, car une grande partie de ce dont nous avons besoin est déjà fournie avec l’application principale..
Pour implémenter le sélecteur de date jQuery, nous avons besoin de plusieurs dépendances:
Tout d'abord, ajoutez la ligne suivante à votre constructeur:
Accentsconagua
add_action ('admin_enqueue_scripts', tableau ($ this, 'register_admin_scripts')); Ensuite, nous devons définir la fonction qui mettra en file d'attente la bibliothèque de sélecteur de date jQuery ainsi que notre propre fichier JavaScript personnalisé..
Alors allez-y et définissez register_admin_scripts et la ligne d'inclusion du sélecteur de date jQuery:
/ ** * Enregistre et met en file d'attente le code JavaScript spécifique à l'administrateur. * * @version 1.0 * @since 1.0 * / public function register_admin_scripts () wp_enqueue_script ('jquery-ui-datepicker'); // end register_admin_scripts Ensuite, présentez un js répertoire dans votre plugin, puis ajoutez un admin.js déposer dans ce répertoire.
Le fichier doit contenir le code JavaScript suivant:
(function ($) $ (function () // Vérifiez que la zone de saisie existe si (0 < $('#datepicker').length ) $('#datepicker').datepicker(); // end if ); (jQuery)); En termes simples, ce fichier exécutera le code JavaScript pour chaque page où le tableau de bord est chargé. Là est une autre façon de gérer cela, mais cela dépasse le cadre de cet article.
Au lieu de cela, nous avons notre vérification JavaScript pour l'existence de l'élément. S'il existe, alors il applique la sélecteur de date plugin à l'élément.
Enfin, nous devons enregistrer la feuille de style jQuery Date Picker avec notre plugin. Pour ce faire, ajoutez la ligne suivante à votre register_admin_styles une fonction:
wp_enqueue_style ('jquery-ui-datepicker', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/smoothness/jquery-ui.css'); A ce stade, actualisez le plugin et vous devriez pouvoir cliquer sur le bouton contribution élément et voir quelque chose comme ça:
Assez cool, n'est-ce pas? Notez que lorsque vous sélectionnez une date, celle-ci est automatiquement appliquée à l'élément d'entrée. Si vous souhaitez personnaliser davantage le format de date (ou d’autres aspects du sélecteur de date), n’oubliez pas de consulter la documentation de votre API..
À ce stade, nous sommes prêts à afficher la date sur le poste réel. Pour les besoins de notre plugin, nous allons ajouter ceci au contenu.
Pour ce faire, définissez le hook suivant dans le constructeur de votre plugin:
add_action ('the_content', tableau ($ this, 'prepend_the_date')); Ensuite, nous devons définir la fonction. C'est très simple, cependant. Vérifiez-le, puis je l'expliquerai après l'extrait de code:
/ ** * Enregistre les données d'achèvement du projet pour l'identifiant de post entrant. * * @param int Identifiant de publication actuel. * @version 1.0 * @since 1.0 * / public function prepend_the_date ($ content) // Si la méta de publication n'est pas vide pour 'the_date', alors la restitue dans le contenu if (0! = ($ the_date = get_post_meta ( get_the_ID (), 'the_date', true))) $ content = ''. $ the_date. '
'. $ contenu; // end if return $ content; // end prepend_the_date
Dans cette fonction, nous vérifions les métadonnées de la publication pour la publication en cours. Puisque cette fonction est activée dans le contexte de The Loop, nous pouvons utiliser get_the_ID ().
Si la chaîne de date - c’est-à-dire que la méta de la poste est saisie par la date - n'est pas vide, alors nous l'envelopperons dans une balise de paragraphe et le ajouterons au $ contenu; sinon, nous renvoyons simplement le $ contenu tel quel.
À ce stade, il ne reste que deux choses à faire:
La création du fichier de localisation est simple. Depuis que nous avons défini le plugin.po fichier dans le premier article, tout ce que nous devons faire est d'ouvrir le fichier avec Poedit, cliquez sur "Mettre à jour", puis enregistrez le fichier. Cela va générer un plugin.mo déposer dans le lang annuaire.
Ensuite, nous devons créer un LISEZMOI fichier qui respecte les conventions du fichier Lisez-moi de WordPress. Bien que vous puissiez être aussi créatif que vous le souhaitez, j'ai partagé le mien ci-dessous.
=== WordPress jQuery Date Picker === Contributeurs: tommcfarlin Tags: date, publication Nécessite au moins: 3.5 Testé jusqu'à: 3.5.1 Balise stable: 1.0 Un exemple de plug-in utilisé pour montrer comment inclure le sélecteur de date jQuery dans le message éditeur. == Description == WordPress jQuery Date Picker est un plugin simple utilisé pour montrer comment tirer parti des boîtes à méta, des métadonnées et des plug-ins jQuery personnalisés pour permettre aux utilisateurs de sélectionner les dates à afficher dans leurs messages. == Installation == = Utilisation du tableau de bord WordPress = 1. Accédez au tableau de bord du plugin 'Ajouter un nouveau' 2. Sélectionnez 'wordpress-jquery-date-picker.zip' à partir de votre ordinateur 3. Téléchargez 4. Activez le plugin sur WordPress. Plugin Dashboard = Using FTP = 1. Extrayez 'wordpress-jquery-date-picker.zip' sur votre ordinateur 2. Téléchargez le répertoire 'wordpress-jquery-date-picker' dans votre répertoire 'wp-content / plugins' 3. Activez le plugin sur le tableau de bord des plugins WordPress == Foire aux questions == = Pour le moment, la date apparaît uniquement en haut de la publication. Puis-je changer sa position? = Non == Historique == = 1.0 = * Version initiale
Rien d'innovant - dit simplement ce qu'il fait.
Si vous ne l'avez pas déjà fait, assurez-vous de récupérer la dernière version du plugin sur GitHub, lisez les commentaires et suivez-la pour vous assurer de bien comprendre tout ce qui se passe dans le plugin..
Et c'est tout - assez facile, à droite?
Comme d'habitude, s'il vous plaît laissez des commentaires et des questions dans le formulaire ci-dessous.
