De nombreux blogueurs rechercheront haut et bas pour le widget WordPress parfait qui fera exactement ce qu`ils veulent, mais vous pouvez trouver avec un peu d`expérience de la programmation, il est plus facile d`écrire votre widget personnalisé.

Video: Tutoriel WordPress : Elementor Page Builder

Cette semaine, je voudrais montrer comment de faire exactement cela, et le widget, nous allons écrire est un simple qui capte un message aléatoire unique à partir de votre site, tire l`image sélectionnée, et l`affiche dans la barre latérale - un visuel widget de « vérifier cela » qui aidera les utilisateurs à trouver plus de contenu sur votre site.

Ceci est également une extension d`une série continue où je vous montre comment il est facile de personnaliser votre modèle WordPress.2 New Cool Wordpress & Comprendre la structure du thème Wordpress2 New Cool Wordpress & Comprendre la structure du thème WordpressCette semaine, je serai jeter un oeil à une alternative supérieure au All-In-One souvent loué un plugin qui SEO-vous donne la puissance d`un système de publication Wordpress, mais permet de produire ...Lire la suite

Vous pouvez également être heureux de savoir que nous avons ajouté une nouvelle catégorie Tutoriels WordPress à MakeUseOf, alors assurez-vous de vérifier que pour une archive sans cesse croissante jusqu`à ce jour et des conseils de guides à la plate-forme de blogging préférée du monde.

Concepts clés: Requêtes WordPress et la boucle

Chaque page sur votre blog se compose d`une requête à la base de données de messages. En fonction de la page affichée, la requête va changer. Votre page d`accueil du blog par exemple, peut utiliser la requête «obtenir les 10 derniers messages de blog« . Lorsque vous affichez les archives de la catégorie, la requête peut changer pour «Obtenir les derniers 20 messages pour les photos de famille de catégorie seulement, trier les résultats par date de publication« . Chaque requête renvoie un ensemble de résultats, et en fonction du modèle de page utilisé, chaque résultat sera courir à travers la « boucle » principale du modèle.

Chaque page peut en effet être constitué de plus d`une requête si, et vous pouvez même créer vos propres requêtes pour ajouter des fonctionnalités à divers endroits dans votre modèle. Vous pouvez voir un exemple de cette utilisation dans au bas de cet article - nous avons quelques questions supplémentaires qui fonctionnent sur chaque page qui visent à vous montrer des articles connexes vous intéresser, ou des articles qui affichent une tendance cette semaine.

Pour rendre notre widget personnalisé bien, nous allons tout simplement besoin de créer une requête supplémentaire qui attire un nombre X de messages aléatoires ainsi que leurs images, et les affiche en quelque sorte sur la barre latérale. Je vous ai déjà montré la semaine dernière, le code saisir l`image sélectionnée, donc nous avons vraiment juste besoin de savoir comment faire un nouveau WordPress widget et le placer sur la barre latérale. Comment Jazz de votre WordPress Ajout ImagesComment Jazz de votre WordPress Ajout ImagesImages ont été introduits dans Wordpress dans la version 2.9, et il vous permet d`afficher facilement une image qui est associée à votre poste de blog dans différentes parties de votre thème. Aujourd`hui, je voudrais montrer ...Lire la suite

Basic Code du Widget

