Divi layouts are available directly from the Visual Builder, since Divi version 3.0.99. These layouts - also known as "lay outs" - have been created by experienced graphic/web designers working in the ElegantThemes team.
In this article, I propose you to discover the Divi layouts which are available in 1 click from the Visual Builder and which will save you a lot of time when you create your websites with Divi.
Here is the programme:
- 1 - How did we do it before Divi layouts?
- 2 - How do I insert a Divi layout now?
-
3 - Over 1500 Divi layouts available!
- The Art & Design category
- The Business category
- The Community & Non-Profit category
- The Education category
- The Events category
- The Fashion & Beauty category
- The Food & Drink category
- The Health & Fitness category
- The Lifestyle category
- The Online Store category
- The Services category
- The Single category
- The Technology category
- 4 - Individual use of each Divi layout
- 5 - Divi's layouts, in conclusion...
Announcement: this article contains affiliate links that you will easily recognise. The classic links are in purple and sponsored links are in pink.
1 - How did we do it before Divi layouts?
Before the Divi Builder came with pre-designed layouts, ElegantThemes distributed pre-made layout packs that could be downloaded from the official website.
A series of tutorials followed to learn how to use and customise them. It was already quite nice!
However, some novices could be confused about how to install these famous packs: they had to download the .zip folder, extract the .json files and then import them from the Divi library.
Not complicated but much more time consuming than the Divi Builder...
For further explanation, see : how to import or export a Divi layout.
2 - How do I insert a Divi layout now?
The handling is now simpler and more intuitive.
Indeed, two clicks are enough to install a new Divi layout pack!
Here's how to do it:
- Go to your administration and add a new page (for example)
- Add a title, as usual, and then activate the Divi Builder
- Just click on "Load from library".
As if by magic, a list of layout packs appears!
Click on your favourite to see its content...
For more detailed explanations, see how to import a layout from the visual builder.
3 - Over 1500 Divi layouts available!
The Divi Builder currently offers +200 Divi Layout Packs, which is a total of +1500 pre-made layouts.
These packs are classified by theme:
- Art & Design
- Business
- Community & Non-Profit
- Education
- Events
- Fashion & Beauty
- Food & Drink
- Health & Fitness
- Lifestyle
- Online Store
- Services
- Simple
- Technology
The Art & Design category
36 packs are available in the Art & Design category, making 277 layouts in total.
You will certainly find inspiration if you need to create a site on the theme of fashion, interior design, graphic design, make-up etc.
Discover all the layouts of the Art & Design category
The Business category
This is the richest category with 80 packs containing 589 lay outs in total.
If you need to create a corporate website, this is where you can browse the catalogue to find the most suitable design for your project.
All trades are represented: from the florist to the restaurant owner, the web hosting provider, the wedding planner and the painter!
Discover all the layouts of the Business category
The Community & Non-Profit category
8 packs fall into this category with a total of 59 pre-designed layouts.
You will find layouts for your MeetUp, donation, pet collection or political candidate sites.
Discover all the layouts of the Community & Non-Profit category
The Education category
9 packs containing 67 individual layouts to create websites for schools, dance or yoga schools, e-learning websites, etc.
Discover all the layouts of the Education category
The Events category
Ideal if you need to create a site for a special event like a wedding, a web conference or even a marathon. You will find 74 layouts divided into 10 packs.
Discover all the layouts of the Events category
The Fashion & Beauty category
Everything related to jewellery, make-up, spa etc. If you need to create a blog on these themes, you can choose from 79 lay outs spread over 11 packs.
Discover all the layouts of the category Fashion & Beauty
The Food & Drink category
If you want to find inspiration to create a Restaurant websiteThe Food & Drink category offers 145 layouts divided into 20 packs! There is plenty to do...
Discover all the layouts of the category Food & Drinks
The Health & Fitness category
Coaching sitesYoga, therapy, dentist, nutritionist, etc. These layouts are ideal if you need to create a site for a health practitioner. In total, 164 layouts divided into 23 packs.
Discover all the layouts of the category Health & Fitness
The Lifestyle category
As the name suggests, here you will find layouts for your lifestyle websites and blogs: travel, garden, golf, etc. In total 107 layouts divided into 15 packs.
Discover all the layouts of the Lifestyle category
The Online Store category
121 layouts divided into 17 packs to create your e-commerce sites. Most shops are represented, such as fruit juice, jewellery, tea, etc.
Discover all the layouts of the Online Store category
The Services category
623 layouts available in 85 packs. There are many layouts here that are classified in other categories.
Discover all the layouts of the category Services
The Single category
Only one pack is available here with 15 layouts.
Discover all the layouts of the Single category
The Technology category
In this category you will find inspiring layouts for your game, digital product, podcast or web developer websites. In total, 19 packs and 144 layouts.
Discover all the layouts of the Technology category
4 - Individual use of each Divi layout
The layouts are independent of each other. When one of these layouts catches your eye, you can select it and see in more detail what it is made of.
On average, each pack contains 8 lay outs and consists of a Home page, an About page, a Contact page, a Blog page, a Landing page, a page for Portfolios or for Services etc.
Each pack offers harmonised layouts, but you are free to pick and choose layouts independently of the packs. You'll just have to do a little more work to harmonise it all afterwards.
For each layout, if you click on it, you will be given the choice between 'view live demo ' or 'use this layout', which means you don't have to import the whole pack.
I find this very interesting, unlike some premium themes that offer "1-click demo" installations and import a whole bunch of useless pages and images.
If you click on "Use", the layout will be installed and you just have to open each module to modify it. It's so easy!
Learn more about Divi Builder modules
5 - Divi's layouts, in conclusion...
The Divi Builder is certainly the page builder that offers so many ready-made layouts. No other builder has such a rich library of choices.
Even though I'm not a big fan of pre-made layouts, I really think it can help a lot of people. Especially if you're not into web design.
And even if you don't use them all, you can always install a few to give yourself a sense of purpose. a little inspiration and to give you a head start in learning about the page design with the Divi Builder.
Finally, don't hesitate to appropriate these layouts and modify them so that they correspond to your expectations and your projects...
This is another good reason to choose the Divi theme !
Need more resources on Divi? Visit the ElegantThemes blog which is full of ideas and tutorials! Or learn how to use this theme effectively with my Divi training !
Bonjour,
Merci pour cette article. Je ne comprends pas le premade layouts ne se charge pas et j’ai Ă la place des propositions de pages (Page Barres latĂ©rales des deux cĂŽtĂ©s, Portefeuille Grille, etc.). Comment je peux trouver cette galerie de thĂšme prĂ©s construit ?
Salut Fabien , quand tu actives le Divi Builder en violet en haut de ta page, tu as une option « importer de la bibliothĂšque » je ne sais pas si câest le terme exact car je ne suis pas sur mon ordinateur Ă lâheure actuelle. Dis moi si tu trouves…
Bonjour,
Je cherche Ă tĂ©lĂ©charger un nouveau layout Divi Ă partir donc d’une nouvelle page, mais lorsque je clique sur « charger Ă partir de la bibliothĂšque », j’ai la mĂȘme chose que Fabien, des propositions selon les types de page, en deux onglets : « mise en pages prĂ©dĂ©finies » et « ajoutĂ© de la bibliothĂšque ». Dans ce dernier, j’ai seulement les pages que j’ai importĂ©es de mon premier layout tĂ©lĂ©chargĂ© Ă l’ancienne.
On ne peut prendre qu’un layout Ă la fois ? Mais comment pouvoir tester les dĂ©mos avec les layouts tĂ©lĂ©chargeables pour ĂȘtre sĂ»r de celui que l’on prend ?
Et quid lorsqu’on ne peut charger que les fichiers des layouts tĂ©lĂ©chargĂ©s en zip ?
Bonjour Claire, je crains de ne pas comprendre votre/vos questions. Ce que je peux vous dire, c’est que en effet, on peut charger soit des layouts proposĂ©s par Divi soit des layouts que l’on a sauvegarder en amont, sur une autre page donc…
Lorsque je veux charger à partir de la bibliothÚque, cela ne me propose pas de catalogue, simplement les modÚles de pages du layout précédemment téléchargé.
Je ne peux pas faire plus clair…
Bonjour Claire, avez-vous la licence Divi et est-ce que votre thĂšme est Ă jour ? Ăa pourrait venir de lĂ ?
Bonjour,
C’est fou comme les choses sont faciles quand on est dĂ©jĂ un expert de la chose… đ Ben non, pas pour moi. Je n’ai pas « tĂ©lĂ©charger Ă partir de la bibliothĂšque » (je ne sais pas encore ce que c’est que ça du reste) mais « tĂ©lĂ©charger le modĂšle ». Et lĂ , j’ai l’affichage de 43 layout packs. L’ennui c’est que ce sont des modĂšles de sites complet, ce qui fait que pour rajouter quelques pages Ă mon site ça devient un peu lourd… Sans compter que DIVI pour un nĂ©ophyte comme moi, n’est pas si facile Ă manier. Apparemment le jour n’est pas encore venu oĂč l’on pourra bĂątir son site comme avec un traitement de texte ou un logiciel type Publisher… Je prĂ©dis la fortune Ă celui ou celle qui sortirait ça un jour…
Bonjour AndrĂ©. Oui ils proposent des packs mais si vous choisissez le layout qui vous convient sur la droite, lorsque vous ĂȘtes dans un pack, vous avez certainement des pages qui sâappellent « about » « home » etc. Si vous sĂ©lectionnez celui qui vous intĂ©resse, il va sâafficher sur la gauche et lĂ , vous pourrez cliquer sur « use this layout ». Vous ne tĂ©lĂ©chargerez donc seulement ce layout et non le pack complet. Vous voyez ? Attention, avant de cliquer sur « use this layout » vous avez en dessous une option Ă cocher ou Ă dĂ©cocher qui vous permet de remplacer le contenu de votre page existante par le layout ou bien dâajouter le layout Ă la suite du contenu dĂ©jĂ prĂ©sent sur votre site. Si vous oubliez de dĂ©cocher lâoption, câest irrĂ©versible. JâespĂšre vous avoir aider… mais je crois que je vais faire un tuto car vous nâĂȘtes pas le seul Ă poser des questions sur cette fonctionnalitĂ©.
bonjour
je n’arrive pas a telecharger un layout quand je fais telecharger un modele, je clic sur le layout et sur use this layout mais rien ne se passe je reviens sur la page de creation de page mais je n’ai pas le layout. apparement il ne se telecharge pas…. auriez vous une idĂ©e du pourquoi de ce qu’il se passe ? ou du comment faire ?
merci
Bonjour, ce bug me parait bizarre. Est-ce que tout est Ă jour ? Avez-vous un plugin de cache ? Avez-vous bien enregictrĂ© votre clĂ© API dans l’onglet « update » des rĂ©glages de Divi ? cf https://astucesdivi.com/options-divi-onglets-integration-updates/
Bonjour merci pour cet article, a mon sens divi est vraiment le meilleur thĂšme surtout avec son builder en temps rĂ©el, c’est un vrai plaisir de travailler dessus dĂ©sormais !
Bonjour, j’ai le projet de crĂ©er mon site. Je pense opter pour Divi mais j’ai cru comprendre que la derniĂšre version fin 2018 apportait de grosses modifications au niveau du builder.
Du coup, je me demande si tout ce que vous indiquez dans cet article est toujours possible avec cette nouvelle version ?
Bonsoir Maya !
Bien sĂ»r et heureusement qu’on peut continuer Ă utiliser des packs de layouts (mise en page) tout prĂȘts. La nouvelle version de WordPress a contraint Divi Ă ĂȘtre utilisĂ© en « front-office », mĂȘme si tu peux quand mĂȘme continuer Ă construire tes pages depuis le back-office puisque Divi a prĂ©vu une option pour ça. Tu peux utiliser Divi sans problĂšme đ
Oui, merci William. Divi est bien pratique đ
Bonsoir
Je compte crĂ©er mon site avec divi, mais pour le moment je travail en locale j’ai testĂ© divi sa marche plutĂŽt bien, le problĂšme est que j’aimerais travailler avec les layouts tĂ©lĂ©charger au prĂ©alable, et que l’importation s’est faite avec succĂšs, cela ne s’affiche pas quand il s’agit de charger Ă partir de la bibliothĂšque. Cela me bloque d’avancer avec les layouts d’ici!
Salut Alik,
Si vous voulez importer des layouts Divi tout prĂȘts (ceux disponibles depuis la bibliothĂšque), vous devez ĂȘtre en possession de votre licence Divi (clĂ© API) et renseigner vos identifiants dans l’onglet UPDATE. Sans cela, ça ne marchera pas.
Bonsoir,
Pour un client je cherche un layout : boutique vente matériels informatique .. il a un magasin physique mais souhaite mettre un site en place
une idée Merci
Merci
Salut Jean Luc,
Il te suffit de crĂ©er le design de ton site ou tout simplement d’importer un Layout « tout prĂȘt » disponible dans Divi. Si tu ne trouves pas le layout idĂ©al pour le domaine de l’informatique, il te suffit d’utiliser un layout qui te plait : le reste est une histoire de couleur et d’images. En fait, les layouts sont proposĂ©s dans une thĂ©matique mais tu peux trĂšs bien les « dĂ©tourner » pour que ça colle Ă ton projet, c’est le but d’ailleurs.
đ
Bonsoir Lycia
J’ai une question, sur divi, Ă chaque mise du thĂšme divi ! j’ai le message qui suis :
Votre site rencontre un problĂšme …
J’ai bien entendu achetĂ© chez elegantthemes et j’ai la clĂ© API
A la suite de cela je rafraĂźchi la page et c’est reparti …
Tu aurai une piste ….
Salut Jean Luc. Cela ne vient pas de Divi. Jâai le mĂȘme problĂšme Ă chaque mise Ă jour, surtout pour les plugins. Ăa a commencĂ© depuis la MAJ de WordPress 5.2 je crois et cela nâarrive que sur lâun de mes sites alors que tous mes sites tournent sous Divi. Donc, par Ă©limination ce nâest pas Divi. La seule chose qui change dans mes sites, câest lâhĂ©bergement. Donc, par curiositĂ©, tu es chez quel hĂ©bergeur ?
Je suis chez o2switch
Merci pour ta reponse
Moi aussi c’est sur o2switch justement…
Bonjour,
Je ne parviens pas Ă charger des laout depuis mon interface. Quand je clique sur « ajouter » dans « Page » je n’ai pour seule option que « Utiliser le gĂ©nĂ©rateur Divi »… Avez-vous une idĂ©e de quel peut ĂȘtre le problĂšme ?
Merci d’avance !
Bonsoir CĂ©cile.
Oui, il faut activer le « gĂ©nĂ©rateur Divi » pour pouvoir tĂ©lĂ©charger des layouts au sein de la Page. Sans cela, c’est impossible car c’est Divi qui gĂšre les layouts et non WordPress.
Bonjour Lycia
si on fait un site avec plusieurs pages on peut changer de layout par page ?
merci
Bonjour MichĂšle ! Oui bien sĂ»r. Tu choisis nâimporte quel layout Ă chaque page.
une question bĂȘte
les layouts c’est payant ? Ă acheter sur le site ?
Salut Michelle. Pas du tout, ils sont inclus avec la licence Divi et tu les télécharges directement depuis le Visual Builder
ok je viens de comprendre et j’ai trouvĂ©
mais par contre lĂ j’avais un layout qui me plaisait bien et je ne trouve pas comment remplacer leur image de fond par une Ă moi.
Du coup avec mon mari on fabrique nos propres modeles mais c’est long
et souvent je bloque parce que dans le module image ca ne met pas forcĂ©ment le format que je veux et je n’ai pas encore trouvĂ© comment l’agrandir alors que pour le texte on peut faire plein de changements
Bonjour Lycia,
Merci pour toutes ces astuces. Cependant, en tant que designer, je souhaiterai télécharger les templates DIVI/Layout comme PSD. Comment fait-on ?
Merci de ton retour.
Bonjour Christophe, je crois que ce n’est pas possible.