perlu diketahui bahwa saat ini kode untuk menampilkan tombol berbagi ke whatsapp banyak yang tidak konek/tidak bisa di gunakan dan kode share whatsapp(WA) yang akan saya berikan ini insaallah akan berfungsi dengan baik.
Tombol share WA ini akan muncul di dalam postingan mau di tempatkan di atas postingan atau di bawah postingan itu sebenarnya tergantung kita saja , kalau Tombol share wa yang saya bagikan ini sepaket dengan tombol share facebook, twitter,pinteresat,liknkedin , contoh nya seperti gambar di bawah ini
Memang tombol berbagi wa di dalam postingan ini sangat membantu kita sebagai pemilik website juga membantu juga bagi pengunjung situs kita , mereka dengan mudah membagikan informasi/artikel kepada temen-temen yang lagi membutuhkan informasi tersebut.
Cara membuat atau menambahkan tombol share wa fb twitter di dalam postingan blogger
1.Pertama buka web anda lalu login ke dashboar blogger
2.pilih Tema kemudian pilih EDIT HTML
untuk menjaga kesalahan pada halaman html , anda bisa mencadangkanya dengan mengeklik cadangkan dalam pilihan tersebut.
jika terjadi kerusakan html , anda bisa mengembalikan rangkaian kode html template dengan cara mengeklik Pulihkan
3.Kopi kode css di bawah ini dan tempelkan diatas kode ]]></b:skin>
.share{display:block;padding:0;margin:10px 0;}
.post-share,ul.share-links{position:relative;margin:0;padding:0}
.post-share{overflow:hidden;line-height:0;margin:0}.share-links li
a,.share-links li
a:before{float:left;text-align:center;line-height:32px}.share-links
li{width:32px;float:left;box-sizing:border-box;margin:0 5px 0
0;list-style:none}.share-links li.facebook,.share-links
li.gplus,.share-links li.twitter{width:20%}.share-links li
a{display:inline-block;cursor:pointer;width:100%;height:32px;color:#fff;font-weight:400;font-size:13px;box-sizing:border-box;opacity:1;margin:0;padding:0;transition:all
.17s ease}.is-mobile li.whatsapp-desktop,.share-links
li.whatsapp-mobile{display:none}.is-mobile
li.whatsapp-mobile{display:inline-block}.share-links li
a:before{display:block;width:32px;background-color:rgba(255,255,255,.07);font-size:15px}.share-links
li a:hover{opacity:.8}.social
a:before{display:inline-block;font-family:FontAwesome;font-style:normal;font-weight:400}.social
.facebook a:before{content:"\f09a"}.social .twitter
a:before{content:"\f099"}.social .gplus a:before{content:"\f0d5"}.social
.linkedin a:before{content:"\f0e1"}.social .pinterest
a:before{content:"\f0d2"}.social .whatsapp
a:before{content:"\f232"}.social .external-link
a:before{content:"\f35d"}.social-color .facebook
a{background-color:#3b5999}.social-color .twitter
a{background-color:#00acee}.social-color .gplus
a{background-color:#db4a39}.social-color .pinterest
a{background-color:#ca2127}.social-color .linkedin
a{background-color:#0077b5}.social-color .whatsapp
a{background-color:#3fbb50}.social-color .external-link
a{background-color:#111}.social-text .facebook
a:after{content:"Facebook"}.social-text .twitter
a:after{content:"Twitter"}.social-text .gplus a:after{content:"Google
Plus"}.social-text .linkedin a:after{content:"LinkedIn"}.social-text
.pinterest a:after{content:"Pinterest"}.social-text .whatsapp
a:after{content:"Whatsapp"}.social-text .external-link
a:after{content:"WebSite"}@media screen and
(max-width:540px){.share-links li a span{display:none}.share-links
li.facebook,.share-links li.gplus,.share-links li.twitter{width:30px}}
4.Selanjutnya kopi lagi kode yang di bawah ini jika ingin menampilkan tombol share wa facebook twiter dan lainya ini di bawah postingan , tempatkan kode di bawah ini di atas kode Pos/Artikel Terkait atau di bawah kode yang terakir kode <data:post.body/>
<div class='share'>
<div class='post-share'>
<ul class='share-links social social-color'>
<b:class cond='data:blog.isMobileRequest' name='is-mobile'/>
<li class='facebook'><a class='facebook'
expr:href='"https://www.facebook.com/sharer.php?u=" +
data:post.url' onclick='window.open(this.href,
'windowName', 'width=550, height=650,
left=24, top=24, scrollbars, resizable'); return false;'
rel='nofollow'><span>Facebook</span></a></li>
<li class='twitter'><a class='twitter'
expr:href='"https://twitter.com/share?url=" +
data:post.url + "&text=" + data:post.title'
onclick='window.open(this.href, 'windowName',
'width=550, height=450, left=24, top=24, scrollbars,
resizable'); return false;'
rel='nofollow'><span>Twitter</span></a></li>
<li class='pinterest'><a class='pinterest'
expr:href='"https://www.pinterest.com/pin/create/button/?url="
+ data:post.url + "&media=" +
data:post.featuredImage + "&description=" +
data:post.title' onclick='window.open(this.href,
'windowName', 'width=735, height=750,
left=24, top=24, scrollbars, resizable'); return false;'
rel='nofollow'/></li>
<li class='linkedin'><a class='linkedin'
expr:href='"https://www.linkedin.com/shareArticle?url="
+ data:post.url' onclick='window.open(this.href,
'windowName', 'width=950, height=650,
left=24, top=24, scrollbars, resizable'); return false;'
rel='nofollow'/></li>
<li class='whatsapp whatsapp-desktop'><a
class='whatsapp'
expr:href='"https://web.whatsapp.com/send?text=" +
data:post.title + " | " + data:post.url'
onclick='window.open(this.href, 'windowName',
'width=900, height=550, left=24, top=24, scrollbars,
resizable'); return false;' rel='nofollow'/></li>
<li class='whatsapp whatsapp-mobile'><a
class='whatsapp'
expr:href='"https://api.whatsapp.com/send?text=" +
data:post.title + " | " + data:post.url'
rel='nofollow' target='_blank'/></li>
</ul>
</div>
<div class='clear'/>
</div>
5.Terakir simpan perubahan tema anda. dan selesai.
Untuk mencoba tombol share whatsapp silahkan buka postingan web anda menggunakan HP.