Cara Membuat Tombol Sosial Media Keren Terbaru

Jadilah Umat Terbaik Dengan Saling Menasehati
Google+
Dengan memasang widget social media ini banyak manfaat untuk blog kita, seperti halnya dengan widget tersebut pengunjung blog kita dapat mengikuti melalui situs sosial media yang sobat pasang diblog sobat, sehingga para pembaca blog sobat dapat melihat artikel ter-update yang sobat posting. Nah.. Bila sobat tertarik untuk mencoba memasangnya diblog sobat, yuk kita simak caranya dibawah :

Cara memasang Widget Tombol social media blogger

  • Pertama login dulu dengan akun blogger sobat.
  • Kemudian Masuk Dashboard >> Tata Letak >> Tambahkan Gadget >> HTML/javaScript (Lihat gambar)
Cara memasang Widget Tombol social media blogger
memasang widget HTML/Javascript
  • Kemudian Copy script dibawah ini dan Letakkan di HTML/JavaScript tersebut.

<style>
.socialLinks{text-align:center;margin:50px 0 0}.socialLinks a{display:inline-block;margin:0 .5em;-webkit-transition-property:all !important;-moz-transition-property:all !important;-o-transition-property:all;transition-property:all !important;-webkit-transition-duration:.2s;-moz-transition-duration:.2s;-o-transition-duration:.2s;transition-duration:.2s;-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;border:2px solid #8fb73e}.socialLinks a:hover{-webkit-border-radius:40px;-moz-border-radius:40px;-ms-border-radius:40px;-o-border-radius:40px;border-radius:40px}.socialLinks span{display:none}.fTwitter{background-image:url(https://googledrive.com/host/0B3m2F2L71gmGRHJYLUVwZ01jbms/);background-position:0 -655px;background-repeat:no-repeat;height:62px;width:62px}.fFacebook{background-image:url(https://googledrive.com/host/0B3m2F2L71gmGRHJYLUVwZ01jbms/);background-position:1px -1083px;background-repeat:no-repeat;height:62px;width:62px}.fFacebook:hover{background-color:#369;border-color:#fff;background-position:1px -1141px}.fTwitter:hover{background-color:#28aae1;border-color:#fff;background-position:0 -718px}.fInstagram:hover{background-color:#517fa4;border-color:#fff;background-position:0 -597px}.fPintrest:hover{background-color:#cc2127;border-color:#fff;background-position:0 -285px}.fLinkedIn:hover{background-color:#007fb1;border-color:#fff;background-position:0 -860px}.fDribbble:hover{background-color:#ea4c89;border-color:#fff;background-position:0 -52px}.fGoogle:hover{background-color:#e46044;border-color:#fff;background-position:0 -395px}.fInstagram{background-image:url(https://googledrive.com/host/0B3m2F2L71gmGRHJYLUVwZ01jbms/);background-position:0 -527px;background-repeat:no-repeat;height:62px;width:62px}.fPintrest{background-image:url(https://googledrive.com/host/0B3m2F2L71gmGRHJYLUVwZ01jbms/);background-position:0 -226px;background-repeat:no-repeat;height:62px;width:62px}.fLinkedIn{background-image:url(https://googledrive.com/host/0B3m2F2L71gmGRHJYLUVwZ01jbms/);background-position:0 -790px;background-repeat:no-repeat;height:62px;width:62px}.fDribbble{background-image:url(https://googledrive.com/host/0B3m2F2L71gmGRHJYLUVwZ01jbms/);background-position:0 11px;background-repeat:no-repeat;height:62px;width:62px}.fGoogle{background-image:url(https://googledrive.com/host/0B8D3MQmcZTyvQTVQZEFKeTYtc3M/);background-position:0 -343px;background-repeat:no-repeat;height:62px;width:62px}
</style>
<div class="socialLinks">
<a href="https://facebook.com/URL-FACEBOOK" class="fFacebook transition"><span>Facebook</span></a>
<a href="https://twitter.com/URL-TWITTER" class="fTwitter transition"><span>Twitter</span></a>
<a href="http://instagram.com/URL-INSTAGRAM" class="fInstagram transition"><span>Instagram</span></a>
<a href="http://pinterest.com/URL-PINTEREST" class="fPintrest transition"><span>Pinterest</span></a>
<a href="http://www.linkedin.com/in/URL-LINKEDIN" class="fLinkedIn transition"><span>LinkedIn</span></a>
<a href="http://dribbble.com/URL-DRIBBBLE" class="fDribbble transition"><span>Dribbble</span></a>
<a href="https://plus.google.com/URL-G+" class="fGoogle transition"><span>G+</span></a>
    </div>

Note : Ganti yang saya tandai warna biru sesuai dengan link Url social media sobat.

  • Selanjutnya Klik Simpan.

Demikian saja postingan Tombol sharing sosial media keren untuk blogger Terbaru, Semoga dapat membantu dan bermanfaat buat sobat Googeling. Bila ada yang mau ditanyakan atau sekedar mau kasih sarannya, silahkan tinggalkan komentar dibawah. Terimakasih.


Sumber : berbagi