bMLX7JBx7U3xHqbAzpXkrkGFL8v952MVfhKrexc8

Cara Membuat Tombol Subscribe Youtube Keren di Blog

Dunia Tonang - Cara Membuat Tombol Subscribe Youtube Keren di Blog
Cara Membuat Tombol Subscribe Youtube Keren di Blog

Yo Maiplen, hari ini aku mau berbagi tips Cara Membuat Tombol Subscribe Keren di Bawah Postingan dan Tombol Subscribe di Footer Blog. Sebagai seorang Youtuber Pemula, aku harus mempromosikan channel ku ke orang lain. Untuk memperoleh viewers youtube, maka tips jitu nya kita harus promosikan channel youtube ke orang lain dengan kata lain memberitahukan orang lain tentang kita di youtube. Bisa dengan menyuruh teman sekeliling atau keluarga kita untuk berlangganan atau SUBSCRIBE channel kita, atau share link ke sosial media seperti facebook, instagram, yahoo, bahkan di blog kita sendiri. Agar tampilan lebih menarik kita bisa pakai cara dibawah ini ;

1. Cara Membuat Tombol Subscribe Youtube Memantul (Bounce) di Bawah Postingan Blog

Dunia Tonang - Cara Membuat Tombol Subscribe Youtube Memantul (Bounce) di Bawah Postingan Blog
Tombol Subscribe YouTube di bawah Artikel
Bounce maksudnya tombol subscribe nya akan memantul-mantul sehingga kelihatan menarik untuk di klik dan menjadi nilai plus untuk tampilan blog kita.
Buka Tema, lalu edit HTML, lalu simpan kode CSS dibawah ini, diatas kode </style> atau ]]></b:skin>.
/* Dunia Tonang SUBSCRIBE Bounce Button */
.DuniaTonangSUBSButton {background:#eef3f6; /* warna background */
  color:#000;
  display:-webkit-box; display:-webkit-flex; display:-moz-box; display:-ms-flexbox; display:flex; align-items:flex-start; flex-wrap:nowrap; justify-content:center; margin:20px 0px; display:flex; padding:15px; overflow:hidden; transition:all .3s ease; border-radius:7px;}
.DuniaTonangSUBSButton .ikon a {background-color:#fc2828; /* warna ikon */
  color:#fff;
  text-decoration:none; display:block; padding:5px; border-radius:7px; text-align:center; -webkit-animation:ignielBounce 1s linear 1s infinite normal; animation:ignielBounce 1s linear 1s infinite normal}
.DuniaTonangSUBSButton svg {width:50px; height:50px}
.DuniaTonangSUBSButton svg path {fill:#bde0b9}
.DuniaTonangSUBSButton .ikon {margin-right:15px}
.DuniaTonangSUBSButton .deskripsi {line-height:1.5em;} 
.DuniaTonangSUBSButton .deskripsi .judul {font-size:18px; font-weight:bold; display:block; margin-bottom:10px;}

@keyframes ignielBounce{0%,100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}
40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}
50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}
65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}
75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}
}
@-webkit-keyframes ignielBounce{0%,100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}
40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}
50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}
65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}
75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}
}
Silahkan ganti kode warna yang aku tandai orange sesuai keinginan kalian.
Lalu simpan kode HTML dibawah ini setelah kode <data:post.body/>
<!-- SUBSCRIBE Bounce by Dunia Tonang -->
<div class='DuniaTonangSUBSButton'>
  <div class='ikon'>
    <a href='https://www.youtube.com/channel/UCtZf7d1BJArkIlDxKgz8cpw' onclick='window.open(this.href,&quot;toolbar=0,status=0,width=800,height=600&quot;);return false;' title='Please SUBSCRIBE My Youtube Channel'>
      <svg viewbox='0 0 24 24'><path d='M12,21.35L10.55,20.03C5.4,15.36 2,12.27 2,8.5C2,5.41 4.42,3 7.5,3C9.24,3 10.91,3.81 12,5.08C13.09,3.81 14.76,3 16.5,3C19.58,3 22,5.41 22,8.5C22,12.27 18.6,15.36 13.45,20.03L12,21.35Z'/></svg>
      <span>SUBSCRIBE</span>
    </a>
  </div>
  <div class='deskripsi'>
    <span class='judul'>SUBSCRIBE My Youtube Channel</span>
    Please Subscribe My Youtube Channel: <b>Tonang RGG</b> and Share This Articel With Your Friend, Thanks From <b><i>tonangrgg.blogspot.com</i></b>.
  </div>
</div>
Silahkan ganti yang aku tandai warna hijau dengan link channel kalian dan yang warna kuning ganti sesuai kalimat yang kalian inginkan.

2. Membuat Tombol Subscribe Youtube di Footer Blog

Dunia Tonang - Membuat Tombol Subscribe Youtube di Footer Blog
Tombol Subscribe di Footer Blog

