Extensions

April 27th, 2020 4:39 pm

How to Embed YouTube’s Subscribe Button on Your WordPress Site

"Getting visitors to subscribe to your YouTube channel is one of the best ways to engage your website visitors to follow you on YouTube. It also helps them to find other products, service and resources that you provide. "

In a hurry and don’t have time to read through the article? watch the video below

Providing a seamless integration between multiple marketing channels is one of the most important factors to success.

In this tutorial, we’ll show you how to create a YouTube channel subscribe widget and embed it on any page of your site.

We’ll also go one step further and show the channel subscribe button just under every YouTube video embed you add on your site. You can see a working version of the widget under the YouTube video in this post. For this section you will need to know a little bit of CSS and JavaScript.

Create the YouTube embed code

  1. Go to the YouTube embed channel page by clicking here
  2. Enter your YouTube channel name or ID in the first field. I recommend adding your channel ID to avoid any possible conflicts between channels with similar names. If you are not sure where to find the channel ID, click here (You need to be logged in to your YouTube account for this)
  3. Select the layout, theme and if you wish to show the subscribers count or not
  4. A preview and code will be automatically generated for you and should look something like in the screenshot below


  5. Copy the entire code and paste it in any widget or page of your site.

And that’s basically how you add a YouTube subscribe button to your site.

Automatically adding the YouTube Subscribe button under every embed videos on every page

OK, this is where it get a bit technical but nothing too complex. Even if you are not comfortable with CSS and JavaScript, don’t worry. Just follow the instructions and copy and paste the code in your theme functions.php file.

  1. Go to your WordPress admin and login
  2. Click on “Appearance” > “Theme Editor”
  3. On the right hand side, you should see a list of files under “Theme Files”
  4. Click on the “Theme Function (functions.php)” file
  5. Copy and paste the code below at the bottom of the file
function wptroll_enqueue_youtube_subscribe_btn() {

    wp_enqueue_script( 'wptroll_youtube_subscribe_embed', 'https://apis.google.com/js/platform.js', array(), null, true );
    wp_add_inline_script( 'wptroll_youtube_subscribe_embed', 'jQuery(document).ready(function() { jQuery("figure.is-provider-youtube").after("<div class=\"g-ytsubscribe\" data-channelid=\"UC6MWXc4VWsS1nAVAPfkKfrg\" data-layout=\"full\" data-count=\"default\"></div>"); });' );

 }
 
 add_action( 'wp_enqueue_scripts', 'wptroll_enqueue_youtube_subscribe_btn' );

You should have something like the screenshot below

Important: Make sure you change the data-channelid value to your channel ID

And that’s all. When you embed YouTube videos on your posts and pages, the subscribe to YouTube widget should appear under the video

YouTube’s terms for using their embed subscribe widget

To read the full terms click here. I’ve outlined the main and most relevant points below:

  • You may not offer or promote prizes or rewards of any kind in exchange for clicking on a YouTube Subscribe Button.
  • Buttons must be fully and clearly visible.
  • You may not use a Subscribe Button to track any data about a user related to the user’s actions or browsing activity, including without limitation whether or not a user clicks on a YouTube Subscribe Button. This prohibition includes but is not limited to using pixels, cookies, or other methods of recognizing when a user clicks on a YouTube button.

This little widget will greatly improve the user experience to subscribe to your YouTube channel and it’s really easy to do, so you might as well do it.


Share it

Author
James Reddy

Editor

James has been coding for the web since he got his first Pentium I PC back in 1996. With over 15 years professional web development experience and Linux administration, James decided to share his knowledge on WP Troll, a site dedicated to all things WordPress.

More:

No comments

There are no comments for this post. Be the first to start the discussion!

Leave a comment

Your email address will NOT be published.
Please DO NOT use keywords in the name field.
Let's have a meaningful discussion.

Let us keep you updated. Get a weekly digest in your inbox.

Subscribe to the weekly articles digest.