How to Add Sticky Footer Ad on WordPress in 2024

New Websites Lose 80% Income Without Ads!

Applied for AdSense and got approval, but not earning as expected?

You’re in the right place! In this blog post, you will learn how to add a sticky footer ad to WordPress website in 2024.

Learn in just 5 minutes with our step-by-step instructions.

Let’s begin!

What is Sticky Ads?

Sticky ads are special ads on websites that stay in one place even when you move up and down the page. They’re usually found at the bottom(footer) of the page.

This is really cool because no matter how much you scroll, the ad stays there and you can always see it. This helps people notice the ad more, ad more means more money.

This makes people like the ad more and maybe click on it. Sticky ads are a new and smart way of showing ads that help people and companies connect better.

Advantages and Disadvantages of Adding Sticky Ads on WordPress

Don’t be confused about whether to add or not.

Here, we have the advantages and disadvantages of adding a sticky footer ad on WordPress. After looking at this, you will get an idea about whether you need sticky ads on your WordPress site or not.

Advantages of Sticky AdsDisadvantages of Sticky Ads
1. Improved Visibility1. Intrusive User Experience
2. Higher Click-Through Rates2. Slower Page Loading
3. Enhanced Ad Revenue3. Potential for Annoyance
4. Persistent Branding4. Compatibility Challenges
5. Better Ad Engagement5. Ad Blocking

We will show you how to add sticky footer ads to your WordPress site using two methods.

First, we’ll change some code in your theme. Second, we’ll use a plugin called a Sticky Ads LightWeight to add sticky footer ad to your WordPress site.

In this method, we will be adding a sticky footer ad to a WordPress site by making some changes in the code.

  • Step 1. Access Your Theme Files
  • Step 2. Go to Footer File:
  • Step 3. Copy and Page the code:
  • Step 4. Update File

Step 1. Access Your Theme Files

adding code in footer for sticky ads on WordPress

Log in to your WordPress dashboard and navigate to Appearance > Theme Editor.

After entering the theme editor, you will need to find the ‘footer.php’ file which is in the right sidebar.

Step 3. Copy and Page the code:

Here is the code; copy it first, and then paste this code into your ‘footer.php’ file, just above the </body> section.

<div class='sticky-ads' id='sticky-ads'>
    <div class='sticky-ads-close' onclick='document.getElementById("sticky-ads").style.display="none"'>
        <svg viewbox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'>
            <path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/>
        </svg>
    </div>
    <div class='sticky-ads-content'>
        <ins class="adsbygoogle"
             style="display:inline-block;height:70px;width:100%;line-height:70px;"
             data-ad-client="ca-pub-xxxxxxxxxxxxx"
             data-ad-slot="xxxxxxxxx">
        </ins>
        <script>
            (adsbygoogle = window.adsbygoogle || []).push({});
        </script>
    </div>
</div>
<style>
    .sticky-ads {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        min-height: 70px;
        max-height: 200px;
        padding: 5px 0;
        box-shadow: 0 -6px 18px 0 rgba(9, 32, 76, .1);
        -webkit-transition: all .1s ease-in;
        transition: all .1s ease-in;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #fefefe;
        z-index: 20;
    }

    .sticky-ads-close {
        width: 30px;
        height: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 12px 0 0;
        position: absolute;
        right: 0;
        top: -30px;
        background-color: #fefefe;
        box-shadow: 0 -6px 18px 0 rgba(9, 32, 76, .08);
    }

    .sticky-ads .sticky-ads-close svg {
        width: 22px;
        height: 22px;
        fill: #000;
    }

    .sticky-ads .sticky-ads-content {
        overflow: hidden;
        display: block;
        position: relative;
        height: 70px;
        width: 100%;
        margin-right: 10px;
        margin-left: 10px;
    }
</style>

If you are not able to copy the code here is the download link, click here.

Note: You need to make some changes to the below code. Simply replace ‘xxxxxxxxxxxxx’ with your publisher ID, and also modify ‘xxxxxxxxx’ with your data ad slot code.

