New Features in Flatsome Theme 3.18
The latest update introduces an exciting range of enhancements designed to make managing your WooCommerce site smoother and more efficient. Here’s a quick overview of the most impactful improvements:
Improved UX Builder Enhancements
The UX Builder, a favorite among Flatsome users, just got even better with the 3.18 update. This update introduces a more intuitive interface and enhanced responsiveness, making it easier than ever to design and edit pages seamlessly. Key usability improvements simplify layout adjustments, style customizations, and real-time change previews, helping you work more efficiently and effectively.
Advanced WooCommerce Integrations
The 3.18 update takes Flatsome’s WooCommerce compatibility to the next level. Dynamic product pages now feature expanded customization options, allowing you to tailor them to your store’s needs. Performance enhancements ensure smoother handling of larger product catalogs, improving the experience for both store managers on the backend and customers on the frontend.
Design and Performance Updates
The 3.18 update brings refined layouts and new design elements, helping you give your website a fresh, modern appearance. Additionally, Flatsome has introduced speed optimizations to ensure faster loading times, enhancing the user experience while improving your SEO rankings.
Step-by-Step Guide to Using Flatsome 3.18
1. Enable Free Shipping Notification
The new Flatsome 3.18 adds a free shipping notification to the mini-cart, cart page, and checkout.
- Go to Flatsome Theme Options > Header.
- Click on the cart settings gear.
- Enable Free Shipping Notification.
- Ensure you’ve set up free shipping in WooCommerce Shipping Settings with a minimum purchase amount.
2. Cross-Sell Options in the Cart
You can now highlight cross-sell products in the cart to encourage more purchases.
- Connect products in WooCommerce by going to the Linked Products section.
- In Cart Settings, enable Show Cross-Sells to display linked products inside the cart.
3. Quantity Input for Cart Items
Allow customers to adjust product quantities directly inside the cart.
- In Cart Settings, enable the Quantity Input option.
- Customers can increase or decrease product amounts easily.
4. Sticky Footer for the Mini-Cart
Make the “View Cart” and “Checkout” buttons sticky at the bottom of the mini-cart for better visibility.
- Go to Flatsome Theme Options > Header.
- Scroll to Cart Settings and enable the Sticky Footer option.
5. Adjust Cart Drawer Width
Customize the width of your cart drawer for a better user experience.
- Head to Header > Cart Settings.
- Set the Drawer Width (e.g., 600px) to adjust how wide the cart slide-out is.
6. Product Gallery: Slider to Fade Effect
Change the default slider in product galleries to a fade effect.
- If using UX Builder, select Product Gallery and change the effect to Fade.
- Otherwise, go to Theme Options > WooCommerce > Product Page, and set the gallery type to Fade.
7. Pagination for Products and Blogs
Add pagination to blog posts and product listings in your UX Builder.
- Open the UX Builder and set your product row to show 4+ items.
- Enable Pagination, and choose between Load More, Pagination Links, or Previous/Next buttons.
8. Accordion and Tab Anchors
Link to specific accordions or tabs from external pages using custom anchor links.
- Create an accordion, add an anchor in its settings (e.g., “test”), and link to it externally by appending
#test
to your URL.
9. Google FAQ Structured Data
Improve your SEO with structured data for FAQ accordions.
- In the Accordion Settings, toggle the Structured Data option on for FAQs.
10. Pjax Functionality for Faster Navigation
Enable Pjax for a smoother navigation experience with AJAX loading.
- Go to Flatsome Theme Options > Advanced > Content Delivery and enable AJAX Pagination for shop, blog, and other sections.
11. Maintenance Mode with Role-Based Exclusion
Keep your site under maintenance while allowing specific users to access it.
- Go to Flatsome Advanced Settings and enable Maintenance Mode.
- Set a Bypass Key (e.g.,
?SE
) for access while logged out.
12. WhatsApp Contact Option
Add a WhatsApp button in the header for direct customer communication.
- Open Header in UX Builder, click Contact Element, and input your WhatsApp number with country code.
13. Color Picker for Sections and Columns
Easily choose colors for sections and columns in your site using the new Color Picker feature in UX Builder.
The Flatsome 3.18 update is loaded with powerful features to enhance your site’s functionality, design, and performance. By leveraging these updates, you can deliver a better shopping experience for your customers while simplifying your workflow.
Discover everything Flatsome 3.18 has to offer and take your WooCommerce store to the next level. For expert advice and tutorials, visit Seb de la Web and stay ahead in your eCommerce journey.
Continue learning
Need a custom design? Hire Seb today
Get the #1 All In One Design Agency for Flatsome