Want to grow your YouTube channel subscribers?
Adding a YouTube subscribe button to your website is a powerful way to promote your channel and turn visitors into loyal subscribers. In this guide, we’ll show you exactly how to embed a YouTube subscribe button on your Blogger, WordPress, or any other website—quickly and easily.
Why Should You Add a YouTube Subscribe Button to Your Website?
Adding a YouTube subscribe button to your website can help:
• Increase subscribers to your YouTube channel
• Promote your channel to website visitors
• Drive more traffic to your YouTube content
• Boost your online presence and credibility
1- YouTube Channel Subscription Box (Fixed Sidebar) for Blogger:
With the code below, you can create and add a stylish, unique YouTube channel subscription box to your blog. This side widget can be placed in your sidebar or any other preferred location on your blog. When clicked, it will allow visitors to subscribe to your YouTube channel directly.
Code Sidebar
<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>YOURCHANNEL NAME</h2> <p> Subscribe now to follow everything new and exclusive on our YouTube channel </p> <a
href="https://youtube.com/channel/XXXYOUR CHANNEL IDXXX?sub_confirmation=1">Subscription</a>
</div>
Note:
Replace the YouTube channel ID in the code above (XXXYOUR CHANNEL IDXXX) with your own YouTube channel ID. You can also customize the text ("YOURCHANNEL NAME", "Subscribe Now...", "Subscribe") to any other text you prefer.
2- YouTube Channel Subscription Box (Popup) for Blogger:
Using the code below, you can create and add a YouTube channel subscription popup to your blog. This popup will appear when visitors arrive at your website or blog, allowing them to subscribe to your YouTube channel with just one click.
Code Popup
<!-- 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>YOURCHANNEL NAME</h2> <p>Subscribe now to get everything new and exclusive on our YouTube channel</p> <a
href="https://youtube.com/channel/XXXYOUR CHANNEL IDXXX?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:
Replace the YouTube channel ID in the code (XXXYOUR CHANNEL IDXXX) with your own channel ID. You may also customize the text elements:
"YOURCHANNEL NAME"
"Subscribe Now..."
"Subscribe"
with any alternative text you prefer.