Le système de mise en page Flexbox de Divi 5 est arrivé

Aujourd'hui, nous présentons le tout nouveau système de mise en page basé sur Flexbox pour Divi 5.

Ce n'est pas une mise à jour mineure. Il réinvente Divi, vous permettant de construire n'importe quelle structure de mise en page, y compris la rupture de disposition réactive, la commande de modules personnalisés, l'alignement vertical facile et le positionnement des éléments, et bien plus encore.

Aucune pierre n'a été retournée, aucune option n'a été oubliée - nous avons tout fait, et c'est mieux en classe.

Découvrez la vidéo suivante pour voir la nouvelle fonctionnalité en action.

Le tout nouveau système de mise en page de Divi 5

Nous avons réinventé le système de mise en page de Divi et ajouté de nombreux nouveaux modèles de lignes et options de mise en page. Vous pouvez créer n'importe quelle disposition à l'aide de Flexbox, de lignes imbriquées et de groupes de modules !

Le nouveau système de disposition facilite le positionnement, l'espacement, l'emballage et la commande de contrôle.

Une sélection robuste de nouveaux modèles de lignes Flexbox

Vous remarquerez d'abord une sélection de nouveaux modèles de lignes, y compris les options de multi-rangs imbriquées. Il y a tellement plus de variations à apprécier!

Vous n'êtes pas limité à ces modèles; Ce sont des exemples prédéfinis. Une fois que vous avez creusé dans les panneaux de paramètres, il n'y a pas de garde-corps; Vous pouvez ajouter autant de colonnes que vous le souhaitez et leur donner n'importe quelle taille que vous souhaitez, nidiquant des lignes dans des colonnes pour créer n'importe quelle disposition.

Contrôles Flexbox pour tout

De nouvelles options Flexbox sont disponibles pour tout. Vous pouvez contrôler l'enveloppement de disposition, la direction, l'ordre, l'espacement, le positionnement des éléments enfants, et plus encore - pas de piratage, pas de javascript, pas de gâchis, juste des contrôles intuitifs qui fonctionnent à merveille.

Structures de lignes réactives

La construction de sites Web réactifs n'a jamais été aussi simple.

À chaque point d'arrêt, vous pouvez attribuer différentes structures à une seule ligne. C'est aussi simple que divi le fait mieux que tout autre constructeur, vous permettant de transformer complètement la disposition de chaque appareil. Vous pouvez également personnaliser la taille des colonnes sur chaque périphérique et ajuster tout paramètre Flexbox.

Commande d'élément réactive

L'ordre d'élément réactif est un jeu d'enfant.

Vous pouvez facilement modifier la direction dans laquelle les éléments circulent sur chaque appareil et l'ordre des éléments individuels. Vous pouvez modifier complètement la structure des lignes de chaque appareil, puis réorganiser les choses de manière optimale dans cette nouvelle structure.

Positionnement facile des éléments enfants

Flexbox rend les éléments de positionnement dans leurs conteneurs parents beaucoup plus simples.

Vous n'avez pas besoin d'utiliser des éléments JavaScript ou absolument positionnés; Par exemple, centrer des éléments verticalement dans une colonne n'est qu'un clic.

L'unification de la hauteur des éléments est tout aussi simple. Par exemple, il est facile de fabriquer toutes les colonnes en ligne de la même hauteur, ou tous les modules d'une colonne à la même hauteur.

Dépréciation des sections spécialisées et complets

