Custom Layouts Module Documentation

📝 Note: The Custom Layouts module is part of Neve Pro, which you can get from here. If you would like to learn more about the Neve Pro Addon, take a look at Neve Pro Addon's full documentation.

This module is one of the most powerful features of Neve that allows sections to be created as new posts and display them based on the hooks ( locations ) declared in the theme, for example, the header of the following blog page, which isn't available by default with the theme options.

📝 Note: A custom layout can be edited with the WordPress editor, Elementor, or Beaver Builder. For a better experience with the WordPress editor, we encourage you to install Otter Blocks.

🖲️ Activating the Module

1: Install the Neve PRO plugin, using these instructions.

2: Navigate to Neve > Dashboard > Settings > Manage Modules.

3: Enable the Custom Layouts Module

🧰 Using the Module

1: Navigate to Neve > Custom Layouts.

2: Click on the Add New button.

3: From this moment, you need to decide what type of custom layout you want to create, and depending on what you choose, the settings and locations will be different.

✨ Magic Tags

Magic tags can display dynamic information on certain pages using Custom Layouts. When you navigate to the page where you have made such insertions, the magic tags will be replaced with actual value.

The magic tags can be used only in the context that they appear in. As you can see below, the {archive_title} tag is available for the Archive Type condition. Hence, for other conditions, you will have other specific magic tags.

📝 Note: Learn more about Magic Tags in Custom Layouts from this doc.

📥 Templates Cloud Integration

Neve Pro Agency license gives you access to the Templates Cloud Library, which you can use to store custom layouts and import them later when you need. To do this, create the custom layout, click on the Templates Cloud icon, and Save Page to Templates Cloud.

Navigate to Appearance > Neve Options > My library:

After clicking on Import, you can locate and edit it under Neve > Custom Layout.

📝 Note: Find out more about the Templates Cloud Library from this doc.

⚙️ Layout Settings

After adding the desired content and eventually choosing the layout location, more specific conditions can be added regarding the type of page where to show it.

Below is an example showing a layout only on the blog page using hooks and conditional logic.

The Dynamic Values of Otter can be used for generic layouts, like the header of the products category page, where the category name and description are different from one page to another one:

Dynamic Values in the editor

Advertising Product Category

Books & Magazines Product Category

Conditional Logic

The Custom Layout Module allows for integrations with other plugins as well, creating a more diverse palette to boost your website's utility. These conditions are available for any type of layout you use ( Header, Footer, Hooks, etc. ).

📝 Note: In order to use all these conditions on your website, you must install the presented plugins, otherwise, those will not be accessible.

WooCommerce conditions - related to e-commerce accessibility:

Product Purchase - custom layout will be displayed if the user has purchased / has not purchased certain products that appear on the third column.
- 📝Note: The product will be a multi-select list of all the available products.

Product Category Purchase - custom layout will be displayed if the user has purchased / has not purchased products from certain categories that you add on the third column.
- 📝Note: The category will be a multi-select list with all the available product categories.

Product Added to Cart - custom layout will be displayed if the user has in cart / not in cart certain products from the third column.
- 📝Note: The product will be a multi-select list of all the available products.

Product Category Added to Cart - custom layout will be displayed if the user has in cart / not in cart products from certain categories from the third column.
- 📝Note: The category will be a multi-select list with all available product categories.

Lifter LMS conditions - related to learning and memberships accessibility:

Quiz Status - custom layout will be displayed if the user has passed / failed certain quizzes.
- 📝Note: The Quiz will be a multi-select list with all the available quizzes.

Memberships - custom layout will be displayed if the user has membership / does not have a membership.
- 📝Note: The Membership will be a multi-select list with all the available memberships.

Course Status - custom layout will be displayed if the user has completed / not completed certain courses.
- 📝Note: The Course will be a multi-select list with all the available courses.

LearnDash conditions - related to learning and groups accessibility:

Quiz Status - custom layout will be displayed if the user has passed / failed certain quizzes.
- 📝Note: The Quiz will be a multi-select list with all the available quizzes.

Groups - custom layout will be displayed if the user has a group / does not have a group.
- 📝Note: The Group will be a multi-select list with all the available groups.

Course Status - custom layout will be displayed if the user has completed / not completed certain courses.
- 📝Note: The Course will be a multi-select list with all the available courses.

Translation plugins ( Polylang and WPML ) conditions - related to the language accessibility:

Current Language - custom layout will be displayed if the current language is equal to / not equal to certain languages.
- 📝Note: The Language will be a multi-select list with all the available languages.

Layout expiration date

This setting allows you to set a custom layout to be displayed until a specific date and time. Once you set an expiration date for the layout means after that date, it won't be displayed anymore. However, it's still available on the Dashboard of your website.

📝 Note: The timezone used for the expiration date is based on the user who edited the custom layout in the website Dashboard; it won't apply differently for each website visitor based on their timezone. To ensure this works as expected, you can set the timezone in WordPress Settings, see the screenshot below.

Layout Start date and time

The custom layout can be configured to appear at a particular time and date. To do this, open the Custom Layout tab in the editor, then click on the default date next to Publish, and schedule the appearance of the custom layout:

🗂Useful Resources

Using Neve Patterns

While editing a custom layout, you will get access to the Neve Patterns collection. There are multiple templates for the Archive, with or without a sidebar, one or two columns, and Single Posts, with or without a Cover or Sidebar.

📝 Note: Check more about this feature here.

Using a custom Hook

When setting a layout to be displayed at a hook ( a location defined in the theme or in WordPress ) it is also possible to use a custom one and manually write it instead of the pre-defined ones shown in the drop-down choice.

Below is an example with a hook available on the My Account page ( part of the WooCommerce plugin ).

Choose hooks