How to add YouTube pop up to your website or blog
Adding a subscribe button to your website is a great way to increase your YouTube channel's visibility and encourage people to subscribe. You can add a subscribe button to your website using a few simple HTML code snippets. First, you'll need to find the code for a YouTube subscribe button. You can get this code from the YouTube Developers website. Once you have the code, you'll need to add it to your website's HTML code. For now you don't have to surf the web you can use this code on my website.Just copy and paste the following css code to your website html just before or after the b:skin of your css code.
/* Popup Subscribe Button Designed By Key2blogging */ .YT-subscribe {position: fixed; center: 35px;bottom: 20px;background-color: #ececec;padding: 12px 12px 12px 12px;border-radius: 10px 10px 0px 0px;display: flex;align-items: center;max-width: 320px; min-width: 280px;height: auto;color: #000000;overflow: hidden;z-index: 100;border-bottom: 4px solid #ff3b00;box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;} .YT-subscribe .YT-subscribe-close { position: absolute; top: 4px; right: 8px; } .YT-subscribe .YT-subscribe-close svg { width: 22px; height: 22px; fill: #000; } .YT-subscribe .YT-subscribe-img { width: 70px; height: 50px; } .YT-subscribe .YT-subscribe-img img { display: flex; align-items: center; justify-content: center; width: 50px; } .YT-subscribe .YT-subscribe-content { width: calc(100% - 70px); padding-left: 1px; } .YT-subscribe .YT-subscribe-content a { display: block; color: inherit; } .Subscribe_btn {font-weight: 600;font-size: 12px;display: flex;align-items: center;justify-content: center;width: 120px;height: 30px;padding: 5px 6px;background-color: #e4393c;border-radius: 4px; color: #fff;margin-top: 12px;bottom: 0;right: 0;flex-wrap: wrap;flex-direction: row;align-content: center;} .YT-subscribe .YT-subscribe-content .YT-title { display: block; font-weight: 700; font-size: 13px; text-align: left; padding-left: 12px } .YT-subscribe .Subscribe_btn a { display: block; color: inherit; color:#fff; } .YT-subscribe .YT-subscribe-content .YT-desc { display: block; font-size: 10px; margin-top: 5px; color: #000; text-align: left;padding-left: 12px; line-height: normal; font-weight: 500; } .YT-btn-text{margin-left:9px}
After adding your css code,it is advisable to place this HTML-code just before the closing body tag of your HTML.