Add a like button to WordPress posts

Before you start: get a key

1. Sign in with GitHub on the dashboard and add your site.
2. Create a button. In its allowed origins, list every address your site is served from, one per line and without a path, such as https://example.com. Add the address you preview on locally too, exactly as the browser shows it. A page on an origin that is not listed cannot load the button, so nobody else can use your key.
3. Copy the key. It starts with pk_. Below, it stands in as pk_YOUR_BUTTON_KEY.

Block themes: the Site Editor

For block themes such as Twenty Twenty-Four and Twenty Twenty-Five:

1. Go to Appearance → Editor → Templates and open Single Posts.
2. Select the Content block, then add a Custom HTML block right after it.
3. Paste the tag below into it and save the template.

<script src="https://appreciate-button.com/widget.js" data-key="pk_YOUR_BUTTON_KEY" async></script>

Any theme: a few lines of PHP

Add this to a child theme's functions.php, or to a code-snippets plugin, so a theme update does not remove it. It loads the script on single posts and adds the button after the post content.

add_action( 'wp_enqueue_scripts', function () {
	if ( is_singular( 'post' ) ) {
		wp_enqueue_script(
			'appreciate-button',
			'https://appreciate-button.com/widget.js',
			array(),
			null,
			array( 'strategy' => 'async' )
		);
	}
} );

add_filter( 'the_content', function ( $content ) {
	if ( is_singular( 'post' ) && in_the_loop() && is_main_query() ) {
		$content .= '<appreciate-button data-key="pk_YOUR_BUTTON_KEY"></appreciate-button>';
	}
	return $content;
} );

The strategy argument needs WordPress 6.3 or later.

Things to know

• WordPress keeps <script> tags only for users allowed to post unfiltered HTML, normally administrators. On WordPress.com, that takes a plan that allows plugins.
• A caching plugin serves the page as it was, but the button loads its count on its own, so cached pages still show the latest number.
• Add both https://example.com and https://www.example.com to the allowed origins if your site answers on both.