Empiler les titres collants sur le curseur pour naviguer dans les liens d’ancrage uniques dans Divi

Vous entrerez bientôt Divi Master. Si vous êtes déjà abonné, entrez votre adresse e – mail ci – dessous et cliquez sur télécharger pour accéder au paquet Layout. Vous vous êtes inscrit avec succès. Vérifiez votre adresse e – mail pour confirmer votre abonnement et Obtenez gratuitement le paquet hebdomadaire Divi Layout! Pour importer une disposition de section dans la Bibliothèque Divi, allez à la Bibliothèque Divi.
Cliquez sur le bouton importer. Dans la fenêtre contextuelle de portabilité, sélectionnez l’onglet importer, puis sélectionnez les fichiers téléchargés à partir de votre ordinateur. Puis cliquez sur le bouton importer.

Une fois terminé, la disposition de la section est disponible dans Divi Builder. Commençons le tutoriel. Pour commencer, vous devez faire ce qui suit: si ce n’est pas déjà fait, installez et activez le thème Divi. Créez une nouvelle page dans WordPress et utilisez Divi Builder pour éditer la page à l’avant (Visual Builder). Sélectionnez l’option select default Layout. À partir de la fenêtre contextuelle upload from Library, trouvez et téléchargez la mise en page de la page de recette de repas dans le paquet de mise en page de repas. Partie 2: modifier la mise en page supprimer les lignes après le chargement de la mise en page, supprimer les deux lignes sous la deuxième partie appelée description. Vous devriez maintenant avoir une ligne de recette pour l’étape 01. Créez une nouvelle ligne et remplissez – la d’un titre permanent dans la colonne de gauche des deux lignes de colonne. Pour créer cette configuration, ajoutez une nouvelle ligne de colonne en dessous des trois quarts de la ligne courante. En utilisant multiselect (maintenez CMD \ Ctrl enfoncé et cliquez), sélectionnez les trois modules qui contiennent le contenu de la première étape de la recette dans la ligne de mise en page par défaut ci – dessus. Ensuite, faites glisser les modules dans la colonne de droite de la nouvelle ligne nouvellement créée. Supprimez les lignes vides ci – dessus lorsque vous avez terminé. P
10003 Cela garantit que l’en – tête reste au – dessus de l’en – tête lorsque d’autres en – têtes permanents sont accumulés sur l’appareil mobile. Mise à jour du contenu virtuel avant de copier nos lignes, pour plus d’étapes, extraire le titre H4 du formulaire texte en haut de la colonne 2. Ensuite, copiez le deuxième formulaire de texte (avec le texte du paragraphe) dans la colonne 2 et collez – le trois fois sous le formulaire d’image. Cela nous donnera plus de contenu à parcourir. Copiez la ligne 1, créez la deuxième ligne pour l’étape 2, copiez la ligne 1. Créer un titre adhésif pour la deuxième ligne (étape 2) Ouvrez les paramètres de texte pour le titre dans la colonne 1 de la ligne dupliquée (deuxième ligne) et changez le texte H4 en « étape 02 ». Puis mettre à jour les options permanentes pour le texte comme suit: décalage permanent du Haut: 50 Px (bureau), 0 Px (tablette) décalage permanent du Bas: 100 Px (bureau) limite visqueuse du Haut: Section (tablette) Puis mettre à jour l’index Z permanent: index Z (visqueux): 10002 Copiez la ligne 2, créez la troisième ligne pour l’étape 3, copiez la ligne 2. Créez un titre collé pour la troisième ligne (étape 3) Ouvrez les paramètres de texte du titre dans la colonne 1 de la ligne dupliquée (ligne 3) et changez le texte H4 en « étape 03 ». Ensuite, mettez à jour les options permanentes pour le texte comme suit: décalage adhésif supérieur: 100 Px (bureau) décalage de fond permanent: 50 Px (bureau) Puis mettre à jour l’index Z permanent: index Z (visqueux): 10001 Copiez la ligne 3, créez la quatrième ligne pour l’étape 4 et Copiez la ligne 3. Pour créer un titre permanent pour la quatrième ligne (étape 4), ouvrez le paramètre texte du titre dans la colonne 1 de la ligne répétée (troisième ligne) et changez le texte H4 en « étape 04 ». Ensuite, mettez à jour les options permanentes pour le texte comme suit: décalage supérieur de l’adhésif: 150 Px (bureau) ou
Offset permanent background: 0px (Desktop) Puis mettre à jour l’index Z permanent: index Z (visqueux): 10 000 Mise à jour de l’index de colonne Z pour chaque titre collant bien que nous ayons mis à jour l’index Z pour chaque titre collant, nous devons également mettre à jour l’index Z pour chaque colonne mère de titre afin de nous assurer que l’ordre de chevauchement sur l’appareil mobile est valide. Pour ce faire, ouvrez les paramètres de chaque colonne principale pour chaque titre permanent (étapes 1 à 4) et mettez à jour l’index Z de chaque colonne principale comme suit: ligne 1, colonne 1 INDEX Z: 20 ligne 2, colonne 1 INDEX Z: 19 ligne 3, colonne 1 INDEX Z: 18 ligne 4, colonne 1 INDEX Z: 17 Partie 3: créer un lien d’ancrage d’en – tête collant pour créer un lien d’ancrage pour chaque en – tête, nous devons assigner un ID CSS à la ligne qui correspond à l’URL du formulaire pour l’en – tête. Étape 1 liens d’ancrage pour créer un lien d’ancrage pour le premier titre permanent de la ligne 1, ouvrez les paramètres de la ligne 1 et ajoutez l’ID CSS suivant: CSS id: One Ouvrez ensuite les paramètres du formulaire de texte pour l’en – tête Step – 01 et ajoutez l’URL de lien suivante au formulaire: URL de lien du formulaire: \ # one Étape 2 liens d’ancrage pour créer un lien d’ancrage pour le deuxième titre permanent de la ligne 2, ouvrez les paramètres de la ligne 2 et ajoutez l’ID CSS suivant: CSS id: Two Ensuite, ouvrez les paramètres du formulaire texte pour l’en – tête \

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *