Cara Memasang Tombol Share Media Sosial pada Blog - Halo Sobat NapaRom, Pada Artikel yang sobat baca kali ini dengan judul Cara Memasang Tombol Share Media Sosial pada Blog, khusus untuk sobat pembaca sedia blog NapaRom. mudah-mudahan isi artikel atau postingan Artikel Blogging, yang saya tulis ini dapat sobat pahami. baiklah, selamat membaca.
Judul : Cara Memasang Tombol Share Media Sosial pada Blog
link : Cara Memasang Tombol Share Media Sosial pada Blog
Cara Memasang Tombol Share Media Sosial pada Blog
Cara Memasang Tombol Share Media Sosial pada Blog beserta Whatsapp - Kali ini admin akan menggabungkan cara memasang share tombol Media Sosial Facebook, Twitter, Google Plus, dan WhatsApp di bawah Tulisan Blog. Kelebihan yang satu ini tanpa Javascript. Karena berbagi tombol tanpa Javascript, itu menjadi ringan, pemuatan menjadi cepat. Bagaimana cara memeriksa apakah berfungsi di ponsel Anda, bukan di desktop.
- Tema > Edit HTML
- Copy dan paste kode dibawah berikut ini di atas kode ]]></b:skin>
#share-button {margin:0 0 8px;padding:0;overflow:hidden}
#share-button p {float:left;box-shadow:1px 1px 5px rgba(1,1,1,.1);background:#fafafa;display:block;padding:5px 8px!important;margin:0 3px 3px 0;border-radius:6px 6px;border:1px solid #fff;font-weight: 700;}
#share-button a {position:relative;float:left;box-shadow:1px 1px 5px rgba(1,1,1,.1);border-radius:6px 6px;display:block;color:#fafafa;padding:5px 8px;margin:0 3px 3px;border:1px solid #fff}
#share-button a:hover{top:1px;left:1px;box-shadow:0 0 3px rgba(1,1,1,.1)}
.wa-button{color:#fff;margin:0 auto;padding:0;font-size:14px;font-weight:700}
.wa-button a{color:#222;margin:0 auto;padding:10px 8px;background:#222}
.wa-button i{font-weight:400;margin:0 10px 0 0}
- Copy dan paste kode berikut dibawah kode <data:post.body/> yang kedua atau ketiga, atau di atas kode <div class='post-footer'>
<div id='share-button' style='margin-top:8px;'>
<p>Share: </p>
<a expr:href='"http://www.facebook.com/sharer.php?u=" + data:blog.url' onclick='window.open(this.href,"popupwindow","status=0,height=500,width=500,resizable=0,top=50,left=100");return false;' rel='nofollow' style='background:#3b5998;' target='_blank' title='Facebook'>Facebook</a><a expr:href='"https://plus.google.com/share?url=" + data:blog.url' onclick='window.open(this.href,"popupwindow","status=0,height=500,width=500,resizable=0,top=50,left=100");return false;' rel='nofollow' style='background:#c0361a;' target='_blank' title='Google+'>Google+</a><a expr:href='"https://twitter.com/intent/tweet?url=" + data:blog.url + "&text=" + data:post.title + "&lang=id"' onclick='window.open(this.href,"popupwindow","status=0,height=500,width=500,resizable=0,top=50,left=100");return false;' rel='nofollow' style='background:#4099ff;' target='_blank' title='Twitter'>Twitter</a>
<a data-action='share/whatsapp/share' style='background:#43d854' expr:href='"whatsapp://send?text=" + data:post.title + "%20%2D%20" + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/> WhatsApp</a>
</div>
- Copy dan paste link ke font awesome berikut ini di atas kode </head>. Abaikan jika sudah ada di template blog Anda.
Demikian Cara Memasang Tombol Share Media Sosial pada Blog di bawah postingan blog, sehingga ringan dan loading blog anda semakin cepat. Terima kasih
<link href='//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>
Sekian Artikel Cara Memasang Tombol Share Media Sosial pada Blog
Sampailah kita pada akhir artikel Cara Memasang Tombol Share Media Sosial pada Blog kali ini, mudah-mudahan bisa memberi manfaat untuk sobat semua. baiklah, sampai jumpa di postingan artikel lainnya.
sobat sekarang membaca artikel Cara Memasang Tombol Share Media Sosial pada Blog dengan alamat link https://naparom.blogspot.com/2018/06/cara-memasang-tombol-share-media-sosial.html
EmoticonEmoticon