Need some fresh ideas for creating Builder Layouts? We’ve been working on a new Layouts and Views demo site, complete with several new pre-defined Layout (and/or View) examples. Each page contains a small tutorial showcasing how the Layout or View was built and you can download each individual Layout/View to import into your own Builder site.
New Builder Layout Ideas
The Demo site includes 9 new Builder Layouts:
- Ecommerce Product – Full Width
- Ecommerce Product – Right Sidebar
- Email Signup Example 1
- Email Signup Example 2
- Event Example 1
- Features Layout
- Hero Banner
- Landing Page Example 1
- Landing Page Example 2
- Custom 404
Sample Layout Pack Download
To start using these new Builder Layouts and Views, download the Sample Layout Pack zip file.
How To Import Layouts Into Your Builder Site
Once you download these new Builder Layouts, it’s easy to import them using Builder’s Import / Export feature.
1. Run a BackupBuddy backup before you start importing.
2. Navigate to My Theme > Settings. At the top of this page, you’ll see a few tabs. Click Import/Export.
3. Next, locate the section at the very bottom labeled Import Data. This is where you’ll upload the Layout(s) zip file.
4. After uploading the zip file containing the Layout(s), you’ll be presented with a few options. These options include:
- Add Layouts – With this option, you can add additional Layouts to any existing Layouts your site already contains. If you’ve built a few Layouts but don’t want to mess with them at all, this is a great option. All of the Layouts from the imported file will be added to your site. This option will not, however, import Views contained in the file.
- Custom – This option lets you pick and choose which Layouts and views to add and/or keep upon import. You can decide to remove an existing Layout/View, or you can mix and match however you’d like. This is a very powerful option (and the one we’ll use the most).
- Replace – If you want to completely wipe out your existing Layouts and Views and replace them with the ones from your imported file, this option is for you.
- Skip – This option will skip the import entirely (in case, for instance, you selected the wrong import file).
Now that we know our options, select Custom.
5. On the next screen, you’ll have the ability to do the following:
- Select Layouts from the Import File to Add to Site
- Select Layouts from the Site to Keep
- Select Views from the Import File to Add to Site
- Select Views from the Site to Keep
Pick and choose the Layout (or Layouts) you’d like to import into your site. If you’d like to remove certain Layouts, do this as well. Once you’ve finalized your selection(s), click Next.
6. On the next screen, set the “default”, or site-wide, Layout. This Layout will apply to any content that doesn’t specifically have a Layout or view set. Click Next after deciding on a default Layout.
7. Finally, you’ll be able to verify all of your information. If you’re satisfied, click Run Import and Builder will do its magic!
That’s it! Just don’t forget to tweak the Layouts with your own content (and don’t be afraid to change the Layouts completely).