How to add Facebook Like button to WordPress/Blogger
NOTE: This is an updated guide (2026)
If you want to grow your digital presence, making it effortless for readers to share your content on social networks is non-negotiable.
However, if you are trying to add a Facebook Like Button to WordPress or Blogger using code snippets from older online tutorials, you have likely run into broken layouts, blank spaces, or frustrating security errors.
The web has evolved.
Today, security protocols, modern Block Themes, and strict page-speed requirements mean classic copy-and-paste iframe code no longer works.
Forcing outdated widgets onto your site will only slow it down and hurt your search rankings.
In this guide, you will learn why the old-school methods broke down and how to implement the clean, modern alternatives for both WordPress and Blogger platforms.
Why legacy Facebook Like buttons no longer work
In the early days of blogging, adding a social widget was as simple as pasting a snippet of code provided by Facebook's developer portal.
Today, that old approach triggers three massive performance and security bottlenecks:
- Mixed Content Security Blocks: Older snippets use unsecured
http://links. Modern web browsers strictly enforce securehttps://protocols and will instantly block unsecured external frames from loading. - Core Web Vitals Penalties: Official external widgets force a user's browser to download massive, external tracking scripts before the actual page text can load. This tanks your Largest Contentful Paint (LCP) speed scores.
- The Death of Theme Files: Modern WordPress structures have moved away from classic theme files like
single.php, rendering old theme-editor copy-paste hacks completely obsolete.
To bypass these bottlenecks, we must shift away from heavy iframe widgets and adopt clean, lightweight sharing methods.
Here are two workable ways to add Facebook Like button WordPress or Blogger.
I have tried both methods, and they work perfectly.
Method 1: The modern, fast way (WordPress & Blogger)
The absolute best approach today is to use a secure, native Facebook Share Link stylized as a button.
It mimics the behavior of a standard Like button but requires absolutely zero external JavaScript, ensuring your page loads at lightning speed.
For WordPress Users:
You don't need to touch complex theme files.
You can insert a clean link using the native Block Editor:
- Open your post or page template in the WordPress Dashboard.
- Add a standard Buttons Block where you want the link to appear.
- Paste the following clean URL string into the button link field: https://www.facebook.com/sharer/sharer.php?u=yourdomain.com
For Blogger (Blogspot) users:
To automatically fetch and share the exact URL of whichever post your reader is viewing, you can inject a dynamic variable into your template:
- Log in to your Blogger Dashboard and navigate to the Theme section.
- Click the dropdown menu next to "Customize" and select Edit HTML.
- Click inside the code box, press Ctrl + F, and search for the target tag:
<data:post.body/> - Paste the following responsive, secure code block directly ABOVE that tag:
- Click the Save icon in the top right corner.
Method 2: Using the official meta developer SDK
If you explicitly want the official, dynamic counter widget that shows the exact number of likes your page has received, you must generate it natively through Meta's secure cloud infrastructure.
- Navigate directly to the official portal:
https://developers.facebook.com/docs/plugins/like-button - Type in your website URL, choose your design parameters, and click the Get Code button.
- Meta will provide two separate packages of code:
- The JavaScript SDK: This must be pasted right after the opening
<body>tag of your WordPress header layout or Blogger HTML template. - The Plugin Code: Drop this secondary container snippet exactly where you want the visual counter button to render within your content columns.
- The JavaScript SDK: This must be pasted right after the opening
Important Performance Warning: Keep in mind that using the official Meta Javascript SDK relies heavily on external server requests. If you notice your mobile pages lagging or shifting layout boxes during loading sequences, we strongly recommend reverting back to the clean Method 1 link framework to keep your site optimized.
Summary: Add Facebook Like button to WordPress
While legacy tutorials still push manual template file editing and outdated iframe strings, modern site architecture demands speed and security.
Choosing a pre-optimized, native sharing approach protects your blog's responsive grid, keeps user data safe, and gives your readers a smooth, error-free browsing experience.
