Comment créer des variantes d'articles dans votre Divi Cloud

Publié: 2022-07-04

L'un des avantages de Divi Cloud est la possibilité d'avoir plusieurs variantes de la même mise en page à portée de main. Créez facilement plusieurs versions d'une mise en page avec différentes couleurs, photos, typographies, etc. Créer des variantes d'articles est simple avec Divi Cloud. Dans ce post, nous verrons comment créer des déclinaisons d'articles dans votre cloud Divi. Nous explorerons également plusieurs façons de créer les variantes d'un en-tête et discuterons des meilleures pratiques pour créer des variantes d'éléments.

Meilleures pratiques pour les variantes d'articles

Lors de la création de variations d'articles, il est important de savoir facilement que l'article est une variation, de quoi il s'agit et de ce qui est différent de l'original. Cela peut être fait avec des noms, des catégories et des balises. Divi créera automatiquement l'instantané pour vous, de sorte que vous pourrez voir la mise en page visuellement à la fois sous forme de vignette et d'image plus grande dans la vue Détails de la mise en page.

Utilisez des noms, des catégories et des balises qui indiquent clairement qu'il s'agit d'une variante d'une autre mise en page. Ils doivent être descriptifs, afin que vous sachiez de quoi la mise en page est une variation et quelle est la variation. Cela inclut l'ajout de la couleur ou d'une description de conception similaire au nom. concentrez-vous sur les principales différences.

Par exemple, "En-tête minimal (bleu)" et "En-tête minimal (blanc)" sont descriptifs et indiquent qu'il s'agit d'une variante d'une mise en page appelée "En-tête minimal". Ils décrivent également ce qui est différent de l'original. Ils sont courts, simples et faciles à comprendre en un coup d'œil.

Les variantes que j'utilise dans cet article sont des modifications mineures. Je ne changerai pas les catégories mais je changerai les balises et utiliserai des noms avec des descriptions.

Créer la mise en page d'en-tête

Nous allons commencer par comment ajouter une mise en page d'en-tête au Divi Cloud. Vous pouvez utiliser une mise en page prédéfinie ou créer l'en-tête à partir de zéro. J'utilise l'en-tête et le pied de page GRATUITS pour le pack de mise en page des services électriques de Divi pour mes exemples. J'appellerai cet en-tête l'en-tête des services électriques. Je vais sélectionner En-têtes pour la catégorie et sélectionner l'une des deux balises.

Créer l'en-tête dans le générateur de thèmes

Tout d'abord, créez l'en-tête dans Divi Theme Builder. Pour plus d'informations sur l'utilisation de Divi Theme Builder, recherchez "theme builder" dans le blog Elegant Themes. Vous trouverez de nombreux articles qui vous guideront à travers divers aspects du créateur de thème. Le processus est simple, mais je l'ai divisé en étapes plus petites pour le garder gérable.

Tout d'abord, activez le Visual Builder en naviguant vers « Divi » > « Theme Builder » dans le tableau de bord WordPress.
Créez l'en-tête de l'une des trois manières suivantes. Sélectionnez "Ajouter un en-tête global", ajoutez "Nouveau modèle" ou choisissez l'option "Portabilité" et créez ou importez votre mise en page d'en-tête.
Cliquez sur l'icône Modifier pour l'en-tête que vous souhaitez ajouter au Divi Cloud.

Enregistrer l'en-tête dans Divi Cloud

Ensuite, modifiez votre en-tête et enregistrez la mise en page sur votre Divi Cloud.

Cliquez sur l'icône violette "Enregistrer dans la bibliothèque" en bas de la page.
Saisissez le nom de la mise en page, sélectionnez Enregistrer dans le cloud, puis choisissez vos catégories et balises.
Cliquez sur "Enregistrer dans la bibliothèque".
Fermez l'éditeur de Theme Builder.
Sélectionnez « Enregistrer les modifications » dans le coin supérieur gauche du générateur de thèmes.

Créer des variantes d'articles

Ensuite, nous allons créer deux variantes de notre en-tête d'origine. Il existe plusieurs façons de créer des variantes d'articles pour le Divi Cloud. Nous allons examiner quelques options différentes.

Variante de mise en page d'en-tête 1

Pour notre première variante, nous allons continuer à travailler dans le Divi Theme Builder. Cela suit le processus de création de la disposition d'en-tête d'origine. Nous dupliquerons différentes pages telles que les catégories, les produits, les services, etc.

Dupliquer le modèle d'en-tête

Tout d'abord, dupliquez l'en-tête et attribuez-le à un emplacement.

Activez le Visual Builder en naviguant vers « Divi » > « Theme Builder » dans le tableau de bord WordPress.
Sélectionnez l'icône Dupliquer au-dessus du modèle global.
Choisissez les emplacements que vous souhaitez attribuer à ce modèle dans la fenêtre contextuelle et cliquez sur "Enregistrer" en bas.

Enregistrer la variation dans le Cloud Divi

Ensuite, modifiez l'en-tête et enregistrez-le dans le Divi Cloud.

Cliquez sur l'icône Modifier pour l'en-tête que vous souhaitez ajouter au Divi Cloud.
Cliquez sur l'icône violette "Enregistrer dans la bibliothèque" en bas de la page.
Saisissez le nom de la mise en page, sélectionnez Enregistrer dans le cloud, puis choisissez vos catégories et balises. Choisissez des noms, des catégories et des balises qui indiquent clairement qu'il s'agit d'une variante d'une autre mise en page.
Cliquez sur "Enregistrer dans la bibliothèque".
Fermez l'éditeur de Theme Builder.
Sélectionnez « Enregistrer les modifications » dans le coin supérieur gauche du générateur de thèmes.

