This tutorial is dedicated to creating a sticky column with the JetTricks plugin. Keep reading to learn how to use the sticky option.
Before you start, check the tutorial requirements:
Sticky Column is a feature that comes with the JetTricks plugin, allowing you to make a column “sticky” when you scroll through the section. You can use the Sticky Column option to capture specific content, keeping it within the viewer’s line of sight while they explore other sections of a block.
This tutorial will help you create a sticky column using the JetTricks plugin. So let’s walk through this process. Navigate to the page where you want to add a sticky column and click the “Edit with Elementor” button to proceed.
Then, create a new section and fill it with the content you need. After that, click on the container you want to make sticky and go to Edit Container > Advanced > JetTricks. There you will find the following settings:
- Sticky Column — a toggle that enables sticky functionality for a column;
- Top Spacing — a field that defines the distance in pixels between the sticky column and the top edge of the container;
- Bottom Spacing — a field that defines the distance in pixels between the sticky column and the bottom edge of the container;
- Sticky Behavior — a dropdown where one can set column behavior, two options are available: “Default” (remains sticky throughout scrolling) and “Scroll until end” (stops being sticky when reaching the container’s end);
- Sticky On — a field that controls which device types the sticky functionality applies to, three options are available: “Desktop,” “Table Portrait,” and “Mobile Portrait”;
- Z-index — an input field that determines the stacking order of the sticky column relative to other page elements.
Finally, click the “Publish” button and then click on the “Preview” to check the result.
That’s all you need to know about how to create a Sticky Column with JetTricks on a WordPress website powered by Elementor.
