Meet Shoppy – a FREE Divi eCommerce Header Templates Pack
Today I’m excited to introduce Shoppy – a FREE Divi eCommerce Header Templates Pack!
The Shoppy header templates pack includes 5 Divi header templates created exclusively for WooCommerce stores created using Divi. It is a FREE product available for download to all our subscribers.
Table of Contents
Demo
Main Features
Some of the most important features of the Shoppy header templates are the followings:
Promo Bar
Highlight special offers and announcements at the top of the webpage, grabbing visitors’ attention instantly.
CTA Button
Direct users’ actions with a clear Call to Action button in the promo bar encouraging specific interactions or transactions on your website.
Countdown Timer
Display a countdown timer emphasizing limited-time promotions or events for visitors.
Search Icon / Search Bar
Enhance user experience with a search functionality providing quick access to desired content.
Shopping Cart
Enable customers to view and manage their selected items, ensuring a smooth shopping experience and easy checkout process.
Menu Items Hover Effects
Add interactivity and visual appeal to menu by incorporating hover effects making navigation engaging and intuitive for users.
An animated line hover effect is implemented for the desktop main menu items, while for the desktop submenu items the mirror hover effect is implemented.
Collapsed Mobile Menu Submenus
Optimize mobile browsing by making the submenus collapsible ensuring a better user experience on smaller screens.
Responsive Design
Ensure that your website header adapts seamlessly to various devices and screen sizes, providing a consistent and user-friendly experience across platforms.
The Shoppy header templates are designed with responsiveness in mind, they look great on any screen size.
How to download and start using
The Shoppy Divi eCommerce Header Templates Pack is available for download with our Freebies pack.
In order to download it all you need to do is to subscribe and confirm your email address, and an email with the download link will be sent right in your inbox.
If you are an existing subscriber then you don’t need to subscribe again because the updated Freebies pack download link will be emailed to you, as usually.
All Shoppy headers are Divi Theme Builder templates, so, you should import them as new templates directly into the Divi Theme Builder.
If you need help with that, please follow this guide for more details about how to import new templates into the Divi Theme Builder.
How to customize
Once you’ve imported the header templates into the Theme Builder, you’re all set to dive into the customization process just like you would with any other Divi template, utilizing the settings of Divi Builder elements.
Additionally, these header templates come with some unique features implemented using custom CSS and JS code.
If you wish to modify the custom code, you can easily locate it within the layout’s Code modules.
Simply switch to the Wireframe mode, and there you’ll find the Code modules labeled accordingly.
This is where you can make your desired modifications, ensuring your headers are tailored precisely to your preferences.
Possible issue with icons and how to fix it
You may encounter an issue with the mobile menu collapsed submenus parent item arrow icons displaying incorrectly.
This issue is happening due to a bug in Divi portability which is altering the icon codes in the custom CSS that iclude a “\” character during the import process.
You can fix the icons in the Code module labeled “Code – Collapse Mobile Submenus CSS & JS”.
Locate that Code module and set the mobile menu parent menu item up and down arrow icon codes to “\42” and “\43” respectively, as shown below:
Subscribe and start using Shoppy header templates now!
The brand new Shoppy Divi header templates pack is available for download for FREE to all our subscribers.
To use these headers you don’t need any additional plugins, the header templates have been created using Divi Builder elements (sections, rows, columns and modules) as well as some custom CSS and JS.
So, subscribe and download Shoppy now, and start using in your Divi WooCommerce website!
You may want to check out the Smooth header templates pack as well!
