Cara membuat tombol share dibawah judul atau di akhir postingan Style 4 | Raden Ireng
» » Cara membuat tombol share dibawah judul atau di akhir postingan Style 4
Saturday, February 25, 2017

Cara membuat tombol share dibawah judul atau di akhir postingan Style 4

 

Nah untuk style yang ke-4 seperti ini:
cara memasang tombol social share button di blogger dengan mudah 5.JPG ​
Cara pemasangan:
  1. Pertama, silahkan pergi ke dashboard blog Blogger Anda
  2. Setelah itu, masuk ke menu Template--> Edit HTML
  3. Tekan tombol CTRL+F (tombol yang berfungsi untuk mencari kata/kode) secara bersamaan di keyboard, kemudian cari kode <head>
  4. Jika sudah, copy-paste script dibawah ini tepat dibawah kode <head>
    Code:
    <link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css' rel='stylesheet'/>
  5. Kemudian cari kode <data:post.body/>
  6. Jika sudah, copy-paste script dibawah ini tepat diatas kode <data:post.body/> jika Anda ingin tombol social share muncul dibawah judul, dan pasang script dibawah ini tepat dibawah kode <data:post.body/> jika Anda ingin tombol share muncul di akhir artikel. 
    Code:
    <div id='share-button'> <p>Bagikan artikel ke: </p> <a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:blog.url' rel='nofollow' style='background:#3b5998;'>Facebook</a> <a expr:href='&quot;http://plus.google.com/share?url=&quot; + data:blog.url' rel='nofollow' style='background:#c0361a;'>Google+</a> <a expr:href='&quot;https://twitter.com/intent/tweet?url=&quot; + data:blog.url + &quot;&amp;text=&quot; + data:post.title + &quot;&amp;lang=id&quot;' rel='nofollow' style='background:#4099ff;'>Twitter</a> <script> //<![CDATA[ var uri = window.location.href; var ttle = document.title; document.write("<a href='http://www.lintas.me/?c=bookmarklet&url="+uri+"&title="+ttle+"' rel='nofollow' style='background:#FF9900;'>Lintaskan</a>"); //]]> </script> <div class='clear'/> </div> 
<style>
#share-button{margin:10px 0;padding:5px;border: 1px solid #eee;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{position:relative;float:left;box-shadow:1px 1px 5px rgba(1,1,1,.1);border-radius:1px 1px;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:0px 0px 3px rgba(1,1,1,.1)} 
</style>
  7. Kemudian klik tombol Simpan template
  8. Tada! Kini tombol social share flat design sudah terpasang di blog Anda.

Selanjutnya mari kita lihat style yang ke-5, silahkan klik di sini.

1 Response to "Cara membuat tombol share dibawah judul atau di akhir postingan Style 4"

Subscribe to: Post Comments (Atom)