With a fixed floating banner or bar, you can display a message at the top or bottom of your website without disrupting the user experience. This allows you to promote email signups, products, flash sales, social media accounts, and display any personalized message. For example, you might want to display cookie settings to ask your visitor’s permission to track their data as they navigate through your site.
In this step-by-step guide, we’ll show you the easiest way to create a floating banner in WordPress. Before we begin the tutorial, let’s clarify what exactly a fixed floating banner is.
What is a Sticky Floating Bar?
A fixed floating banner stays at the top or bottom of your web page as visitors scroll.
These bars are always visible to the user and they can interact with your message at any time during their browsing journey.
Sticky bars are designed to be flexible and serve multiple purposes, so you can adapt them to display any message you want. For example, india phone number list you could add a welcome discount for new visitors or promote a newly added product to maximize visibility.
When used correctly, floating bars can be used to:
- Increase your sales and revenue through flash sales, discounts and offers
- Drive traffic to your online content (podcasts, articles, guides, videos, and more)
- Increase website engagement and conversions
- Generate leads and subscribers to grow your email marketing list
- Increase social media engagement and followers
- Increase brand recognition
There are many ways to use sticky bars to your advantage. With that in mind, let’s learn how to create an engaging floating banner in WordPress for your website.
Creating a Fixed Floating Banner for WordPress
There are several floating bar plugins for WordPress, but not all of them offer the features you need to easily create and customize a floating bar.
We’ll show you how to create one in under 5 minutes, without touching a single line of code, using our favorite floating banner tool called OptinMonster .
OptinMonster is the #1 lead generation tool that lets you create engaging marketing campaigns to convert your visitors into customers, including floating bars, pop-ups, slide-ins, inline forms, and more.
OptinMonster comes with a library of 50+ pre-designed floating bar templates so you don’t have to start from scratch.
You’ll find designs for announcements, discounts, popular holiday deals, newsletter signups, and more.
You can preview and select a template of your choice. Then there is a drag and drop builder that is very easy to use. You can customize the text, image design, colors, and more, all with a click of the mouse button.
Additionally, OptinMonster lets you set up targeting rules so you can show your floating banners to the right people at the right time and place. For example, marketing without ai will fall behind you can set your campaign to only show to new users or those who are about to leave your site. It also lets you retarget and track your leads to improve engagement.
Plus, OptinMonster tracks and displays all the important stats you need right in your dashboard. You can see how many visitors viewed and clicked on your WordPress floating banner, and even how much money you made from the campaign.
To give you an idea of what you can do with OptinMonster, here are some example campaigns:
The best thing about OptinMonster is that it gives you the flexibility to create and manage all of your campaigns, including floating bars, right from your WordPress dashboard.
Now, let’s not waste any time and start creating our floating banner for WordPress with OptinMonster.
Step 1: Install and Activate the OptinMonster Plugin
First, you’ll need to sign up for an OptinMonster account . The plugin starts at $9 per month with a 30-day money-back guarantee.
Next, you will need to install the OptinMonster plugin to connect the account to your website.
The connector plugin is available for free, so you can easily download it from your WordPress dashboard. For more details, marketing list see our guide on how to install a WordPress plugin .
When you install and activate the OptinMonster plugin on your website, it will launch a setup wizard. You will be given the option to connect your newly created account.
Keep in mind that if you are logged into your OptinMonster account in another tab, the plugin will automatically detect and sync your site.
Now you can start creating your first floating banner for WordPress with OptinMonster.
Step 2: Create a new floating bar campaign
OptinMonster allows you to create and customize floating banners right inside your WordPress admin panel.
To do this, go to the OptinMonster tab and you will be able to see different types of lead generation campaigns like popup, floating bar, fullscreen, inline, and more.
To create a fixed bar campaign in WordPress, we will choose the Floating Bar option .
This will open the template library which consists of stunning floating banner templates that you can choose from.
Here, you can hover over any template to preview the floating banner fixed on the same page. Once you find the best design for your campaign, click the Use Template button to create your floating banner.
This will open a pop-up window where you can give your floating bar campaign a name.
Then click the Start Building button to launch the OptinMonster campaign builder.
Step 3: Customize Your WordPress Floating Banner
In the campaign builder, you will see all the element blocks on the left and the sticky bar preview on the right side. Here, you can easily drag and drop the required blocks into your banner.
You will find the 12 blocks that can be used to make your banner more engaging and interactive.
Some of the useful element blocks are:
- Countdown
- ChatBot
- Social icons
- Opt-in fields
- Yes/No button
Edit content blocks
If you want to customize any content block, just click on it and you will see the block editor open in the left taskbar.
For example, you can replace the image by uploading your own image or choosing one from your existing media library. You can also change image settings like opacity, width, alt text, and more.
