How to Create Sticky Floating Footer Bar in WordPress?

1
Simple Way to Create Sticky Floating Footer Bar
in WordPress

Guided by How to Create a Floating Footer Bar in
WordPress
2
What is floating footer bar?

• A Sticky Floating Footer Bar allows you to
  display your important contents to users. So
  users can click on it and find useful content.
• It is very helpful to decrease bounce rate and
  increase the viewed pages for the users.
• You can use it to make your email lists or get
  more clicks on the other page
• or to bring attention for a sale/special offer.

3
Creating Sticky Floating Footer Bar in WordPress

• There are two methods to create Sticky Floating
  Footer Bar in your WordPress website.
• In the first method, we will create it manually.
• In the second method,we will use OptinMonster
  plugin for creating floating footer bar in
  WordPress.
• You can choose one method which one you can use
  easier.

4
Method 1 Creating Manually

• For this method, you have to add code to your
  WordPress file. You need to connect your website
  in cPanel by using FTP client or file manager.
• In your FTP client, you need to search the
  footer.php in your WordPress theme folder and
  download it on your desktop.
• Now, open footer.php file in any text editor and
  add the code before the body tag.
• In your next step, you have to add CSS code. You
  can use custom CSS plugin or add CSS to a
  style.css file of your WordPress theme.
• If You do not set the display for any item in
  your list then you can not see the changes in
  your website.
• For this we will use JQuery. Open a text editor
  and add the JQuery code and save it as
  floatingbar.js.

5

• Now, open your FTP client and connect to your
  web server. Go to the theme folder and search the
  js folder.
• You have to upload floatingbar.js file to the
  WordPress theme. Now your next step is load the
  javascript file to the WordPress theme. Paste the
  code into function.php of your theme file.
• Now, you can see the floating footer bar on your
  WordPress website.
• The advantage of this method that you can see
  many link randomly in the floating footer bar.
• If you use this method, you have to add the code
  and you cant use this for other things without
  doing CSS optimization.

6
Mehod 2 By Using OptinMonster

• It is very popular lead generation plugin. It
  helps to convert all website visitor into customs
  and visitors. Floating footer and header is one
  of its feature and use to display an email optin
  form and to promote single link or offer.
• OptinMonster is a premium service. Once you
  purchase it, you can use OptinMonster
• WordPress API plugin on your website. It
• is serve as a connector between WordPress
• site and OptinMonster.
• After activation, it will add a OptinMonster
• menu in your WordPress Admin bar.
• By clicking on it, you will go to the
• setting page.

7

• In this page, you will be asked to provide your
  OptinMonster API key and username. You can get
  this key from your OptinMonster account. Copy and
  paste these keys into setting and click on the
  connect to OptinMonster button.
• This plugin add your WordPress site to your
  optinMonster account. Now, you click on create
  new Optin button. Now, you are on the create new
  optin page on OptinMonster site. In this you have
  to provide a title for your optin campaign and
  choose a site where you will using optin. If your
  site is not listed then click on the new site.
• After this you can click on the floating bar
• in select your optin type to use template
• to use as floating bar.
• It is launch a customizer when you select
• a template. It is a point and click builder
• Where you can configure appearance and
• Setting to your optin.

8

• When you have configure appearance to your
• optin then click on the save button. When
• you create a floating bar first time, it is
• paused by default.
• Once you have configured go to the status
• bar and select start campaign.
• Now return to the admin area of your
• WordPress website and go to the
• OptinMonster gt Optins.
• Here you will see your listed. Click the edit
  output setting link to continue. On the next
  page, check the box which is next to the Enable
  optin on site and save the setting.
• Now, your floating footer bar opitn is live on
  your WordPress site.

9
Conclusion

• In this post we have discussed about simple way
  add sticky floating footer bar in WordPress.
• We hope this article will help you to create
  sticky floating footer bar.
• For more info, go to the link below
• How to Create Sticky Floating Footer Bar in
  WordPress?