Add a sticky bar to your website

Add a sticky bar to your website
Artem Tiulnikov
Artem Tiulnikov 6 min read

Need to display an announcement on your website without being intrusive? A sticky bar got you covered.

What is a sticky bar exactly?

Well, it is a multifunctional banner that you can place to the top or bottom of a page on your website. You can use them to:

  • Notify visitors
  • Collect emails
  • Display cookie message
  • Reduce bounce rate
  • Trigger pop-up forms

Here is an example of a simple sticky bar aimed to notify store visitors about the free shipping and return policy 👇

Similarly, you’d be able to place a cookie consent message, an email opt-in form, or any other announcement.

In this article, you’re going to learn how to add a stylish sticky bar to your website using Getsitecontrol – a tool to help you create popups, online forms, and sticky bars without coding.

Here is how to create a custom sticky bar in Getsitecontrol

With Getsitecontrol, you don’t have to create anything from scratch. There’s a large gallery of ready-made sticky bars you can just grab and customize for your needs. Here is how to do it 👇

Step 1. Select a template

Open the gallery and click on the templates to activate their live preview.

Website sticky bar gallery powered by Getsitecontrol

You’ll find over a dozen sticky bar variations designed for different purposes including email list building, sales promotion, news announcement, and more. Once you find a sticky bar to your taste, follow the instructions on the right-hand side to add it to your Getsitecontrol dashboard.

Step 2. Customize the copy

On the first screen, you can edit the text, change the position and appearance of the banner. To change the copy, just click on it and start typing in the text placeholder that will open on the right-hand side.

How to add a sticky bar to a website using Getsitecontrol

Notice that you can remove the button or change its settings. For instance, in this scenario, the button is designed to drive visitors to the ‘Shipping & Returns’ policy page. If this scenario is similar to yours, click on the button and insert the URL where you want to drive visitors upon click. Otherwise, you can also set the button to close the bar or launch another website popup.

Step 3. Customize the design

At this point, you may want to change the position, color theme, and font on the sticky bar. The Position menu will allow you to shift the bar slightly higher or move it to the top of the page. Meanwhile, the Theme menu includes several pre-made style options along with color and font settings.

How to customize a sticky bar in Getsitecontrol

To see how your sticky bar will look on mobile, use the mobile preview button at the bottom of the screen.

Step 4. Set display conditions

If you want to place the sticky bar on selected pages or display it to selected audience segments, you’ll need to check the Targeting tab.

How to select display settings for a sticky notification bar in Getsitecontrol

Go through each field to find the settings applicable to your case. If you leave the default settings, the sticky bar will be visible to everyone on every page of your website.

When you’re done, hit the Save & close button in the top right corner, then activate the bar on your website.

To connect Getsitecontrol to your website, follow the guidelines displayed in your dashboard. If you stumble at any point, feel free to consult with our instructions.

Congratulations! You now have a neat sticky bar ready to notify website visitors about important updates or collect emails.

Now, let’s see what exactly sticky bars can be used for and talk about the best practices.

Five sticky bar examples you can copy for your website

A sticky bar is a versatile tool, its applications many. Below, I’m going to tell you about some of them.

Under the GDPR legislation, your website visitors are to consent to your collecting and processing their data.

Guess what? A sticky bar is a killer cookie consent collector.

And Getsitecontrol makes it super easy for you to add it to your website and start alerting your visitors to your cookie policy.

Make a click on the template above to see it in action. If you like it, follow the instructions to add this bar directly to your Getsitecontrol dashboard.

💡 Want to make sure every website visitor sees your message? Then opt for eye-catching colors when creating a sticky bar.

2. Display an alert bar on exit intent

Exit-intent popups are incredibly popular. And while many use modal popups to prevent visitors from leaving a website, what’s really trending now is high, eye-catching sticky barss.

They appear from the bottom of a page when a visitor is about to exit and typically take up to 30-50% of the page space.

Like it? I thought as much.

You can add this template directly to your Getsitecontrol dashboard by hitting the See live preview link above. Or you can create a similar one from scratch by altering padding settings and a few lines in the CSS editor (the Theme tab).

Once you’re done with the design, go to the Targeting settings and opt to start displaying this bar on exit intent.

3. Use a sticky bar to collect email addresses

Adding a sticky bar to your website is a great way to collect emails. Why? Because it always remains in view and doesn’t distract visitors from consuming your content.

Want to boost email signup rate? Then offer lead magnets in exchange for a subscription and use power words in your call to action.

4. Notify visitors of important changes

Keep your audience in the loop by notifying them of important changes on your website or in your physical store. Tell them about your new releases, alert them to upcoming website maintenance, or an updated website policy.

With Getsitecontrol, you can place a sticky bar both on your website and in your cloud app. To specify where you’d like to display the announcement, go to the Targeting tab and type the URLs of the pages you want to include or exclude.

5. Use your sticky banner as a form trigger

You can also use sticky bars to launch contact and survey forms upon button click. This is what it may look like 👇

First off, you’ll need to add templates of a sticky banner and a form to your Getsitecontrol dashboard. Then, you’ll be able to set up the form to pop up when visitors hit the button on the sticky bar.

Here is how to do it in three easy-to-follow steps:

Step 1

Find your sticky banner in the Getsitecontrol dashboard and click Edit.

Step 2

Change the copy on the sticky bar to something relevant to conducting a survey or providing a contact form. For example:

  • Hey! Complete a short survey and get a 20% discount. Start survey

  • Need a helping hand to walk you through our product? Contact us

Step 3

Click on the button text to open the button settings. Remove the default option and proceed to Add action. Then select ‘Show widget’ and choose the form you would like to bring upon button click.

How to create a sticky bar that launches a full-sized website form

If you like the idea of launching a full-sized survey form upon a button click, consider reading this tutorial.

Which sticky bar would you start with first?

Sticky banners are an excellent means of conveying loud and clear messages to your audience. Make the most of them by collecting emails, offering discounts, notifying visitors of the latest updates or your cookie policy, launching forms, and preventing visitors from abandoning your website.

You’re reading Getsitecontrol usecase collection where we talk about the best practices for using website popups. This usecase is a part of Make announcements section.

Get the print version

Download a PDF version of our use case for easier offline reading and sharing with coworkers.

Download PDF

Best practices

You’re reading Getsitecontrol usecase collection where we talk about the best practices for using website popups. This usecase is a part of Make announcements section.

Subscribe to get updates

Get beginner-friendly tips for growing your online business.

Join the list →