Comment réduire Titre Global lors du défilement avec Divi & # 39; Générateur de thème s

Cet ID CSS est nécessaire plus loin dans ce tutoriel pour utiliser les effets de rétrécissement. CSS id: largeur de ligne Enfin, et ce n’est pas le moins important, pour s’assurer que toutes les colonnes apparaissent côte à côte sur des écrans plus petits et que tout le contenu des colonnes est centré, nous ajouterons deux lignes de code CSS à l’élément principal de la ligne. Affichage: Flex;
Aligner les éléments: Centre; Ajouter un module image à la colonne 1 charger le logo il est temps d’ajouter un module, en commençant par le module image dans la colonne 1. Téléchargez un logo avec un fond transparent. Le redimensionnement modifie la largeur du module plus tard. Largeur: 5vw (bureau), 9vw (tablette), 13vw (téléphone) Ajoutez le module de menu à la colonne 2, sélectionnez le commutateur de menu à la colonne 2, puis entrez le module de menu. Sélectionnez le menu que vous avez sélectionné. Supprimer la couleur de fond ensuite, supprimer la couleur de fond du formulaire. Passez à l’onglet conception du formulaire et modifiez la disposition.
Styles: orientation centrale des menus déroulants: déroulants Le texte du menu ouvre ensuite les paramètres du texte du menu et apporte quelques modifications. Police du menu: Rubik menu text color: # 000000 menu text size: 0.9vw (Desktop), 2vw (tablette), 3vw (mobile) Le menu déroulant modifie également les paramètres du menu déroulant. Couleur de fond de la liste déroulante: # FFFFFF couleur de la ligne déroulante: # 2970fa L’icône e complète la configuration du module en changeant la couleur de l’icône du menu hamburger dans les paramètres de l’icône. Couleur de l’icône du menu Hamburger: # 2970fa Ajouter un module bouton à la colonne 3 ajouter une copie à la colonne suivante et à la dernière colonne. Ajoutez un formulaire de bouton et une copie de votre choix. Alignement modifie l’alignement du formulaire suivant. Alignement des boutons: à droite Les paramètres des boutons modélisent les boutons en conséquence: en utilisant des styles
Transition: tous les 0,9 sont réduits de 0;
Largeur: 100%! Important
}
– Oui. Transition lente
Transition: tous les 0,9 sont réduits de 0;
}
Contenu principal
Limite supérieure de profit: 5vw;
} 3. Après avoir sauvegardé les modifications du générateur et vu les résultats ajouter le Code, vous pouvez enregistrer toutes les modifications apportées au titre global et voir les résultats sur le site Web! Aperçu maintenant que nous avons terminé toutes les étapes, regardons enfin les résultats sur les différents écrans de taille. Bureau Mobile Dans cet article, nous vous montrons comment créer un titre global plus petit en utilisant Divi Theme Builder. Un titre étroit est une bonne façon d’économiser de l’espace de hauteur dans la fenêtre des visiteurs. Nous recréerons la conception à partir de zéro et ajouterons du code personnalisé pour activer l’effet de rétrécissement. Vous pouvez également télécharger gratuitement le fichier json! Si vous avez des questions ou des suggestions, veuillez les commenter immédiatement dans la section commentaires ci – dessous! Si vous souhaitez en savoir plus sur Divi et recevoir plus de cadeaux sur Divi, assurez – vous de vous abonner à notre newsletter et à YouTube Channel afin que vous soyez toujours l’un des premiers à apprendre et à bénéficier de ce contenu gratuit.