Cara kedua ini sangat cocok dipasang di footer blog supaya kelihatan elegan dan menarik saat di scroll.
Copy kode dibawah ini dan save sebelum / diatas kode </style> atau ]]></b:skin>.
.TonangRGGSubsFull {
  margin: 0px;
  padding: 0px;
  line-height: 21px;
}
.TonangRGGSubsFull_img {
  float: left;
  margin-right: 7px;
}
.TonangRGGSubsFull_img img {
  width: 55px;
  height: 55px;
}
.TonangRGGSubsFull_name, a.TonangRGGSubsFull_name {
  color: #555;
  text-align: left;
  line-height: 16px;
}
.TonangRGGSubsFull_button {
  background-color: #ff0c00;
  color: #ffffff;
  font-weight: 400;
  font-size: 16px;
  padding: 3px 7px;
  display: table;
  border-radius: 3px;
  -moz-border-radius: 3px;
  box-shadow: 0 1px 0 rgba(0,0,0,0.05);
  outline: 0;
  margin-top: 8px;
  line-height: 0px;
}
.TonangRGGSubsFull svg {
  width:24px;
  height:24px;
  vertical-align: -6px;
  margin-right: 3px;
}
.TonangRGGSubsFull svg path {
  fill: #fff;
}
Dan copy kode dibawah ini lalu tambahkan widget dibagian footer lalu save.
<a href='https://www.youtube.com/channel/UCtZf7d1BJArkIlDxKgz8cpw/?sub_confirmation=1' title='Tonang RGG YouTube Channel' target='_blank'>
  <div class='TonangRGGSubsFull'>
    <div class='TonangRGGSubsFull_img'><img src='https://1.bp.blogspot.com/-8ZLe8nrlrhw/Xg5-r6vLELI/AAAAAAAAAMc/oqnbKWNAqM8mPoEGYecLV-erd51AJbzeACPcBGAYYCw/s1600/Dunia%2BTonang%2B-%2BAritonang%2BMarga%2BKu%2BBang%2BTonang%2BRGG.jpg' title='Dunia Tonang | Aritonang Marga Ku' alt='Tonang RGG Blogger dan Vlogger Batak YouTube Gaming'/>
    </div>
    <span class='TonangRGGSubsFull_name'>Tonang RGG</span>
    <div class='TonangRGGSubsFull_button'>
      <svg viewbox='0 0 24 24'> <path d='M10,15L15.19,12L10,9V15M21.56,7.17C21.69,7.64 21.78,8.27 21.84,9.07C21.91,9.87 21.94,10.56 21.94,11.16L22,12C22,14.19 21.84,15.8 21.56,16.83C21.31,17.73 20.73,18.31 19.83,18.56C19.36,18.69 18.5,18.78 17.18,18.84C15.88,18.91 14.69,18.94 13.59,18.94L12,19C7.81,19 5.2,18.84 4.17,18.56C3.27,18.31 2.69,17.73 2.44,16.83C2.31,16.36 2.22,15.73 2.16,14.93C2.09,14.13 2.06,13.44 2.06,12.84L2,12C2,9.81 2.16,8.2 2.44,7.17C2.69,6.27 3.27,5.69 4.17,5.44C4.64,5.31 5.5,5.22 6.82,5.16C8.12,5.09 9.31,5.06 10.41,5.06L12,5C16.19,5 18.8,5.16 19.83,5.44C20.73,5.69 21.31,6.27 21.56,7.17Z'/></path></svg>SUBSCRIBE
    </div>
  </div>
</a>
Yang aku warnai, kalian ganti sesuai keinginan kalian ya maiplen.

3. Membuat Tombol Subscribe Youtube Ada Jumlah Subscriber nya di Blog

Dunia Tonang - Membuat Tombol Subscribe Youtube Ada Jumlah Subscriber nya di Blog
Tombol Subscribe YouTube Ada Jumlah Subscriber Nya

Nah cara yang terakhir ini cukup simpel dan mudah maiplen.
Kalian harus mengunjungi halaman Google Developers atau copy link dibawah dan paste di tab baru:
https://developers.google.com/youtube/youtube_subscribe_button

Dunia Tonang - Membuat Tombol Subscribe Youtube di Blog
Membuat Tombol Subscribe Ada Jumlah Subscriber Nya

Keterangan:
  • Channel Name or ID :
    Kalian isi bagian ini dengan id channel youtube kalian.
  • Layout :
    Default = Hanya menampilkan tombol SUBSCRIBE
    Full = Menampilan tombol SUBSSCRIBE, foto, dan nama channel youtube kalian
  • Theme :
    Default = Warna background putih
    Dark = Warna background abu-abu tua
  • Subscriber Count :
    Default =  Jumlah subscribe akan ditampilkan
    Hidden = Jumlah subscribe tidak ditampilkan
Atau kalian bisa copy link dibawah dan yang aku tandai hijau kalian ganti dengan link id channel kalian.
<script src="https://apis.google.com/js/platform.js"></script>
<div class="g-ytsubscribe" data-channelid="UCtZf7d1BJArkIlDxKgz8cpw" data-layout="full" data-count="default"></div>
Lalu ke tata letak, tambahkan gadget, HTML/JavaScript, lalu paste script diatas dan save.

Sekian lah maiplen Cara Membuat Tombol Subscribe Youtube yang Keren di Blog, semoga membantu untuk menghiasi blog kalian. Pribadi aku hanya menggunakan tutorial yang pertama dan kedua nya saja, yang ketiga juga keren karena ada jumlah subscriber channel youtube kalian.
Terima kasih sudah berkunjung. Jangan lupa share ke teman kalian ya maiplen.
Sumber: Igniel

SUBSCRIBE Please Subscribe My Youtube Channel: Tonang RGG and Share This Articel With Your Friend, Thanks From TONANGRGG.ID.
Related Posts
Bang Tonang
Horas Maiplen :) Terima Kasih sudah berkunjung, jangan lupa berikan saran terbaik kalian di kolom komentar ya :)

Related Posts

Post a Comment