wordpress de la barre latérale. Barres latérales WordPress, création de barres latérales WordPress. Widget WordPress par défaut

Affiche le premier panneau de widgets actif (une barre latérale est un panneau qui contient au moins un widget). Vous pouvez spécifier l'ID ou le numéro du panneau, celui à afficher, si le site a plus d'un panneau de widgets.

dynamic_sidebar() renvoie true ou false, le résultat renvoyé affichant également la barre de widgets. La valeur de retour peut être utilisée, par exemple, pour déterminer si le code qui remplace les widgets doit être traité lorsqu'il n'y a pas de widgets dans le panneau (voir l'exemple #1).

Retour

true si le panneau du widget a été trouvé. false si le panneau n'existe pas ou ne contient aucun widget.

Usage

$index (chaîne/nombre) L'ID du panneau spécifié dans le paramètre id de la fonction register_sidebar() lors de l'enregistrement du panneau. Si un nombre est donné, alors le panneau avec ID sidebar-$index sera recherché.
Par défaut : 1 (barre latérale-1)

Exemples

#1 Affichez la barre latérale si elle existe.

Cet exemple montre comment afficher la première barre latérale non vide (l'identifiant de la barre latérale n'a pas été spécifié lors de l'inscription) ou s'il n'est pas trouvé, traiter le code spécifié :

#2 Affichez la barre latérale souhaitée.

#3 Vérifiez la présence du panneau et affichez-le

Dans l'exemple 2, nous n'avons pas vérifié la présence d'un panneau et de widgets dans celui-ci. Dans cet exemple, nous allons vérifier la présence d'un panneau afin de ne pas afficher inutilement Balises HTML (

",

[ crayon - 5e1ff7d787fb8042608178 inline = "true" ] "after_widget" => "" ,

avant_titre

La plupart des widgets affichent un titre si l'utilisateur le saisit. Argument avant_titre c'est l'élément d'ouverture du titre du widget. Par défaut, WordPress l'écrit comme < h2 > . Pour utiliser des balises < h2 > pas la peine, dans ce cas les balises feront l'affaire < h3 > Et < h4 > . Pour l'intuitivité et la lisibilité du code, ne créez pas de noms de classe sans tirets, afin qu'il soit plus pratique pour vous de lire le nom vous-même, c'est très important si vous n'avez pas travaillé avec le site depuis un certain temps.

après_titre

Argument après_titre c'est l'élément de fermeture spécifié dans l'argument avant_titre. Par défaut, WordPress l'écrit comme < / h2 > .

Vous devez vous assurer que sa valeur correspond à la valeur spécifiée dans l'argument avant_titre.

"after_title" => ""

"after_title" => ""

Afficher une barre latérale dynamique dynamic_sidebar()

Lorsque la création de la barre latérale est terminée, vous pouvez commencer à l'afficher dans le thème. WordPress a créé une fonction pour cela appelée < a title = "Fonction Codex Wordpress dynamic_sidebar()" href= "http://codex.wordpress.org/Function_Reference/dynamic_sidebar" target="_blank" > dynamic_sidebar()< / a > . Cette fonction demande toujours un paramètre $index, qui peuvent se situer simultanément à la fois dans l'argument identifiant, et dans l'argumentation nom(spécifié lors de la création de la barre latérale). Bien qu'il soit techniquement possible d'utiliser les deux, il est beaucoup plus sûr d'utiliser celui que vous avez prescrit. identifiant.

En utilisant le code ci-dessous dans l'un de vos modèles, vous pouvez positionner la barre latérale primaire décrit juste au dessus. noter que div Avec classe Et identifiant Vous pouvez changer à votre guise et visser divers CSS modes .

// appelle la fonction d'affichage de la barre du site

< div id = "id-vidgeta-primary" class = "moi-saidbar" >

// appelle la fonction d'affichage de la barre du site

< / div >

Habituellement, ce code se trouve dans le fichier barre latérale - primaire . php, que vous découvrirez dans un instant lorsque nous parlerons des modèles de barre latérale. Cependant barre_latéraledynamique() peut être appelé n'importe où dans votre thème.

  • Nous faisons et

Affichage du contenu par défaut

Certains développeurs de thèmes affichent leur propre contenu si l'utilisateur n'a épinglé aucun widget à une barre latérale spécifique. Pour rechercher des widgets dans la barre latérale, utilisez la balise conditionnelle is_active_sidebar() .

Tout comme une fonction barre_latéraledynamique(), utilisé pour remplir la barre latérale, la fonction is_active_sidebar() demande toujours un paramètre $index, qui devrait être IDENTIFIANT barre latérale que vous vérifiez.

Avec le code ci-dessous, nous pouvons tester notre barre latérale primaire pour les widgets. S'il y a des widgets, nous les afficherons ; sinon, nous afficherons le contenu que nous avons spécialement préparé.

< div id = "id-vidgeta-primary" class = "moi-saidbar" >

< / div >

Ne pas afficher la barre latérale sans widgets

La section précédente vous a montré comment positionner le contenu manquant lorsqu'une certaine barre latérale n'est pas active, mais vous avez également la possibilité de réduire complètement (ne rien afficher) une barre latérale lorsque la barre latérale n'est pas active.

Nous utiliserons à nouveau la fonction is_active_sidebar() pour vérifier la barre latérale primaire pour les widgets.

< div id = "id-vidgeta-primary" class = "moi-saidbar" >

< / div >

Au fait, ici, vous pouvez penser à des choses intéressantes. Par exemple, vous pouvez créer une largeur de barre latérale dynamique pour votre contenu en fonction des barres latérales actives et de celles qui ne le sont pas. Plus à ce sujet dans les prochains articles.

Modèles de barre latérale - Barre latérale

Nous avons abordé tous les aspects de la création et de l'utilisation d'une barre latérale dynamique, mais il convient de noter qu'il existe d'autres fonctionnalités intéressantes. Jetons donc un coup d'œil aux modèles de barre latérale.

Le modèle de la barre latérale est utilisé pour héberger le code de la barre latérale dynamique (voir « Affichage de la barre latérale dynamique » ci-dessus). En moyenne, tous les thèmes WordPress ont un modèle appelé barre latérale. php. Si votre thème a une barre latérale, ce modèle est suffisant.

Les modèles de barre latérale sont remplis à l'intérieur du thème à l'aide de la fonction get_sidebar().Le code ci-dessous est ce que j'utilise habituellement pour remplir un fichier barre latérale. php.

[crayon - 5e1ff7d788042260898923 en ligne = "vrai"]

get_sidebar() demande aussi toujours un paramètre $ nom, ce qui vous permettra de remplir des motifs plus spécifiques. Par exemple, le code ci-dessous demande un fichier modèle barre latérale - primaire . php.

[crayon - 5e1ff7d788051693571425 en ligne = "vrai"]

Afin de garder votre thème en ordre et de séparer le code, vous devez créer un modèle spécifique pour chaque barre latérale dynamique. Je vous suggère de créer d'abord deux barres latérales dynamiques avec des identifiant: primaire Et secondaire. Pour une meilleure organisation, créez deux fichiers : barre latérale - primaire . php et sidebar-secondaire. php.

Vous aurez besoin du code ci-dessous pour créer les deux modèles.

[crayon - 5e1ff7d788066428860015 en ligne = "vrai"]

Ci-dessus se trouve le code traditionnel que j'utilise pour créer des modèles. Vous pouvez le modifier légèrement pour l'adapter au mieux à vos besoins personnels. Encore faut-il s'assurer d'utiliser la fonction get_sidebar() lorsque vous remplissez le modèle de barre latérale.

Gardez à l'esprit que les modèles de barre latérale n'affichent pas toujours des barres latérales dynamiques. Ils peuvent techniquement contenir du contenu utilisateur codé capable de refléter n'importe quoi. N'oubliez pas non plus que vous pouvez placer une barre latérale dynamique dans presque tous les fichiers de votre modèle pour l'afficher sur différentes pages du site.

Mauvais code de la barre latérale

Il existe un certain nombre de défauts qui se répètent d'un code à l'autre, ce qui n'est pas acceptable sur les bons sites. Bien sûr, tous ne sont pas techniquement incorrects, mais ils peuvent entraîner des dysfonctionnements ou simplement une charge supplémentaire de code.

Problème 1 : code désordonné déversé dans les fonctions. php

Si vous développez des thèmes, vous devez savoir que les crochets intégrés de WordPress fonctionnent avec des crochets. Il faut non seulement bien les connaître, il est important de les utiliser. Le plus gros problème que j'ai trouvé est que le code est juste déversé dans les fonctions. php. Vous devez créer une fonction d'enregistrement de la barre latérale, puis l'attacher à widgets_init. Vous pouvez voir un exemple de la façon de procéder ci-dessus dans la section Enregistrer et créer une barre latérale dynamique.

En remarque : vous devez oublier que vous pouvez simplement transférer le code dans les fonctions. php. Utilisez toujours la fonction hooks dans WordPress, cela garantira que vos fonctions sont complètes à 100%.

Problème 2 : aucun identifiant enregistré

Il est important de comprendre que si l'identifiant n'est pas clairement énoncé, cela entraînera certainement certaines conséquences. Lorsque vous utilisez register_sidebar() ou register_sidebars() sans prescrire un particulier identifiant, WordPress crée automatiquement des indicateurs identifiant, en comptant le nombre de barres latérales déjà créées. Et, semble-t-il, tout est merveilleux. Mais c'est une grosse erreur. Après tout, lorsqu'un plugin ou thème enfant crée une nouvelle barre latérale, la barre latérale reçoit l'identifiant 1 (si c'est la première dans le flux), ce qui entraîne le changement de l'identifiant de toutes les autres barres latérales. Lorsque l'utilisateur accède à la barre latérale, il verra que tous ses widgets sont affectés à une autre barre latérale.

Les widgets sont attachés à la barre latérale dynamique, selon son identifiant. Si identifiant changements, les widgets se déplacent également. C'est pourquoi il est si important de bien prescrire identifiant lors de la création de la barre latérale. Ci-dessus, dans la section "Inscription et création d'une barre latérale dynamique", vous pouvez voir comment le faire correctement.

Un autre avantage d'une écriture claire identifiant c'est que tu sais exactement quoi identifiant destiné à être utilisé dans d'autres fonctions telles que barre_latéraledynamique() Et is_active_sidebar function_exists() il n'y a pas besoin. Comme mentionné précédemment dans cet article, les barres latérales dynamiques existent depuis 2007. Vous pouvez utiliser ce type de vérification uniquement pour la compatibilité descendante. Cependant, la plupart des thèmes ne sont pas rétrocompatibles, et je ne recommande pas de l'utiliser depuis la version précédente.

L'un des types courants de vérification de l'existence d'une fonction register_sidebar() présenté ci-dessous. Oubliez ce type de vérification et créez simplement une barre latérale.

si (function_exists("register_sidebar")) dynamic_sidebar include (TEMPLATEPATH . "/sidebar.php" ) ;

Ce n'est pas la meilleure façon d'afficher une barre latérale dans un thème. Le système WordPress a une fonction get_sidebar(), avec lequel vous pouvez facilement le faire. Utilisez-le toujours comme indiqué dans l'exemple ci-dessus dans la section "Modèles de barre latérale". Vous devez utiliser cette fonction car le crochet

Parfois, il y a des thèmes où il n'y a qu'une barre latérale et ils sont utilisés pour les besoins du thème lui-même, et vous ne pouvez pas y placer de nouveaux widgets. Peut-être avez-vous besoin de modifier un modèle de thème existant et d'ajouter une barre latérale supplémentaire, disons que le thème en a un sur la gauche, mais vous devez en ajouter un autre sur la droite.

Résoudre ce problème n'est pas du tout difficile. Il suffit d'apporter de petites modifications aux fichiers de thème functions.php et au fichier de modèle de la page où vous souhaitez placer la barre latérale. Comment savoir quel fichier est responsable de l'affichage des pages

Vous devez d'abord enregistrer une nouvelle barre latérale. Cela se fait dans le fichier functions.php dans le dossier du modèle. register_sidebar(array("name" =>"Nouvelle barre latérale", "id" => "zone-widget-secondaire", "before_widget" => "
  • ", "after_widget" => "
  • ", "before_title" => "

    ", "after_title" => "

    ",));

    C'est fait, une nouvelle barre latérale est apparue dans le panneau de contrôle du widget. Il ne reste plus qu'à personnaliser légèrement son apparence dans le fichier style.css (vous pouvez copier l'apparence de celle existante)

    Qu'est-ce que dans le code

    Nom– le nom de la sidebar (barre latérale), il sera affiché dans le panneau d'administration Widgets.
    identifiant- identifiant unique. Nécessaire lors de l'ajout à la page.
    avant_widget- code ou texte à insérer avant chaque widget.
    après_widget- code ou texte à insérer après chaque widget.
    avant_titre– code ou texte à insérer avant le titre du widget.
    après_titre– code ou texte à insérer après le titre du widget.

    Faites attention à l'ID, le nom de la barre latérale, dans ce cas c'est "Secondary-widget-area". Il doit être exactement le même que le nom spécifié lors de l'enregistrement dans le fichier functions.php.

    La barre latérale est un champ spécial sur le site où les widgets sont intégrés. En d'autres termes, il s'agit d'une colonne avec un contenu dynamique. Presque tous les modèles ont de telles colonnes et leur nombre peut être différent. Souvent utilisé de 1 à 4 colonnes.

    Afin de rendre n'importe quel modèle aussi unique que possible, ou simplement d'améliorer l'apparence ou de se démarquer, vous pouvez modifier la position des colonnes par rapport au champ de texte principal dans les modèles standard, gratuits et payants pour WordPress, ce que nous ferons dans cet article.

    Modification de l'emplacement de la barre latérale et du corps du texte

    Alors, disons que le modèle que nous utilisons a une colonne pour les widgets, c'est-à-dire une barre latérale et une colonne principale où le texte de nos articles et pages est placé :

    Laissez la colonne avec les widgets être située à droite et nous devons la déplacer vers la gauche jusqu'au bord. En conséquence, la colonne avec le contenu du texte principal se déplacera vers la droite jusqu'au bord même.

    Pour faire tout cela, vous devez changer un peu les styles. Le contenu textuel a souvent le style #content, tandis que le contenu du widget a souvent le style #sidebar. Il suffit de changer les propriétés du premier de float: left; sur flotteur : droite ; et dans un ordre différent pour le second.

    Modifier l'emplacement de la barre latérale dans le thème Twenty Twelwe

    Considérez tout ce qui précède sur l'exemple d'un thème réactif standard pour WordPress.

    Barre latérale - partie de presque tous les sites, généralement placée à gauche, à droite de la zone de contenu ou devant le pied de page (pied de page). Les barres latérales WordPress ne font pas exception. La seule différence est que dans WordPress, une barre latérale est une zone où les widgets sont automatiquement affichés. Vous pouvez créer un nombre illimité de barres latérales dans WordPress, mais par exemple, je vais créer deux barres latérales, à gauche et à droite de la zone de contenu principale.

    Enregistrement des barres latérales WordPress

    Pour que les barres latérales s'affichent d'abord dans le panneau d'administration, nous devons les enregistrer. En d'autres termes, ajoutez le code au fichier functions.php :

    /** * Enregistre les barres latérales. */ function fwbs_widgets_init() ( register_sidebar(array("name" => __("Right column", "fwbs"), "id" => "sidebar-1", "description" => __("Right sidebar " , "fwbs"), "avant_widget" => "

    ", "before_title" => "

    ", "after_title" => "

    ",)); register_sidebar(array("name" => __("Left column", "fwbs"), "id" => "sidebar-2", "description" => __("Left column in site footer ", "fwbs"), "avant_widget" => " ", "before_title" => "

    ", "after_title" => "

    ",)); ) add_action("widgets_init", "fwbs_widgets_init");

    Analyser le code ci-dessus pour créer des barres latérales WordPress

    Ce n'est pas aussi compliqué qu'il n'y paraît à première vue.

    • "name" => __("Right column", "fwbs") - le nom de la zone du widget, vous pouvez écrire n'importe quel nom, juste soigneusement entre les crochets, regardez l'écran, vous pouvez voir où il est affiché ;
    • "id" => "sidebar-1" - ID est un identifiant unique attribué à la barre latérale, toutes les barres latérales doivent avoir le leur, différent des autres identifiants ;
    • "description" => __("Right side column", "fwbs") - description, similaire au nom de la zone du widget ;
    • "widget_avant" => "
    • "après_widget" => "" - la balise HTML qui ferme la zone de la barre latérale. Comme nous le savons, toutes les balises HTML, à quelques exceptions près, doivent être jumelées (ouverture et fermeture) ;
    • "before_title" => "

      " - le titre du widget sera enveloppé dans une balise H4 avec la classe

      , vous pouvez modifier la signification de l'en-tête H1, H2, H3, H4, H5, H6 et attribuer vos propres classes ;

    • "after_title" => ""- fermeturepaire de balises pour le titre du widget.

    Maintenant, nous allons dans le panneau d'administration, dans la section "widgets" et regardons le résultat. Voici une photo de ce que j'ai obtenu :

    Avec ce code, j'ai enregistré deux zones de widget WordPress, maintenant je dois les afficher à l'écran.

    Affichage des barres latérales WordPress

    Pour afficher les sidebars n'importe où dans le template, il est logique d'écrire le code suivant au bon endroit :

    Quelques explications sur le code :

    • - Code PHP qui donne une commande, s'il y a des widgets dans la barre latérale sous id=sidebar-1, alors il doit être affiché à l'écran, s'il n'y a pas de widgets, la barre latérale n'est pas affichée ;
    • - Code PHP qui appelle la barre latérale sous id=sidebar-1 à l'endroit où vous l'avez écrit dans le code du modèle.

    Mais comme vous pouvez le voir, dans les modèles WordPress, le code de sortie de la barre latérale est placé dans des fichiers sidebar.php séparés, puis le contenu est sorti du fichier sidebar.php au bon endroit dans le modèle. Comme nous savons que WordPress rend le contenu de manière dynamique et que le modèle de site se compose de plusieurs parties, l'une de ses parties est le fichier sidebar.php Laissez-moi faire.

    Création du fichier sidebar.php

    Créez un fichier comme sidebar-right.php , donnez-lui un titre et collez-y le code ci-dessus. Tous ensemble, cela ressemblera à ceci:

    Comme vous pouvez le voir dans l'exemple, j'ai complété le code avec un balisage HTML supplémentaire. Maintenant, pour afficher la zone du widget, il reste à écrire ce qui suit au bon endroit :

    Pour la colonne de gauche, le fichier sidebar-left.php est créé en conséquence et affiché au bon endroit du modèle comme ceci :

    Comme on dit, trouvez une différence dans le code.

    Ça y est, les barres latérales ont été créées, il ne reste plus qu'à créer un balisage pour elles dans le modèle et à écrire des styles CSS.



    
    Haut