Introduction
In Refari boards, we feature sticky CTAs that remain fixed at the top to capture user attention. However, when a website also has a sticky header, it can cause the CTA to be hidden or appear broken. This guide will walk you through the steps to adjust the offset and fix the issue seamlessly.
Step-by-Step Guide :
1. First, measure the height of the sticky header on all devices.
2. To determine the header height, we can utilize the Ruler Chrome extension. For desktop displays, the header height is 77 pixels, while for tablet and mobile devices, it measures 90 pixels.
3. After determining header heights for various devices, we can proceed to the page editor. You can use any editor that aligns with your website's technology; in our case, it's Elementor. To begin editing the page, choose the 'Edit with Elementor' option.
4. To modify the content, click on the HTML widget.
5. To enable the offset feature, uncomment the relevant code section. Subsequently, enter the appropriate values that correspond to the dimensions of the object. Finally, publish the changes.
6. To remove the WordPress top bar, click on the "Log Out" button.
7. The offset has now been fixed, as we can see :)
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article