Variante de mise en page d'en-tête deux

Pour notre deuxième variante, nous allons dupliquer l'en-tête et le modifier dans Divi Cloud. Pour cela, nous quitterons Divi Theme Builder et utiliserons Visual Builder sur n'importe quelle page ou publication Divi.

Dupliquer la disposition de l'en-tête

Tout d'abord, vous devrez charger la mise en page dans l'éditeur Divi Cloud.

Tout d'abord, activez Visual Builder en accédant à n'importe quelle page du front-end de votre site Web Divi et en cliquant sur "Activer Visual Builder" dans votre barre d'outils en haut de l'écran.
Cliquez sur l'icône violette plus dans la barre d'outils Divi en bas de la page pour ouvrir la bibliothèque Divi.
Cliquez sur l'onglet en haut intitulé "Vos mises en page enregistrées".
Ensuite, visualisez vos éléments Divi Cloud. Cliquez sur la case à cocher intitulée « My Divi Cloud » sous Emplacements dans la barre latérale gauche.
Localisez la mise en page que vous souhaitez dupliquer en recherchant, triant ou filtrant les éléments Divi Cloud. Recherchez par mots-clés ou favoris, sélectionnez des catégories et/ou des balises pour les filtrer, ou triez-les en fonction de l'heure, du nom ou des favoris.
Faites un clic droit sur la mise en page que vous souhaitez dupliquer.
Sélectionnez "Dupliquer" dans le menu contextuel.
Vous pouvez également cliquer avec le bouton droit sur l'aperçu dans l'écran Détails de la mise en page pour ouvrir les éléments de menu et cliquer sur "Dupliquer" dans le menu contextuel.
Un modal s'ouvrira où vous pourrez sélectionner les détails. Ajoutez un nouveau nom dans le champ "Nom de la mise en page". Sélectionnez les catégories souhaitées pour cette mise en page ou ajoutez de nouvelles catégories. Sélectionnez ou ajoutez de nouvelles balises. Saisissez le nom de la mise en page, sélectionnez « Enregistrer dans le cloud » et choisissez vos catégories et balises. Choisissez des noms, des catégories et des balises qui indiquent clairement qu'il s'agit d'une variante d'une autre mise en page.
Cliquez sur le bouton de la coche verte lorsque vous avez terminé. La mise en page est automatiquement enregistrée dans votre Divi Cloud, vous n'aurez donc pas besoin d'enregistrer la page.

Modifier la mise en page à l'intérieur du cloud

Ensuite, apportez vos modifications à la mise en page Divi à l'aide de Divi Visual Builder. Cela fonctionne de la même manière que Visual Builder dans n'importe quelle page, sauf pour l'enregistrement dans la bibliothèque, les paramètres de page et la portabilité. L'éditeur est déjà activé, vous pouvez donc commencer à apporter vos modifications.

Localisez la mise en page que vous souhaitez modifier en recherchant, triant ou filtrant les éléments Divi Cloud. Recherchez par mots-clés ou favoris, sélectionnez des catégories et/ou des balises pour les filtrer, ou triez-les en fonction de l'heure, du nom ou des favoris.
Faites un clic droit sur la mise en page que vous souhaitez modifier.
Sélectionnez « Éditer avec Divi » dans le menu contextuel. La mise en page s'ouvrira dans un nouvel onglet, plutôt qu'une page sur votre site Web, avec le Visual Builder activé.
Vous pouvez également cliquer avec le bouton droit sur l'aperçu dans l'écran Détails de la mise en page pour ouvrir les éléments de menu et cliquer sur "Modifier avec Divi" dans le menu contextuel.
Modifiez simplement la mise en page avec Divi Builder comme d'habitude. Ajoutez ou personnalisez des sections, des lignes, des colonnes, des modules, du code, etc.

Enregistrer les modifications de variation d'en-tête dans le cloud

Enfin, enregistrez vos modifications. Les modifications sont automatiquement enregistrées dans le Divi Cloud.

Cliquez sur "Enregistrer l'élément cloud" dans le coin inférieur droit de la mise en page pour enregistrer les modifications.
Attendez que les modifications soient enregistrées. Les modifications sont enregistrées dans le cloud lui-même.
Fermez l'onglet lorsque vous avez terminé la modification. Il ne s'agit pas d'une page de votre site Web, vous n'aurez donc pas besoin de quitter Visual Builder.

Mettre fin aux pensées

C'est notre regard sur la façon de créer des variations d'articles dans votre Divi Cloud. Divi facilite la création de variantes et leur stockage dans le cloud. Il existe plusieurs manières de créer des variantes. Quelle que soit la méthode que vous utilisez, assurez-vous de créer des noms descriptifs et d'utiliser des catégories et des balises qui vous aideront à comprendre la variation en un coup d'œil. Divi Cloud est un excellent moyen de stocker plusieurs variantes à utiliser sur n'importe quel site Web Divi.

Nous voulons de vos nouvelles. Avez-vous créé des variantes d'articles dans Divi Cloud ? Faites-nous part de votre expérience dans les commentaires.