Step 4. Update File

Now after all hit the updated file option which is just below.

In this method, we will be adding a sticky footer ad to a WordPress site by utilizing a plugin. There are only a few individuals who possess a basic understanding of coding.

However, what about those who lack coding knowledge? For my readers who are endeavoring to generate more income by displaying a sticky footer ad on WordPress, here is a guide where we will employ a WordPress plugin.

  • Step 1. Install Plugin:
  • Step 2. Activate Plugin
  • Step 3. Configure Settings
  • Step 4. Save Changes:

Step 1. Install Plugin:

Go to Plugins > Add New in your WordPress dashboard.

plugin section

Search for the “Sticky Ads Lightweight” plugin and install it.

Install Sticky Ads Plugin

Step 2. Activate Plugin

Once the installation is complete, activate the plugin.

Activate Sticky Ads Plugin

Step 3. Configure Settings

Under Settings > Sticky Ad, configure the plugin settings. Input your AdSense code, adjust ad dimensions, and customize display options.

Configure Settings of Sticky Ads Plugin

Step 4. Save Changes:

Click “Save Changes” to apply your settings.

4. Troubleshooting Sticky Ads on WordPress Site

If you encounter any issues with your sticky footer ads not displaying properly, consider the following troubleshooting steps:

  • Ensure the code or plugin is correctly implemented.
  • Check for any conflicting plugins that might affect ad display.
  • Verify your AdSense code integration adheres to Google’s guidelines.

Guidelines and restrictions for implementing sticky ads

Implementing sticky ads on a website can be an effective way to increase ad visibility and potentially boost revenue.

However, it’s essential to follow guidelines and be aware of restrictions to ensure a positive user experience and compliance with advertising regulations.

Here are some guidelines and restrictions to consider when implementing sticky ads:

  • Must adhere to AdX seller program guidelines.
  • Avoid overloading the page with ads; all ads, including sticky ads, should take up less space than the content on the screen.
  • Clearly differentiate between ads and content.
  • Should not come too close to other content, navigational functions, or other ads.
  • All ad attributions and content must be displayed at all times.
  • The horizontal sticky ad should not have any visible stuttering or delay during user scrolling.
  • Ads must not move horizontally or float elsewhere on the page or follow the cursor.

FAQs

Why should I consider adding a sticky footer ad on my WordPress site?

Sticky footer ads are a great way to monetize your website as they have a higher visibility rate compared to traditional ad placements. this can lead to an increased click-through rate(CTR) and potentially higher ad revenue.

Are there any WordPress Plugins for adding sticky footer ads?

Yes, there are several WordPress plugins available that can help you easily add and manage sticky footer ads. Some popular options include Ad Inserter, WP Quads, and Advanced Ads.

Do I need any coding skills to add a sticky footer ad in WordPress?

No, you don’t necessarily need coding skills. Many WordPress plugins offer user-friendly interfaces where you can simply input your ad code or select ad placement options.

Will a sticky footer ad affect my website performance or user experience/

When implemented correctly, sticky footer ads should not significantly impact website performance or user experience. However, it’s essential to monitor your site loading times and ensure the ad doesn’t obscure essential content.

Conclusion

In this article, we are trying to provide the best guide on How to Add a Sticky Footer Ad on WordPress with a powerful strategy to boost your revenue.

I am confident that by following this guide, you will be able to add sticky footer ads to your WordPress website. However, if you find any errors, then use or contact form to ask a question, and I will try my best to help you.

We have put a lot of effort into creating the guide on ‘How to Add Sticky Footer Ad on WordPress‘ for you.

So, if you find it helpful, please consider sharing it to motivate us to continue working diligently on our content.

Was this article helpful? More here:

Have a good day, Bye-Bye…

Was this helpful?

Thanks for your feedback!

Our editorial team is responsible for managing and publishing all the content on here at Bloguplift, led by Subarna Basnet.

Leave a Comment