» » Membuat Share Button Sosial Media Tanpa Javascript

Membuat Share Button Sosial Media Tanpa Javascript - Hembs setelah lama saya tidak update karena kemaren sibuk buanget ( ada MID semester ) kali ini setelah semesteran dan liburan saya akan membagikan kepada sahabat blogger tentang bagaimana membuat tombol share buton sosial media yang keren tanpa javascript , karena kebanyakan tombol share menggunakan javascript al-hasil blog loadingnya menjadi agak lambat karena adanya javascript tadi :)

Membuat Share Button Sosial Media Tanpa Javascript

Berikut Cara Membuat  Share Button Sosial Media Tanpa Javascript

1. Pertama sobat Simpan kode CSS di bawah ini tepat di atas kode ]]></b:skin> atau </style>
#share-button{overflow:hidden}
#share-button p{float:left;display:block;padding:5px 8px!important;margin:0 3px 3px 0;border-radius:6px 6px;border:1px solid #fff}
#share-button a{float:left;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)}

2 Langkah Kedua sobat Copy kode di bawah ini dan letakkan di bawah kode <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='share-button' style='margin-top:8px;'>
<p><span style='font-size:17px;font-weight: bold;'>Suka artikel ini? bagikan</span></p><a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:blog.url' onclick='window.open(this.href,&quot;popupwindow&quot;,&quot;status=0,height=500,width=500,resizable=0,top=50,left=100&quot;);return false;' rel='nofollow' style='background:#3b5998;' target='_blank' title='Facebook'>Facebook</a><a expr:href='&quot;https://plus.google.com/share?url=&quot; + data:blog.url' onclick='window.open(this.href,&quot;popupwindow&quot;,&quot;status=0,height=500,width=500,resizable=0,top=50,left=100&quot;);return false;' rel='nofollow' style='background:#c0361a;' target='_blank' title='Google+'>Google+</a>
<a expr:href='&quot;http://www.blogger.com/share-post.g?blogID=&quot; + data:blog.blogId + &quot;&amp;amp;postID=&quot;+ data:post.id + &quot;&amp;amp;target=twitter&quot;' onclick='window.open(this.href,&quot;popupwindow&quot;,&quot;status=0,height=500,width=500,resizable=0,top=50,left=100&quot;);return false;' rel='nofollow' style='background:#4099ff;' target='_blank' title='Twitter'>Twitter</a></div>
</b:if>

3. Langkah yang terakhir simpan template dan lihat hasilnya

Membuat Share Button Sosial Media Tanpa Javascript

Demikian dari saya tutorial tentang Membuat Share Button Sosial Media Tanpa Javascript semoga cara tersebut bermanfaat bagi anda , bila ada  kendala atau request sesuatu silahkan komentar dibawah :)

About Redi

Hi there! I am Hung Duy and I am a true enthusiast in the areas of SEO and web design. In my personal life I spend time on photography, mountain climbing, snorkeling and dirt bike riding.
«
Next
Newer Post
»
Previous
Older Post

No comments:

Leave a Reply