Site logo

Archived topic

Sticky Floating Call to Action

3 replies · Started by Michael on February 12, 2020

Viewing posts 1–4 of 4

Hi is there a way to make floating sticky CTA in top header (for desktop) and bottom (for mobile) get free shipping.
like in this website https://drivealogue.com/
many Thanks

Hi there,

For sure, but it involves some HTML and CSS.

For example, you can:

1. Create a Hook Element: https://docs.generatepress.com/article/hooks-element-overview/
2. Set the hook to before_header
3. Add your content:

<div class="sticky-cta">
    Your text
</div>

4. Set the Display Rules.

Then you can use CSS to style it:

.sticky-cta {
    position: fixed;
    top: 0;
    right: 10%;
    max-width: 200px;
    background-color: red;
    color: white;
}

Hope this helps get you started :)

Thank you Tom for your Help.

You're welcome :)

This archived topic is closed to new replies.