Add a YouTube Subscribe Button in Blogger

Hello Readers,
How about you all? Hopefully all are well.

Today I am present to give you a new widget. So, take a look!

If you are a YouTubian or you have a YouTube channel and a YouTube blog site, the YouTube Subscribe widget is very useful for you to grow your viewer and subscriber. Many many viewer and subscriber means many many revenue. The process of adding YouTube subscribes button to a blog is easy and can be done within just in a few step.

Step 1: First of all Go to YouTube Developer's Page and add your YouTube Channel name or ID.

Step 2: Scroll down and Copy Your JavaScript code from YouTube Developer's Page. Code like following. Don't need copy following code.

 <script src="https://apis.google.com/js/platform.js"></script>

<div class="g-ytsubscribe" data-channelid="UCekQ9UGPJXmCWhf8FzBdQ7A" data-layout="default" data-count="default"></div> 

Step 3: Now Go to your Blogger Dashboard > Layout > Add a Gadget > HTML/JavaScript and past your YouTube subscribe code which you create from YouTube Developer Page's.

Step 4: Click Save button.

Note: YouTube ID like following picture.

Categories: Blogspot Google Javascript Widget Youtube

Read More

How to make Facebook profile name single

Although Facebook does not make it any ordinary way, but using some tricks to it. I have give you a YouTube link to change the name of a single willing likes just for them.

Youtube link: https://youtu.be/mQj5kEiVRmg

Special Note: 

• You have must need "Google Chrome"  browser (other browser doesn't work)
• After changing your name, change your Facebook language "Bahasa Indonesia" to "English (US)".
• Disable "Geo-proxy extension"

 

Categories: How to? Tips and Tricks Youtube

Read More

Add your youtube video on blog with CSS stylish Laptop frame

Hello, Reader's
How are you all? Hope to all are well.
Here are any YouTubian? If anybody is here this post is must of need for you.

YouTube is most popular video sharing site. We can embedded  any YouTube video on our website/blog with default Frame. But the frame is not attractive and also like unresponsive. Today I will Educate a new system for embedded your video and post your blog/website with attractive "Laptop Frame".

Now lets start the tutorial. Before start work, please take a backup of your template for safety.

At first login your blogger blog. Then follow bellow step.

Step 1: Go To Dashboard > Template > Edit HTML and past bellow code before ]]></b:skin>

 .tb_outer_wrap{width:100%;max-width:650px;margin:15px auto}.tb_video_wrap_macbook{position:relative;padding-bottom:43%;padding-top:0;height:0;overflow:hidden;-webkit-border-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIIk3JFjmIxmkp3X6NW7FBj5AGeQecfxyyvNw8oxm7ixdbA23kQIgJ2dDAiTyWw7iixJ09nEoSVJum29s7FQxAXE0DcMcl7KGip0-cvrprb2_zDsKiFyS5RaZLabZ5GEjJYb4Rcp6d5eby/s1600/macbook+laptop+frame-esobondhu.png) 50 233 112 228 stretch stretch;-moz-border-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIIk3JFjmIxmkp3X6NW7FBj5AGeQecfxyyvNw8oxm7ixdbA23kQIgJ2dDAiTyWw7iixJ09nEoSVJum29s7FQxAXE0DcMcl7KGip0-cvrprb2_zDsKiFyS5RaZLabZ5GEjJYb4Rcp6d5eby/s1600/macbook+laptop+frame-esobondhu.png) 50 233 112 228 stretch stretch;-o-border-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIIk3JFjmIxmkp3X6NW7FBj5AGeQecfxyyvNw8oxm7ixdbA23kQIgJ2dDAiTyWw7iixJ09nEoSVJum29s7FQxAXE0DcMcl7KGip0-cvrprb2_zDsKiFyS5RaZLabZ5GEjJYb4Rcp6d5eby/s1600/macbook+laptop+frame-esobondhu.png) 50 233 112 228 stretch stretch;border-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIIk3JFjmIxmkp3X6NW7FBj5AGeQecfxyyvNw8oxm7ixdbA23kQIgJ2dDAiTyWw7iixJ09nEoSVJum29s7FQxAXE0DcMcl7KGip0-cvrprb2_zDsKiFyS5RaZLabZ5GEjJYb4Rcp6d5eby/s1600/macbook+laptop+frame-esobondhu.png) 50 233 112 228 stretch stretch;border-color:transparent;border-width:27px 76px 55px;border-style:inset}.tb_video_wrap_macbook embed,.tb_video_wrap_macbook iframe,.tb_video_wrap_macbook object{position:absolute;top:0;width:100%;height:100%;background-color:#ddd}@media (max-width:500px){.tb_video_wrap_macbook{border-width:20px 62px 40px}@media all and (max-width:400px){.tb_video_wrap_macbook{border:none!important}}} 

Step 2: Then when you create a new post, use the code below caller on the post HTML Tab.

 <div class="tb_outer_wrap">
 <div class="tb_video_wrap_macbook">
<iframe width="560" height="315" src="https://www.youtube.com/embed/4QnFq4FVB0?rel=0&amp;theme=dark&amp;controls=1&amp;showinfo=0&amp;autohide=0" frameborder="0" allowfullscreen=""></iframe> </div> </div> 

Step 3: Customize your YouTube links like as following highlight link. Replace your link 4QnFq4FVB0 

https://www.youtube.com/embed/4QnFq4FVB0s

Note: If you find any problems please contact with us in our contact page. Don't forget to share and comment this post. Keep Enjoy.

Demo Click here

Categories: Blogspot CSS Google HTML Widget Youtube

Read More