Cara Download Cara Membuat Menu Social Button Melayang Update Terbaru

Sedikit Info Seputar Cara Membuat Menu Social Button Melayang Terbaru 2017 - Hay gaes kali ini team Sniffing Blog, kali ini akan membahas artikel dengan judul Cara Membuat Menu Social Button Melayang , kami selaku Team Sniffing Blog telah mempersiapkan artikel ini untuk sobat sobat yang menyukai Sniffing Blog. semoga isi postingan tentang Artikel menu, yang saya posting kali ini dapat dipahami dengan mudah serta memberi manfa'at bagi kalian semua, walaupun tidak sempurna setidaknya artikel kami memberi sedikit informasi kepada kalian semua. ok langsung simak aja sob
Judul: Berbagi Info Seputar Cara Membuat Menu Social Button Melayang Terbaru
link: Cara Membuat Menu Social Button Melayang

Berbagi Artikel Tentang Cara Membuat Menu Social Button Melayang Terbaru dan Terlengkap 2017

Tutorial Belajar Blog | Tips Blog - Cara Membuat Social Button Melayang ,Tutorial Ini Terinspirasi dari Blogmates om-dayz, Sekedar Berbagi Informasi karena ada teman yang bertanya bagaimana membuat social Button di sebelah kanan pada blog! 

Langsung masuk aja ke tutorial cara membuat social button Melayang, 

• Buka Template > Edit HTML > Expan Template Widget
• Cari kode ]]></:bskin>
• Lalu Paste kan kode di bawah tepat di atas kode ]]></b:skin>

/* social button http://tutorialbelajarblogger.blogspot.com*/
.staticbar {position: fixed;right: 0;top: 35%;width: 25px;animation:static-bar .8s;-moz-animation:static-bar .8s; -webkit-animation:static-bar .8s;}
.staticbar:hover {z-index: 1000;}
.rt-social-buttons a, .loginbtn {background: none repeat scroll 0 0 rgb(34, 34, 34);background-repeat: no-repeat;display: block;height: 20px;margin-bottom: 3px;padding: 4px 0 4px 4px;right: 0px;width: 140px;position: relative;-moz-border-radius: 3px 0px 0px 3px;-webkit-border-radius: 3px 0px 0px 3px;-khtml-border-radius: 3px 0px 0px 3px;border-radius: 3px 0px 0px 3px;background-position: 4px 4px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;border:1px solid rgb(51, 51, 51)}
.rt-social-buttons span, .loginbtn span {background-repeat: no-repeat;color: #FFFFFF;display: block;font-size: 10px;height: 18px;letter-spacing: -1px;line-height: 1.9em;padding-left: 10px;text-transform: uppercase;text-shadow:0px 1px 1px rgba(0, 0, 0, 0.2);}
.rt-social-buttons a:hover, .loginbtn:hover {background: none repeat scroll 0 0 rgb(150, 0, 0);border:1px solid rgb(70, 0, 0);
right: 119px;}
.rt-social-buttons a#rt-buzz-btn span {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKv8Wc-ejd0VqZ5cXZKE6NW89dOcuPi8Qt8aCnnEkAJRp2ZofzqBQmaLNHq134yvr4faQFlv5gqbBy2a13ddP9YOQAm1YVYVMC395dO3XJxdWHdjEs91YeHS7FeDeB69XoaeSsAJ0y2WY/s1600/socialsprite.png);background-position:-2px -68px;}
.rt-social-buttons a#rt-twitter-btn span {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKv8Wc-ejd0VqZ5cXZKE6NW89dOcuPi8Qt8aCnnEkAJRp2ZofzqBQmaLNHq134yvr4faQFlv5gqbBy2a13ddP9YOQAm1YVYVMC395dO3XJxdWHdjEs91YeHS7FeDeB69XoaeSsAJ0y2WY/s1600/socialsprite.png);background-position:-2px -24px;}
.rt-social-buttons a#rt-facebook-btn span {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKv8Wc-ejd0VqZ5cXZKE6NW89dOcuPi8Qt8aCnnEkAJRp2ZofzqBQmaLNHq134yvr4faQFlv5gqbBy2a13ddP9YOQAm1YVYVMC395dO3XJxdWHdjEs91YeHS7FeDeB69XoaeSsAJ0y2WY/s1600/socialsprite.png);background-position:-2px -46px;}
.rt-social-buttons a#rt-rss-btn span {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKv8Wc-ejd0VqZ5cXZKE6NW89dOcuPi8Qt8aCnnEkAJRp2ZofzqBQmaLNHq134yvr4faQFlv5gqbBy2a13ddP9YOQAm1YVYVMC395dO3XJxdWHdjEs91YeHS7FeDeB69XoaeSsAJ0y2WY/s1600/socialsprite.png);background-position:-2px -89px;}
a.loginbtn span {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKv8Wc-ejd0VqZ5cXZKE6NW89dOcuPi8Qt8aCnnEkAJRp2ZofzqBQmaLNHq134yvr4faQFlv5gqbBy2a13ddP9YOQAm1YVYVMC395dO3XJxdWHdjEs91YeHS7FeDeB69XoaeSsAJ0y2WY/s1600/socialsprite.png);background-position:-2px 0px;}
@keyframes static-bar{0%   {right:-25px;} 100%   {right:0px;}}
@-moz-keyframes static-bar{0%   {right:-25px;} 100%   {right:0px;}}
@-webkit-keyframes static-bar{0%   {right:-25px;} 100%   {right:0px;}}

Langkah terakhir, pasang Script dibawah ini diatas tag </body>

<div class='staticbar'>
<div class='login'>
<div id='rt-login-button'>
<a class='loginbtn buttontext' href='http://blogger.com' rel='nofollow' target='_blank' title='Login Blogger'>
<span class='desc'>Blogger Login</span></a>
</div>
<div class='rt-social-buttons'>
<a class='lightbox' data-options='{&quot;width&quot;:420, &quot;height&quot;:405, &quot;iframe&quot;: true}' href='http://tutorialbelajarblogger.blogspot.com' id='rt-twitter-btn' rel='nofollow' title='Twitter Belajar Blog'>
<span>Follow Me On Twitter</span></a>
<a class='lightbox' data-options='{&quot;width&quot;:300, &quot;height&quot;:430, &quot;iframe&quot;: true}' href='http://tutorialbelajarblogger.blogspot.com' id='rt-facebook-btn' rel='nofollow' title='FacebookTutorial Blog'>
<span> Facebook Fanspage</span></a>
<a href='http://tutorialbelajarblogger.blogspot.com' id='rt-buzz-btn' rel='nofollow' target='_blank' title='Google Plus Tutorial Blog'>
<span>Circle Me On Google Plus</span></a>
<a href='http://tutorialbelajarblogger.blogspot.com' id='rt-rss-btn' rel='nofollow' target='_blank' title='RSS Belajar Blog'>
<span>Subscribe to RSS Feed</span></a>
</div></div></div>

Untuk demo Social Button Melayang  anda bisa melihat langsung di blog Demo, ataupun Blog ini selamat mengoprek :)) Terima Kasih Om-Dayz

Itulah sedikit Artikel Cara Membuat Menu Social Button Melayang terbaru dari kami

Semoga artikel Cara Membuat Menu Social Button Melayang yang saya posting kali ini, bisa memberi informasi untuk anda semua yang menyukai Sniffing Blog. jangan lupa baca juga artikel-artikel lain dari kami.

Terima kasih Anda baru saja membaca Artikel Tentang Cara Membuat Menu Social Button Melayang Terbaru