About us page made with Divi
Contact page made with Divi
Homepage made with Divi
Modern web design

Download a Free Divi Layout Pack with Header and Footer

5 / 5. 14

The Divi Crib is a stunning Divi layout pack for an architect firm (but it works perfect for any type of small business). The design is clean and minimalistic. 100% responsive and mobile-friendly. You need the Divi theme to import this free layout. Feel free to rate this layout by clicking the stars above.

Page layouts

  • NHomepage
  • NAbout us
  • NNews feed / blog
  • NContact Us

Theme Builder Layouts

  • NSticky Header & global footer
  • NPost template
  • NCategories & search template
  • N404 error page

Download the layout

  1. Enter your e-mail address below to subscribe to our newsletter. (You will never receive duplicate newsletters.)
  2. Download the zip file containing all the layouts.
  3. Extract the zip file on your hard drive.
  4. Import the Theme Builder layouts file into the Header area in Divi > Theme Builder and import the page layouts to the Divi Library or directly to your Divi pages.
  5. Adjust the design and use freely. The CSS code in the global header is placed in a Divi Code Module in the header layout.The easiest way to find it is by using the Wireframes mode in the Divi Builder.
The newsletter contains tips, guides and offers and is sent out approximately once a month. You can unsubscribe at any time. We will never sell or share your email address. Your email address is stored at Mailchimp.

Do you want to learn how to create this layout by yourself? Explore our free WordPress & Divi Tutorial where we create this design from scratch.

Layout preview

Hover the images to see the full image or click it to open in a lightbox. You can also browse the live demo page.


Homepage made with Divi

About us

About us page made with Divi

News feed / blog page

Homepage made with Divi

Contact us

Contact page made with Divi

Post template

Blog post template

Category template

About us page made with Divi

Search results template

404 error template

  1. beautiful layout, thank you for this! one problem; the mobile menu is great but when i tap the hamburger menu i get the same symbol as before. how do i get the close icon that you have on the crib website?

    • Thanks xAnny! Just add the CSS snippet below to your custom CSS to change the collapse icon in the mobile menu:

      /* X icon in expanded mobile menu */
      .mobile_nav.opened .mobile_menu_bar:before {
      content: '\4d';

      Let me know how it goes!

  2. Thanks! But I get this message when I import the layout: This file should not be imported in this context

    What am I doing wrong??

    • Hi Den! You are probably trying to import a Theme Builder layout to the Divi Library or to a page, or the other way around.

      Make sure that you only import pages to pages and Theme Builder templates to the Theme Builder. Follow this video chapter step by step and it’ll work: https://youtu.be/8LCnT-xrr6M?t=21584

  3. Great layout and very useful. Easy to work with 👍

    • Thanks Christian! 🙂

  4. Good day. EXCELLENT VIDEO!

    I attempted to add your .json file my Divi Theme builder and all it would show is a red “x” and nothing would uploaded? Is there something I am doing wrong?

    I am using a a “staging” version of my website so that I can work on it to get it ready to go live.

    • Victor Duse on 2021-09-18 at 13:59
      Thanks Mike! 🙂

      I just tested an import on a fresh Divi 4.10.7 installation and it worked. Make sure that you import the Theme Builder templates by clicking the Portability icon (two arrows) in the the top right corner in the Theme Builder dashboard. The page templates can only be imported directly on pages. Check out the steps in this video: https://divimundo.com/en/wordpress-tutorial-for-beginners/import-export-json-layouts-in-divi/

      If you already done that, here are few things that can fix errors when importing layouts:

      * Make sure that you have sufficient memory allocation and timeout settings in Divi > Support Center
      * Update to the latest version of Divi
      * Deactivate all plugins before import (or at least caching and optimization plugins)
      * Try with another web browser

      You could also activate the WP debug log to see what causes the error and check with ET support if you get stuck.

      Let me know how it goes!


Submit a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.