Notre propre constructeur de pages, Avada Builder, est désormais disponible dans deux interfaces : Avada Builder, qui est notre constructeur de pages filaire back-end, et Avada Live, qui est notre constructeur front-end, qui n'a été introduit que récemment avec Avada 6.0. .
Grâce à notre système simple de conteneurs, de colonnes et d'éléments, les deux versions d'Avada Builder vous permettent de concevoir facilement de superbes mises en page pour votre site Web. Avada Builder est un outil fantastique pour les concepteurs de sites Web modernes et les propriétaires de sites, car il leur donne un contrôle total sur tous les aspects du contenu et de la mise en page des pages. Les deux versions d'Avada Builder génèrent également le même code. Ils sont complètement interchangeables, vous permettant d’avoir le meilleur des deux mondes avec Avada Builder, actuellement disponible.
La page Layout Builder est l'endroit où vous trouverez toutes vos mises en page et toutes les mises en page conditionnelles que vous souhaiterez peut-être créer en plus de la mise en page globale créée par défaut. Ici se trouve également la zone dans laquelle vous attribuez des sections de mise en page à vos mises en page et spécifiez les conditions pour que vos mises en page conditionnelles prennent effet.
Le Layout Builder est accessible à partir du tableau de bord Avada en sélectionnant Layouts > Layout Builder dans le menu déroulant. L'une des façons les plus simples de décrire les mises en page est de dire qu'il s'agit de conteneurs qui hébergent les quatre sections de mise en page d'une page : la section d'en-tête, la section de barre de titre de page, la section de contenu et la section de pied de page. Vous pouvez en savoir plus sur les différences entre les sections de mise en page et les mises en page en lisant ce document : Comprendre les mises en page et les sections de mise en page (PDF). Continuez à lire pour en savoir plus sur les choses que vous pouvez faire sur cette page.
Deux parties sont situées tout en haut de la page Layout Builder. Une technique pour remplir les sections de mise en page dans la mise en page globale ou générer des mises en page conditionnelles est décrite dans la première section (indice : vous pouvez la fermer avec le X), et sur le côté droit de l'écran se trouve une zone à partir de laquelle vous pouvez créez directement de nouvelles mises en page (voir ci-dessous). Tapez un nom pour votre nouvelle mise en page, puis cliquez sur Créer une nouvelle mise en page pour terminer le processus. Une mise en page vierge est créée lorsque cette méthode est utilisée ; aucune section ou condition de mise en page n'est spécifiée.
Au fur et à mesure que vous créez des mises en page, elles sont automatiquement importées dans la page Layout Builder. Vous pouvez renommer une mise en page en cliquant sur le bouton Renommer en haut de la page. Vous pouvez également cliquer sur l'icône en forme de rouage pour établir les conditions de la mise en page, et vous pouvez supprimer une mise en page en cliquant sur l'icône Corbeille en haut de la page. Vous pouvez également voir et attribuer des critères en cliquant en bas de toutes les mises en page, à l'exception de la mise en page globale.
Dans chaque mise en page, vous pouvez voir les quatre sections de mise en page affectées à une mise en page particulière, une pour chacune des quatre mises en page. Dans chaque section de mise en page, vous verrez une icône +, qui vous permettra d'attribuer une section de mise en page à cette section de la mise en page lorsque vous déplacez votre souris dessus. Vous avez la possibilité d'attribuer une section de mise en page existante à cette section ou de créer une toute nouvelle section à partir de zéro.
Dans le cadre d'Avada Layouts, vous pouvez désormais créer des pieds de page entièrement personnalisables pour votre site Web, en tirant parti de toute la capacité créative d'Avada Builder pour y parvenir.
Une mise en page de pied de page est une section de mise en page ajoutée à une mise en page. Par amp , un pied de page personnalisé nécessite une section de mise en page de pied de page, qui peut être ajoutée à la mise en page globale ou personnalisée. Nous verrons la création d'une section de mise en page de pied de page personnalisée dans la section suivante, mais examinons d'abord la présentation des mises en page Avada.
Dans la barre latérale WordPress ou dans le tableau de bord Avada, sélectionnez Avada > Mises en page. Les mises en page et les sections de mise en page d'Avada sont créées et gérées ici. Comme indiqué ci-dessous, la mise en page globale est initialement vide, sans aucune section de mise en page associée.
Cette section peut être ajoutée à la mise en page globale ou à une mise en page conditionnelle, s'affichant uniquement sur certains types de publications personnalisés ou sur des pages uniques. La mise en page globale est déjà présente, mais nous devons d'abord développer une mise en page conditionnelle.
Sur la page Mises en page, ajoutez un nom et cliquez sur Créer une nouvelle mise en page, comme indiqué ci-dessous.
Créez une section de mise en page de pied de page si vous souhaitez l'ajouter à une mise en page existante ou à la mise en page globale.
Sur l'écran Layout Section Builder, sélectionnez le type de section de mise en page, entrez un nom (dans cet amp , pied de page, éventuellement pied de page global) et cliquez sur Créer une nouvelle section de mise en page, comme indiqué ci-dessous.
L'image suivante montre comment générer une section de mise en page directement à partir de la mise en page. Les sections de mise en page de votre site doivent être ajoutées à une mise en page. Au départ, il existe simplement une mise en page globale. Donc, pour créer un pied de page personnalisé global, ajoutez-le à cette mise en page. Section Disposition du pied de page personnalisée, puis ajoutez des conditions à la section Disposition du pied de page personnalisée pour que la mise en page apparaisse selon les critères.
Il n’y a rien de mal à cela, mais il est essentiel de considérer la situation. Si la mise en page est actuellement active (c'est-à-dire qu'elle comporte des conditions ou qu'elle est la mise en page globale), toutes les nouvelles sections de mise en page seront immédiatement actives et vides. Il est plus logique d'ajouter d'abord un pied de page personnalisé à une mise en page globale via la page Layout Section Builder, puis de l'ajouter à la mise en page globale.
Alternativement, nous pouvons ajouter une section de mise en page de pied de page, d’en-tête ou de colonne à une mise en page conditionnelle, puis la créer. Les conditions ne sont pas utilisées tant que des conditions ne sont pas ajoutées. Comme illustré ci-dessous, nous pouvons modifier la section de disposition du pied de page en la survolant et en cliquant sur l'icône d'édition.
L'éditeur WordPress par défaut apparaît lors de la modification d'une nouvelle section de mise en page ; vous pouvez utiliser Avada Builder ou Avada Live à partir d'ici. Les sections de mise en page personnalisées sont créées ici. Pour plus d'informations, consultez Création de contenu de section de mise en page, mais en bref, vous pouvez créer n'importe quoi ici.
Votre pied de page personnalisé peut contenir tout ce que vous pouvez construire dans Avada Builder. Vous pouvez avoir de nombreuses colonnes, photos, etc. ; Cela permet une immense flexibilité. La section Mise en page est l'endroit où le matériel de pied de page apparaîtra. Le matériau vient du Constructeur, et votre créativité est la seule contrainte.
Voir le pied de page original créé pour la démo Taxi ci-dessous ; Cela a été réalisé en modifiant les options de thème et les widgets de pied de page.
La version de bureau de cet en-tête personnalisé est présentée ici, mais pour saisir correctement la portée de cet en-tête personnalisé, vous devez visiter le site en direct, auquel vous pouvez accéder ici.
Aucune condition dans une présentation globale. L’ajout de sections de mise en page sera utilisé sur chaque page car il est global. Si vous n'aviez besoin d'un pied de page personnalisé que sur certaines pages de votre site, comme des articles de blog uniques, vous devrez utiliser une mise en page conditionnelle.
Une mise en page conditionnelle ne peut contenir que des sections de mise en page existantes. Ensuite, sous l'onglet Sélectionner le pied de page de la mise en page, faites défiler jusqu'à Existant, où vous pouvez ajouter la section de mise en page, comme indiqué ci-dessous.
Vous devez définir les conditions de toute mise en page conditionnelle. Le Layout est actif dès que les conditions sont précisées ; Par conséquent, si vous faites cela avant d'établir la section Mise en page, les pages qui correspondent aux conditions seront vides.
Pour ajouter une condition, sélectionnez Ajouter une condition dans le menu inférieur de la mise en page. Une boîte de dialogue apparaît, comme indiqué ci-dessous. Pour plus d'informations sur les mises en page conditionnelles, voir Comprendre les mises en page conditionnelles, mais pour cet amp , nous sélectionnerions Toutes les publications dans l'onglet Conditions des publications, comme indiqué ci-dessous.
L'élément Column, comme l'élément Container, est un composant structurel essentiel lors de la conception d'un site Avada.
L'ajout de colonnes est relativement simple avec Avada Layout Builder.
Une colonne ne peut être placée qu'à l'intérieur d'un élément conteneur de même largeur ; Il s'agit généralement de la largeur du site que vous définissez pour le site. Ainsi, si vous définissez la largeur du site sur 1 200 px, une 1/2 colonne aura une largeur de 600 px. Les tailles de colonnes prédéfinies sont affichées ci-dessous lorsqu’elles sont ajoutées à une page.
Dans Avada, vous pouvez définir les largeurs de colonnes (et plus) séparément sur les mises en page grandes, moyennes et petites. Comment définir l'ordre d'affichage et la taille des colonnes dans les mises en page réactives explique comment utiliser cette excellente nouvelle fonctionnalité avec les colonnes.
Les largeurs personnalisées se trouvent sous Colonnes > Conception > Largeur . Comme indiqué ci-dessous, l'utilisation d'un pourcentage vous permet de spécifier une largeur personnalisée. Ainsi, le positionnement est illimité
Auto est une nouvelle option de largeur. Au lieu d'une largeur fixe, la colonne occupera l'espace de l'élément le plus significatif à l'intérieur. Cela ne fonctionne donc que dans certains cas. Vous pouvez changer la colonne parent en Auto et la colonne sera redimensionnée à la largeur de l'élément.
Avada ajoute également des ensembles d'options réactifs pour les conteneurs et les colonnes. Dans le back-end du générateur, vous pouvez voir les icônes réactives sur n'importe quelle colonne, comme le montre l'image ci-dessous. Le Front-End Builder affiche les icônes réactives sur les options.
Seuls les nouveaux conteneurs Flex affichent des ensembles d'options réactifs. Les colonnes des conteneurs hérités ne sont pas disponibles.
Grâce à Avada Layouts, la possibilité de créer un pied de page personnalisé, un en-tête et d'ajouter des colonnes est désormais une réalité et une option presque illimitée. Non seulement vous pouvez utiliser la puissance d'Avada Builder pour créer pratiquement n'importe quel pied de page ou en-tête que vous pouvez imaginer, mais vous pouvez également tirer parti de la puissance des mises en page conditionnelles pour les afficher ou les masquer sur n'importe quelle page, catégorie, type de publication personnalisé ou toute combinaison de critères auxquels vous pouvez penser en utilisant Avada Builder.
En ce qui concerne les mises en page WordPress, Avada Layouts change la donne au sens le plus littéral du terme. Le fait qu’il permet une telle liberté de conception et une telle flexibilité de déploiement signifie que le processus de création des pieds de page ne sera plus jamais le même.
Les en-têtes et pieds de page d’un site Web sont des éléments essentiels. Dans la plupart des cas, l'en-tête fournit la navigation…
Astra et OceanWP sont deux des thèmes WordPress les plus populaires sur le marché. Professionnel…
Créer un excellent site Web d'actualités ne nécessite pas que vous deveniez un concepteur de sites Web. Nous…
Le thème Newspaper est l'un des thèmes WordPress les plus importants conçus par tagDiv, un…
Lorsqu'il s'agit de créer une boutique en ligne, WooCommerce est le plugin incontournable. Il…
Un en-tête est généralement la première chose qu’une personne voit lorsqu’elle visite votre site Web,…