How to add a floating contact us button to your website

When visitors click on the button, a contact form like this one will pop up on the same page:

Once someone fills it out, the message can go straight to your inbox, your CRM, Helpdesk, Google Drive – or any other app of your choice. The submissions are also stored in your Getsitecontrol dashboard.

The form is completely customizable – as well as the button itself. Whether you decide to change the design, add more fields or pages, you’ll be able to do it without any technical knowledge.

Here is how to add a floating Contact Us button to your website

The process consists of three simple steps. First, you select a contact form template. Second, you select a floating button template. Once you do that, all you need is to connect the button and the form to activate them on your website. See it for yourself 👇

Step 1. Select a contact form template

To get started, make a click on any template from the gallery and follow the prompts on the right side of the page. Once you do, the selected contact form will land in your Getsitecontrol dashboard:

This is where you can customize the form to your needs. Use the menu on the right-hand side to change the image and copy. To view and edit the submission success message, hit Page 2 at the bottom right corner.

If you want to change the color theme or text font, use the Theme menu at the top.

Once ready, open the Targeting tab, go to the Start to display the widget section and remove the default ‘at once’ condition. Keep the rest of the default settings unchanged.

This will mean that the form will only pop up when a visitor hits the floating Contact Us button – which we’re about to work on in the next step.

Step 2. Select a floating button template

Now, let’s take a look at the 3 most popular sticky contact buttons you can use to trigger the form. Feel free to click on any of the templates to activate the preview mode and see them in action.

Sticky side contact button

Of all contact button formats, this is the most popular one. It sticks to the side of a page and stays there as your visitors scroll down.

To add a more personal touch, you can change the call to action and use something like “Any questions?” or “Need help?” instead of a standard “Contact Us” copy.

Sticky bottom button

This button is similar to the previous one, and it’s also a popular choice among website owners. It’s sitting at the bottom of the page where it remains accessible but not distracting.

Notice that this template also contains a little icon next to the copy. Once you add the button to the dashboard, you can change the icon, as well as the copy.

Floating “Contact us” button with an image

Instead of the standard button, you may want to use a button with an image implying what type of communication you’re open to.

For example, if you’re encouraging visitors to leave a callback request or a technical question, you can use a corresponding image from the gallery.

Once you select a floating button, add it to your Getsitecontrol dashboard, the same way you did with the contact form earlier.

Step 3. Connect the button to the form

The last step is to connect the button and the contact form, so that a click on the button will trigger the form to pop up.

To do that, open the button editing menu and select your contact form from the Background click dropdown menu as illustrated below.

When you’re done with the settings, click Save & close to save the changes.

Finally, follow the prompts in your dashboard to activate the button and the form. Once you’ve connected Getsitecontrol to your website, the floating Contact Us button will instantly go live.

Connecting Getsitecontrol is easy and requires zero coding knowledge. You can either follow the prompts in your dashboard or read the instructions for your website platform.

Customization tips

Now that you have a general idea of how to quickly add a contact button to your website, here are a few tips you may find useful down the road.

• 💡 You can use the floating button to launch any popup, not just a contact form. Consider a technical request form, a callback form, or an order form, as examples.
• 💡 You can set up precisely the time and condition for the “Contact Us” button to appear and disappear from the page — in case you don’t want it to be displayed at all times. To do that, use the Targeting tab.
• 💡 You can also set up an Autoresponder and send a custom email to those who have filled out the form – given it includes an email capturing field. To do that, use the Notifications tab.

Let visitors message you with a contact button

Whether you want to collect feedback or let visitors reach you without having to scroll through the entire website looking for a contact form – a floating button can be a solution.

So, what are you waiting for? Add one to your website right now and make yourself available for communication.