Nous avons déconnecté des sections de spécialité et de largeur pleine, simplifiant considérablement les éléments structurels de Divi (les sections existantes et spécialisées continueront de fonctionner; nous venons de supprimer l'option pour en ajouter de nouvelles).

Vous pouvez tout faire (et plus) avec des lignes Flexbox régulières, il n'y a donc pas besoin de différents types de sections. Des modules uniques en pleine largeur ont été renommés et mis à disposition dans des sections standard, ce qui vous donne plus de flexibilité.

De nouvelles possibilités de mise en page sans fin

Il y a trop de paramètres à couvrir et des possibilités à explorer, mais une chose est claire: le système de mise en page de Divi du futur est ici, et la construction de sites Web Divi ne sera plus jamais le même.

Avant d'envelopper les choses, montrons quelques dispositions créatives construites avec le nouveau système de mise en page de Divi. Vous pouvez également télécharger les dispositions et les vérifier par vous-même.

Télécharger les dispositions

Nous avons également lancé quelques surprises

Vous remarquerez quelques autres améliorations surprises dans cette mise à jour.

• Améliorations de vitesse significatives - vous remarquerez que le constructeur est bien plus rapide lors de la modification de grandes mises en page complexes. Avec l'introduction de lignes infiniment nichables et de nouveaux éléments de conteneurs, vous avez maintenant la liberté de construire des conceptions très complexes. Avec cette mise à jour, nous avons veillé à ce que le constructeur soit toujours rapide, même lorsque vos dispositions deviennent folles. C'est une différence de nuit et de jour!
• Les nouvelles options de colonne - tous les modules de grille, tels que les modules de galerie et de portfolio, ont de nouveaux paramètres de colonne qui vous permettent de contrôler la structure de la colonne de la grille à chaque point d'arrêt.
• Renommionnage du module FullWidth - Le module d'en-tête FullWidth a été renommé Hero, et le module de portefeuille FullWidth a été renommé post-carrousel. Les deux modules peuvent désormais être utilisés dans des sections standard.
• Nouvelles options de type post pour le carrousel post - Le nouveau module de carrousel post-nommé dispose d'un nouveau paramètre de type post, vous permettant de remplir le carrousel avec des messages de tout type.

Essayez Divi 5 aujourd'hui

Flexbox pour Divi 5 est disponible aujourd'hui, et c'est l'une des nombreuses fonctionnalités à venir cette année.

Vous pouvez suivre au fur et à mesure que nous progressons dans la version finale de Divi 5 et au-delà, avec des mises à jour toutes les deux semaines. Selon vos priorités, vous pouvez utiliser Divi 5 maintenant pour créer de nouveaux sites Web ou attendre que nous ajoutions plus de fonctionnalités, tout ce qui vous convient le mieux.

Comme indiqué dans le calendrier de libération multi-phases original de Divi 5, le divi 5 public alpha est comme «divi 5 lite». Il manque quelques fonctionnalités et peut ne pas convenir aux sites Web existants, mais il est prêt à être utilisé sur de nouveaux sites Web si vous préférez l'expérience à Divi 4.

Nous voulons que vous l'essayiez, et si vous l'aimez, utilisez-le; Quand tout le monde l'aime, nous le rendrons officiel.

Avez-vous essayé les interactions?

Nous avons récemment publié des interactions pour Divi 5, un système robuste pour créer des éléments interactifs tels que des fenêtres contextuelles et des bascules, et des effets créatifs basés sur un défilement et basés sur des mouvements de souris. Ce n'est pas un constructeur pop-up; C'est un tout constructeur. Créez un déclencheur, attribuez un effet, choisissez une cible et donnez vie à vos interactions personnalisées. Il y a un lien dans la description de la vidéo pour en savoir plus.

Regardez cette vidéo pour tous les détails.

Plus de mises à jour divi 5 sont en route

2025 est l'année de Divi 5 . Le travail fastidieux est derrière nous. Nous avons construit la fondation super rapide, et maintenant il est temps pour Divi pour faire son retour.

Si vous êtes ici pour le retour Divi, faites-nous une énorme faveur et faites-le nous savoir en aimant cette vidéo et en laissant un commentaire. Cela signifie beaucoup pour nous de vous voir applaudir divi, et il est essentiel de nourrir l'algorithme et de faire passer le mot.

N'oubliez pas de nous suivre sur YouTube et abonnez-vous à la newsletter Divi afin de ne jamais manquer une mise à jour. Je vous verrai bientôt pour une autre annonce de fonctionnalité Divi 5, ce qui, je le promets, sera au coin de la rue.