Commencez par créer un nouveau fichier .php dans votre wp-content / plugins annuaire. Vous pouvez également suivre le tutoriel hors ligne puis le télécharger en utilisant l`interface WordPress, mais je trouve qu`il est plus facile d`écrire que nous progressons dans le cas où vous avez besoin de déboguer. Appelez votre dossier que vous voulez, mais je vais avec aléatoire post-widget.php

Coller ce qui suit dans le fichier et enregistrez. Ne hésitez pas à changer la section en haut avec mon nom, mais ne pas régler le reste du code encore. Ceci est essentiellement un widget vide squelette, et vous pouvez voir où il est dit // CODE WIDGET ICI GOES est où nous allons ajouter notre fonctionnalité plus tard.

lt;? php/ * Nom du plug-in: Random Poster WidgetPlugin URI: http://jamesbruce.me/Description: Random post Widget saisit un message aléatoire et la vignette associée à afficher sur votre sidebarAuthor: James BruceVersion: URI 1Author: http://jamesbruce.me / * /classe RandomPostWidget étend WP_Widget{fonction RandomPostWidget(){widget_ops de $ = tableau(`nom du cours` =gt; `RandomPostWidget`, `la description` =gt; « Affiche un message aléatoire miniature » )-$ this-gt;WP_Widget(`RandomPostWidget`, « Au hasard Thumbnail », widget_ops de $)-}fonction forme($ exemple){$ exemple = wp_parse_args( (tableau) $ exemple, tableau( `Titre` =gt; « » ) )-$ title = $ exemple[`Titre`]-?gt;lt;pgt;lt;étiquette pour="lt;? php écho $ this-gt;get_field_id(`Titre`)- ?gt;"gt;Titre: lt;contribution classe="widefat" ça="lt;? php écho $ this-gt;get_field_id(`Titre`)- ?gt;" prénom="lt;? php écho $ this-gt;get_field_name(`Titre`)- ?gt;" type="texte" valeur="lt;? php écho attribute_escape($ title)- ?gt;" / Gt;étiquettegt;pgt;lt;? php}fonction mettre à jour(new_instance de $, $ old_instance){$ exemple = $ old_instance-$ exemple[`Titre`] = new_instance de $[`Titre`]-revenir $ exemple-}fonction un widget($ args, $ exemple){extrait($ args, EXTR_SKIP)-écho $ before_widget-$ title = vide($ exemple[`Titre`]) ? « » : apply_filters(`Widget_title`, $ exemple[`Titre`])-si (!vide($ title))écho before_title de $ . $ title . $ after_title--// CODE WIDGET ICI GOESécho "
Ceci est mon nouveau widget!
"-écho $ after_widget-}}add_action( `Widgets_init`, create_function(« », « Retour register_widget ("RandomPostWidget") - ») )-?gt;

Comme il est, le plug-in ne fait pas beaucoup à part imprimer un grand titre avec les mots «Ceci est mon nouveau widget!« .

Il ne vous donne cependant la possibilité de changer le titre, ce qui est assez indispensable pour tout gadget. Ajout dans d`autres options est un peu au-delà de la portée de cet article aujourd`hui, donc pour maintenant nous allons passer à donner un but réel.

Une nouvelle requête & La boucle

Pour faire une nouvelle requête à votre base de données de blog, vous devez utiliser la query_posts () fonction ainsi que quelques paramètres, exécuter ensuite à travers la sortie en utilisant une boucle de temps. Essayons - une requête très basique et boucle pour démontrer. Remplacez la ligne de code qui dit:

Ceci est mon nouveau widget!

ce qui suit:

// CODE WIDGET ICI GOESquery_posts(« »)-si (have_posts()) :tandis que (have_posts()) : la poste()-le titre()-endwhile-fin si-wp_reset_query()-

Ceci est une requête absolument de base en utilisant les options par défaut et zéro formatage de la sortie. Selon la façon dont votre blog est mis en place, la valeur par défaut sera le plus susceptible de saisir les 10 derniers messages - puis tout le code ci-dessus n`est sortie le titre de chaque poste. Il est assez laid, mais ça fonctionne:

Nous pouvons faire un peu mieux tout de suite en ajoutant simplement une mise en forme HTML à la sortie avec le ÉCHO commande, et la création d`un lien vers le message en utilisant get_the_permalink () fonction:

Video: TUTO - Comment créer son widget pour Wordpress

query_posts(« »)-si (have_posts()) :écho ""-tandis que (have_posts()) : la poste()-écho "".get_the_title().""-endwhile-écho ""-fin si-wp_reset_query()-

Video: Tutoriel WordPress - Créer un site Wordpress depuis une maquette HTML

Déjà, il est à la recherche beaucoup mieux. Mais nous voulons qu`un seul poste, choisi au hasard. Pour ce faire, nous précisons certains paramètres de la requête:

query_posts(« Posts_per_page = 1&orderby = rand »)-

Bien sûr, vous pouvez changer à tout nombre de postes - en fait, il y a toute une gamme de bits supplémentaires que vous pouvez passer dans la requête afin de limiter, étendre ou modifier l`ordre des résultats, mais nous allons en tenir à cela pour à présent. Si vous actualisez, vous devriez voir à un poste qui est aléatoire à chaque fois que vous actualisez.

Maintenant, pour la vignette sélectionnée. Remplacez le code avec cela, nous espérons que vous pouvez voir où nous l`accaparement de la vignette et l`afficher:

query_posts(« Posts_per_page = 1&orderby = rand »)-si (have_posts()) :écho ""-tandis que (have_posts()) : la poste()-écho "".get_the_title()-écho the_post_thumbnail(tableau(220,200))-écho ""-endwhile-écho ""-fin si-wp_reset_query()-

Vous pouvez voir les résultats finis à nouveau sur mon blog de développement Guide Autosuffisance, bien que je pourrais avoir déplacé les choses au moment où vous lisez ceci.

Conclusion:

Voyez comment il est facile de faire votre propre widget personnalisé qui peut faire exactement ce que vous voulez? Même si vous ne comprenez pas 90% du code que je vous ai montré aujourd`hui, vous devriez toujours être en mesure de le personnaliser un peu en changeant simplement les variables ou la sortie HTML différent. Nous avons écrit aujourd`hui un widget entier, mais vous pouvez facilement utiliser simplement le nouveau code de requête et boucle sur l`un de vos modèles de page.

Problèmes? Vous avez besoin d`autre aide liée à WordPress? Je suis toujours à portée de main pour aider à Réponses MakeUseOf, si la tête sur plus et poster une nouvelle question là-bas.