Adding and editing sticky buttons on your Showit website template
Step By Step Guide
Guide on adding and editing sticky buttons on Showit to increase visibility of the main call to action.
Adding and Editing Sticky Buttons on Your Showit Website Template
Sticky buttons are a great way to keep important actions—like Book Now or Shop—always visible to your visitors as they scroll. In this tutorial, you’ll learn how to add, customize, and position sticky buttons in Showit.
Watch the video
What Is a Sticky Button?
A sticky (or fixed) button stays in a fixed position on your screen—even when you scroll. It’s perfect for:
- Calls-to-action (CTAs)
- Contact buttons
- Booking links
- Lead magnets
How to Add a Sticky Button in Showit
- Open Your Showit Design
- Log into your Showit account (https://app.showit.co/) and select the site/template you want to edit.
- Add a Button Element
- In the Canvas view, click the + icon in the left toolbar.
- Select Button and place it anywhere on the canvas (we’ll adjust it later).
- Make the Button Sticky
- With the button selected, go to the right-hand panel and find the “Position” section.
- Enable the “Sticky” toggle or check “Sticky Position”.
- Set the positioning using Top, Right, Bottom, or Left values.
Need help finding these settings? Check the official Showit Sticky Object Docs for more visuals.
Customizing the Button
You can edit:
- Text: Double-click the button to change the label (e.g., Book Now).
- Colors: Use the Design Settings or change fill/stroke in the right-hand panel.
- Shape: Round the corners, add shadows, or adjust padding.
- Size: Drag the corners or adjust width/height manually.
Link the Button to a Page or URL
- With the button selected, find the Click Actions section in the right panel.
- Choose:
- Page to link to another page on your site.
- URL to link externally (e.g., Calendly, Instagram DM).
- Paste your URL or select your internal page from the dropdown.
Best Practices
- Keep your sticky button small but visible—avoid covering content.
- Use clear labels like Buy Now, Contact, or Reserve.
- Limit sticky buttons to one per screen to avoid clutter.
- Check both desktop and mobile views to adjust sizing and placement.
Mobile-Specific Tip
Sticky buttons can behave differently on mobile. Use the mobile layout preview in Showit and manually adjust the button's position for smaller screens.
💡 Remember: You can hide elements on mobile or desktop by toggling visibility in the Layout panel.
You're Done!
Sticky buttons can drastically improve usability and conversion rates. With just a few clicks in Showit, you can make sure your visitors always have access to your most important call-to-action.