The Smooth Divi Header Templates Pack v1.4 has been released. It introduces 5 new Divi header templates, bringing the total number of header templates in the pack to 15. And it’s still FREE!
These new templates are designed to give your Divi website a modern and professional look. Check out the new additions and see how they might fit into your site’s design.
Table of Contents
Demo
Main Features
The main feature of these new header designs is still the smooth submenu effects for desktop menus that many users love.
They also feature social icons and call-to-action buttons, and a clean, responsive design that works well on any device.
One of the key updates is the improved script for collapsing mobile menu submenus which now provides the accordion mode feature.
This feature will collapse other Divi mobile menu submenus when another one is opened, allowing only one submenu open at a time. It helps keep the mobile menu more compact, improving the user experience.
How to download and start using
You can download the latest version of the Smooth Divi Header Templates Pack for free from the Divi Marketplace.
These headers are Divi Theme Builder templates, so, you’ll need to import them into the Theme Builder as new templates.
If you’re not familiar with the process, I’ve written a guide on how to import Divi Theme Builder templates that you might find helpful.
How to customize
These header templates use native Divi Builder elements only. You don’t need to install any additional plugins or extensions.
Once you’ve imported the templates into the Divi Theme Builder, you can fully customize them by adjusting the settings of the Divi Builder elements.
The custom CSS and JavaScript are included within Code modules in each header layout.
If you want to make changes to the custom code, switch to Wireframe mode, locate the coresponding Code modules, and adjust the code as needed.
How to fix the Divi icon display issues
After importing the header templates, you might notice that custom font icons don’t display correctly.
This can happen because Divi’s portability system sometimes changes icon codes in the custom CSS during the import.
Fixing is done the same way as explained in the previous release post of the Smooth headers pack (v1.3).
To fix this find the Code modules of the header template that contain custom CSS and apply the following changes:
1. In the “Code – CSS” labeled Code module, ensure that the code for the open mobile menu icon (the “X” icon) is set to “\4d”.
2. In the Code module labeled “Code – Collapse Mobile Submenus CSS & JS”, make sure the icon code for the mobile menu parent items up arrow is “\42”, and down arrow is “\43” (or “\32” and “\33” respectively).
Try the new header templates now!
Check out the latest additions to the Smooth Divi Header Templates Pack. With 15 headers now available, you’re sure to find one that works well with your site’s style and needs.
(If not, then have a look at the free Shoppy Divi eCommerce Header Templates Pack as well!)
The Smooth Divi Header Templates Pack is free to download from the Divi Marketplace. If you have any questions or need help with customization, feel free to ask your questions in the comments section below.
0 Comments