How to Use Sections as Elements in ClickFunnels 2.0 - Easier than Flexbox

For More Training on ClickFunnels 1.0 and 2.0, Membership Sites, Courses and Custom Code Hacks - Go To CFninjas.com
Check out the One Funnel Away Challenge here… funneldesignma...
Welcome back! This is Dan Havey with CF Ninja Hacks. In this video, we're diving into a feature that's been part of ClickFunnels 2.0 since its inception. Initially, it either wasn't working or we just didn't know how to utilize it properly. But today, I saw Jake Leslie from ClickFunnels demonstrate it, so I decided to explore it myself. We're talking about the ability to use sections or rows as elements within ClickFunnels 2.0.
In previous videos, we've discussed how to use Flex containers extensively. Let's quickly revisit that to highlight the differences with this new method. Here, I'll click on a Flex container. Now, one new feature since my earlier training is the ability to save the Flex container. However, for this demo, you might still want to place your Flex container inside a section before saving it. Experiment with both methods to see what works best for you.
Typically, when working with Flex containers, you might stack them inside each other. For instance, you could put one Flex container inside another, then clone it twice to create three stacked containers. To align elements like icons within these containers, you'd adjust settings such as the Flex wrap property, which defaults to wrap. Switching it to no wrap and setting the Flex direction to row aligns elements horizontally. But sometimes, getting them to display correctly across different views, like mobile, requires additional adjustments.
Now, there's a simpler alternative. Instead of using Flex containers, you can use sections and rows directly. Start by adding a full-width section and then a two-column row within it. Instead of adding an element, go to settings, choose editor settings, and enable sections to behave as elements. This allows you to insert sections within sections. For example, you can place a three-column row inside a new section and easily align elements without complex adjustments.
This method is straightforward. Previously, inserting a section within another section often required JavaScript for additional layers or effects. Now, with this new feature, you can place any element, row, or section anywhere on the page directly within the editor, eliminating the need for JavaScript.
In conclusion, while Flex containers offer extensive customization, using sections and rows as elements provides a simpler, more intuitive approach for many layouts. Start experimenting with sections and rows to see how they can streamline your design process. If you run into limitations, then consider moving to Flex containers. If you have any questions, feel free to ask. Happy building!