Adding a YouTube Subscription Box to Your Website: A Step-by-Step Guide
Are you looking for ways to increase the number of subscribers to your YouTube channel? Adding a YouTube subscription box to your website effectively promotes your channel and encourages visitors to subscribe. In this article, we'll easily show you how to add a YouTube subscription box to your Blogger, WordPress, or any other website.
Why Add a YouTube Subscription Box to Your Website?
Adding a YouTube subscription box to your website can help:
- - Increase the number of subscribers to your YouTube channel
- - Promote your channel to your website visitors
- - Drive more traffic to your YouTube channel
- - Enhance your online presence and credibility
How to Add a YouTube Subscription Box to Your Website
Adding a YouTube subscription box to your website is a simple process that can be completed in a few steps:
Step 1: Get Your YouTube Channel ID
You need to get your YouTube channel ID to add a YouTube subscription box to your website. You can find your channel ID in your YouTube account settings.
Step 2: Choose a Subscription Box Design
There are several designs available for YouTube subscription boxes. You can choose a design that matches your website's theme and style.
Step 3: Add the Subscription Box Code to Your Website
Once you've chosen a design, you need to add the subscription box code to your website. You can add the code to your website's HTML or use a plugin/module to add the subscription box.
Step 4: Customize the Subscription Box
After adding the subscription box code to your website, you can customize the box to match your website's theme and style. You can change the box's color, font, and layout to suit your needs.
Explanation of Adding a YouTube Subscription Box to Your Website
As I explained earlier, there are several ways that I will talk about how to add a YouTube channel subscription button to Blogger blogs, your website, or your blog on WordPress, and in this article, I will explain four ways or methods to add a YouTube channel subscription button within your website or blog, which are:
- Text link to directly subscribe to YouTube channel
- YouTube Subscribe Button Live
- Fixed box for YouTube channel subscription (fixed sidebar).
- YouTube channel subscription box popup that appears when you enter your website or blog.
You can preview the look of the boxes and add-ons for the YouTube Channel Subscription Box in the four forms mentioned above by clicking on the preview button below:
Text link to directly subscribe to YouTube channel
Through the following code, you will be able to create and add a YouTube channel subscription link to your blog, which, by clicking on it, will subscribe to the YouTube channel.
<script src="https://apis.google.com/js/platform.js"></script>
<div class="g-ytsubscribe"
data-channelid="UCPkSh42N_0NBpj4sXxWPvdA?sub_confirmation=1"
data-layout="default" data-count="default"></div>This method allows you to create a text link to add a YouTube subscribe button directly within your Blogger or WordPress posts. You can create a text link as an internal link in your blog posts to direct visitors to subscribe directly to your channel. In fact, this method will give you more freedom to gain more subscribers to your YouTube channel through your website or blog.
<a href="https://www.youtube.com/channel/UCPkSh42N_0NBpj4sXxWPvdA?sub_confirmation=1">Subscribe now to our YouTube channel and follow the best explanations and lessons first hand </a>YouTube Channel Subscribe Button
Through the following code, you will be able to create and add a YouTube channel subscription button to your blog, which, when clicked, will subscribe to the YouTube channel.
<script src="https://apis.google.com/js/platform.js"></script>
<div class="g-ytsubscribe"
data-channelid="UCPkSh42N_0NBpj4sXxWPvdA?sub_confirmation=1"
data-layout="default" data-count="default"></div>YouTube Channel Subscription Box (Fixed Sidebar) for Blogger Blogs
Through the following code, you will be able to create and add a YouTube channel subscription box to your blog beautifully and distinctively as a side box in the sidebar or anywhere else you want within your blog, which by clicking on it will subscribe to the YouTube channel.
You can benefit from my previous article about: Blogger Conditional Tags (data: view)
You can preview what the YouTube channel subscription box (fixed sidebar) will look like by clicking here.
<style> .ms-youtube{text-align:center} .ms-youtube
h2{margin-top:20px;font-size:24px} .ms-youtube
p{font-size:14px;text-align:center;margin:20px 0;line-height:25px} .ms-youtube
a{display:block;font-weight:700;width:150px;position:relative;margin:10px
auto;font-size:17px;text-align:center;background-color:red;border-radius:10px;color:#ffffff;text-decoration:none;padding:10px
0;transition:all 0.3s ease} .ms-youtube
a:hover{background-color:#d5d5d5;color:#000} .ms-youtube
.ms-icon-svg{display:inline-flex;align-items:center;background:red;color:white;border-radius:50%;padding:30px;text-align:center}
.ms-youtube .ms-icon-svg
svg{fill:#fff;width:45px;height:45px;vertical-align:middle} </style>
<!-- YouTube Channel Subscription Box - Faisal Blog --> <div
class="ms-youtube"> <div class="ms-icon-svg"><svg viewbox='0 0 32
32'><g><path
d='M29.73,9.9A5,5,0,0,0,25.1,5.36a115.19,115.19,0,0,0-18.2,0A5,5,0,0,0,2.27,9.9a69,69,0,0,0,0,12.2A5,5,0,0,0,6.9,26.64c3,.24,6.06.36,9.1.36s6.08-.12,9.1-.36a5,5,0,0,0,4.63-4.54A69,69,0,0,0,29.73,9.9Zm-2,12A3,3,0,0,1,25,24.65a113.8,113.8,0,0,1-17.9,0,3,3,0,0,1-2.78-2.72,65.26,65.26,0,0,1,0-11.86A3,3,0,0,1,7.05,7.35C10,7.12,13,7,16,7s6,.12,9,.35a3,3,0,0,1,2.78,2.72A65.26,65.26,0,0,1,27.73,21.93Z'/><path
d='M21.45,15.11l-8-4A1,1,0,0,0,12,12v8a1,1,0,0,0,.47.85A1,1,0,0,0,13,21a1,1,0,0,0,.45-.11l8-4a1,1,0,0,0,0-1.78ZM14,18.38V13.62L18.76,16Z'/></path></path></g></svg></div>
<h2> NiaDZGN Blog</h2> <p> Subscribe now to follow everything new and exclusive on our YouTube channel </p> <a
href="https://youtube.com/channel/UCPkSh42N_0NBpj4sXxWPvdA?sub_confirmation=1">Subscription</a>
</div>YouTube Channel Subscription Box (Popup) for Blogger Blogs
Through the following code, you will be able to create and add a YouTube channel subscription box to your blog as a pop-up window that appears to the visitor when he enters your site or blog, and by clicking on it, he will subscribe to the YouTube channel directly.
<!-- Niadzgn.blogspot.com --> <style>
.nia-youtube{background:#ffffff;z-index:100;width:300px;padding:30px
40px;position:fixed;transform:translate(50%,-50%);right:50%;top:50%;border-radius:8px;text-align:center;box-shadow:0
5px 20px rgb(0 0 0 / 20%)}.nia-youtube
h2{margin-top:20px;font-size:24px}.nia-youtube
button{display:block;line-height: 1;position:absolute;top:0;left:0;margin:10px
10px
auto;background:red;font-size:28px;color:#ffffff;border-radius:100%;width:32px;height:32px;border:none;outline:none;cursor:pointer;transition:all
0.3s ease}.nia-youtube
button:hover{background:antiquewhite;color:#6c6c6c}.nia-youtube
p{font-size:14px;text-align:center;margin:20px 0;line-height:25px}.nia-youtube
a{display:block;font-weight:700;width:150px;position:relative;margin:10px
auto;font-size:17px;text-align:center;background-color:red;border-radius:10px;color:#ffffff;text-decoration:none;padding:10px
0;transition:all 0.3s ease}.nia-youtube
a:hover{background-color:#d5d5d5;color:#000}.nia-youtube
.nia-icon-svg{display:inline-flex;align-items:center;background:red;color:white;border-radius:50%;padding:30px;text-align:center}.nia-youtube
.nia-icon-svg
svg{fill:#fff;width:45px;height:45px;vertical-align:middle}</style>
<!-- YouTube Channel Subscription Box - NiaDZGN blog --> <div
class="nia-youtube"> <div class="nia-icon-svg"><svg viewbox='0 0 32
32'><g><path
d='M29.73,9.9A5,5,0,0,0,25.1,5.36a115.19,115.19,0,0,0-18.2,0A5,5,0,0,0,2.27,9.9a69,69,0,0,0,0,12.2A5,5,0,0,0,6.9,26.64c3,.24,6.06.36,9.1.36s6.08-.12,9.1-.36a5,5,0,0,0,4.63-4.54A69,69,0,0,0,29.73,9.9Zm-2,12A3,3,0,0,1,25,24.65a113.8,113.8,0,0,1-17.9,0,3,3,0,0,1-2.78-2.72,65.26,65.26,0,0,1,0-11.86A3,3,0,0,1,7.05,7.35C10,7.12,13,7,16,7s6,.12,9,.35a3,3,0,0,1,2.78,2.72A65.26,65.26,0,0,1,27.73,21.93Z'/><path
d='M21.45,15.11l-8-4A1,1,0,0,0,12,12v8a1,1,0,0,0,.47.85A1,1,0,0,0,13,21a1,1,0,0,0,.45-.11l8-4a1,1,0,0,0,0-1.78ZM14,18.38V13.62L18.76,16Z'/></path></path></g></svg></div>
<button id="close">×</button> <h2>NiaDZGn</h2> <p>Subscribe now to get everything new and exclusive on our YouTube channel</p> <a
href="https://youtube.com/channel/UCPkSh42N_0NBpj4sXxWPvdA?sub_confirmation=1">Subscribe</a>
</div><script
type="text/javascript">window.addEventListener("load",function(){setTimeout(function
a(b){document.querySelector(".nia-youtube").style.display="block"},1000)});document.querySelector("#close").addEventListener("click",function(){document.querySelector(".nia-youtube").style.display="none"});</script>Note: Change the YouTube channel ID in the code above. UCPkSh42N_0NBpj4sXxWPvdA With your YouTube channel ID, you can also change the text to any other text you want.
Conclusion
Adding a YouTube subscription box to your website is a simple and effective way to promote your channel and increase the number of subscribers. By following the steps outlined in this article, you can add a YouTube subscription box to your Blogger, WordPress, or any other website with ease.
