How to add a floating contact us button to your website

In this post, we’ll show you how to do just that using the Getsitecontrol form builder.

When visitors click on the button, a contact form will pop up on the same page.

The form and the floating button are completely customizable. Whether you decide to change the design, add more fields or pages, you’ll be able to do it without any technical knowledge.

Once a visitor fills it out, their message can go straight to your inbox, your CRM, Helpdesk, Google Sheets – or any other app of your choice. On top of that, you can create an automated email that will be sent to everyone who submits a message.

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, select any form template from the gallery

Then follow the instructions on the right side of the page. If you haven’t created a Getsitecontrol account yet, you’ll be prompted to do so.

After a quick registration, the contact form you’ve selected will open in your Getsitecontrol dashboard. Use the menu on the right-hand side to change the image and text on the form.

Once everything about your form looks correct, go to the Targeting tab, find Start to display the widget section, and remove the default ‘Automatically’ condition. Keep the rest of the default settings unchanged.

This setup means 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.

Side contact button

Of all contact button formats, this is the most popular one. It sticks to the side of the screen and stays there as your visitors scroll up and 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.

Note that you can place a little icon next to the copy to reflect the type of communication you’re open to. Some common examples are an envelope, a phone, or a WhatsApp icon.

Floating “Contact us” button with an image

Finally, you may want your contact button to include an image or a photo of a team member.

Once you select a button template, add it to your Getsitecontrol dashboard, the same way you did with the contact form earlier. Just click on the template and follow the prompts on the right.

You can edit the text, adjust the font, color theme, and the image:

The last step is to connect the button and the form you’ve created, so that a click on the button triggers the form to pop up.

Step 3. Connect the button to the form

On the same editing screen, open the Container menu:

Then find Background click settings and select the option named ‘Show widget’. If any other option is set by default, remove it.

Select your contact form from the dropdown menu as illustrated below.

When you’re done with the settings, click Next → in the top right corner and save the changes. By default, the button will be visible to everyone, at all times. If you want to change that, use the options in the Targeting tab.

The last step is to activate both the button and the form in your dashboard:

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.

How to set up an automated email to confirm form submission

It’s a good practice to send an automated email to those who fill out your form and confirm that you’ve received their message.

There’s no need to use any 3^rd-party email apps – email marketing features are already built-in within Getsitecontrol.

To create an automated email, find the contact form in the dashboard and select Set up automation, then proceed to + Create new.

On the next screen, add a new action and select ‘Send email’:

From there, you’ll just need to craft your submission confirmation email – either from scratch or by using one of the premade templates.

The built-in editor will let you design a professional-looking email within minutes and test it before activating the automation.

If you want to make the most out of your confirmation email, give your visitors a reason to come back to your website and explore it further. For example, you can mention your current promo, showcase your bestseller collection, offer a first-purchase coupon, or link to your social media pages.

Button 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 an email opt-in form, a callback form, or an order form, as examples.
• 💡You can create two different buttons: one for desktop devices and one for mobile devices.
• 💡 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.

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 an excellent solution.

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