Bagi kalian yang suka dengan tema-tema blog minimalis dan fast loading serta seo
pasti ketahui yang namanya Blogbamz ,
yups blog yang beralamatkan www.blogbamz.com ini diketahui dengan template -
templatenya yang benar-benar pantas
sekali untuk bermain adsense, sebab desain templatenya hal yang demikian
meletakan space iklan adsense yang lokasinya gampang diamati oleh pengunjung
sehingga menjadikan template yang high ctr dan klik valid yang tinggi.
Terdapat tema-tema blog yang di jual oleh admin dari blog template yang digunakanya pun juga tidak kalah
keren dan unik dengan template premiumnya. Salah satu komponen yang saya
menyukai dengan template blogbamz tersebuat
yaitu pada komponen share button nya, Sebab widget tombol sosial media
nya {hal yang demikian} belum pernah ada yang menggunakannya selain mas selain
itu juga widgetnya ringan banget tanpa memakai javascript , serta enak di
pandang.
Seperti apakah demo dari tombol share dibawah postingan
seperti blogbamz ? sobat dapat memperhatikan demonya secara seketika di blognya
mas bamz sendiri, atau dapat memperhatika gambar dibawah ini.
Cara Membuat Tombol Share di Blog Tanpa Javascript
Langsung teristimewa dari widget share button ini ialah
pembuatanya tanpa disertai dengan javascript, seperti yang kita kenal bahwa
javascipt ialah salah satu pemicu blog anda menjadi lamban ketika diakases,
apalagi javasciptnya tak di syncron khususnya dulu. Setelah itu langsung
saja saja tanpa basa-basi berikut
panduan membuat tombol share dibawah postingan blog :
1. Seperti umumnya anda mesti login dahulu ke akun dasbhor
blog akan , sesudah itu masuk ke komponen template > Edit html
2. Setalah masuk ke halama editor template copy dan pastekan
kode dibawah ini {pas|ideal} diatas kode </style>
.article-share-masyadi{width:100%;height:43px;margin-bottom:10px}
.article-share-fb-cont,.article-share-other-cont{float:left;width:138px;width:114px;padding:0
7px;height:inherit}
.article-share-tw-cont,.article-share-other-cont,.article-share-like-cont{float:left;width:114px;height:inherit;padding:0
7px;border-left:solid 1px #d8d8d8}
.article-share-fb-cont,.article-share-other-cont{float:left;width:138px;width:114px;padding:0
7px;height:inherit}
.article-share-fb,.article-share-tw,.article-share-gp,.article-share-li,.article-share-pi{float:left;display:block;background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR_Ox0VsBa2h24vO0fWqWGmxoeZcAWbOem4OxBpoIwCPGFM37uu9wnH1ve9YVnO6ngpsRkoAW2YnrP5LP3Ni04Q6ScdehmsoU7jk5RW1drnDXR9oeF2WFbthmPm0Y_adKyFjRwPEXCByQ/s1600/share.png')
no-repeat;width:42px;height:41px;margin-right:3px}
.article-share-fb-label{color:#2d609b}
.article-share-fb-label,.article-share-tw-label,.article-share-gp-label{float:left;width:58px;height:inherit;font-size:12px;font-family:'Open
Sans Bold',Arial,sans-serif;line-height:14px;margin:5px 0 0 4px}
.article-share-tw{background-position:0
-43px}
.article-share-tw-label{color:#00c3f3}
.article-share-gp{background-position:0
-86px}
.article-share-gp-label{color:#f00}
|
3. Selanjutnya anda pasang kode htlmnya supaya css diatas
befungsi, caranya ialah salin dan tempelkan kode dibawah ini diatas kode <data:post.body/> ( umumnya kode hal yang
demikian lebih dari 2 , anda pilih aja yang terakhir atau di coba satu persatu
)
|
4. Langkah yang terkahir klik save dan lihat hasil nya
Labels:
BLOG
Thanks for reading Cara Membuat Tombol Share di Dalam Blog. Please share...!
0 Comment for "Cara Membuat Tombol Share di Dalam Blog"