How to Add a YouTube Subscribe Button to your Website

Youtube subscribe button for wordpress or website is a one line code. Use this offical iFrame code to add Youtube widget with Subscriber count on your website.

Youtube subscribe button on your website

If you have a YouTube channel for your videos, you would certainly like to make it visible on your blog too. Isn’t it?

Youtube subscribe button for website or wordpress blog

This is similar to the other social widgets (example: facebook like box) that you would have already set up on your site, with a difference that youTube widget is not that popular.
At-least, I have not seen it much on the other sites. That does not mean it is not useful.

It has the most important ‘Subscribe’ button embedded in it. Now, your visitors can subscribe to your channel right from your blog.

Here is the code that you need to use:

<iframe 
src="http://www.youtube.com/subscribe_widget?p=YOUR_YOUTUBE_CHANNEL_NAME" 
style="overflow: hidden; height: 75px; width: 300px; border: 0;" 
frameborder="0" scrolling="no">
</iframe>

Example: inHouseRecipes (our sister site) official youtube channel widget:

Do not forget to add your own channel’s name in the iFrame code (marked in RED). The height and width of the widget is governed by the style attribute and you can change it as per your site’s requirements.

YouTube Subscribe Button for WordPress

The above code can easily be used in your wordpress sidebar as a widget.

Go to WordPress Admin->Widgets->Add a ‘Text’ widget to your sidebar.
Then, paste the above iFrame code to the text widget. Save and you are all set.

Youtube subscribe button for wordpress – Add it in Sidebar

As a matter of fact, you can add this iFrame code anywhere in wordpress code, if you know the location and the files to be modified.

Suggestion

Tip: You may want to wrap this code inside a print hidden box to make sure that it doesn’t get printed on paper while some-one prints the article.

If your blog or website uses Bootstrap CSS or theme, you can use the following CSS class to hide it from print:


<div class="hidden-print">YOUR YOUTUBE IFRAME CODE as provided above</div>

Let me know if you need more information in the comments.

Note: This article was originally written by Anil Gupta on inHouseRecipes.com in section Food Blogging Guide.

Disqus Comments Loading...