How To Add Facebook Page Follow Button Widget To Blogger Blog

Using the information given below, you can add the Facebook page follow button widget to your Blogger blog.

How To Add Facebook Page Follow Button Widget To Blogger Blog :

Follow the steps below :

1. Log In Blogger >> 2. Dashboard >> 3. +add a Gadget >> 4. HTML/JavaScript

Copy the below code and paste it in HTML/JavaScript content

<div style="display: flex; justify-content: center; align-items: center; padding: 20px;">

  <div style="max-width: 350px; width: 100%; text-align: center; padding: 15px; border-radius: 10px; background: #f0f2f5; box-shadow: 0 2px 6px rgba(0,0,0,0.1); font-family: Arial, sans-serif;">

    

    <p style="font-size: 16px; font-weight: bold; color: #1877f2; margin-bottom: 10px;">

      👍 Follow us on Facebook

    </p>

    <div class="fb-page" 

      data-href="https://www.facebook.com/YourPageUsername" 

      data-tabs="" 

      data-width="" 

      data-height="" 

      data-small-header="false" 

      data-adapt-container-width="true" 

      data-hide-cover="false" 

      data-show-facepile="true">

      <blockquote cite="https://www.facebook.com/YourPageUsername" class="fb-xfbml-parse-ignore">

        <a href="https://www.facebook.com/YourPageUsername">Facebook Page</a>

      </blockquote>

    </div>

  </div>

</div>

<!-- Facebook SDK (Only once per page) -->

<div id="fb-root"></div>

<script async defer crossorigin="anonymous" 

  src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v17.0" nonce="XYZ123">

</script>

Note : Add your Facebook page username in place of your YourPageUsername.

• Now Save the HTML/JavaScript and also save the layout settings. 

Now refresh your blog and see that the Facebook Page Follow button Widget will have been added.