Cara Membuat Tombol Sosmed keren Dan Ringan Di Blogger
1 Maret 2018
Add Comment
Tentunya Sobat sudah tau dengan yang namanya Sosmed seperti Facebook ,Twitter,Istagram,merupakan asalah satu jaring sosial yang sangat popler di dunia dengan jutaan penguna di seluruh dunia, Bagi sobat seorang blogger tentunya hal yang wajib untuk mempunyai akun media sosial, hal tersebut dikarenakan dapat membantu utuk menjaring pengunjung datang ke blog yang kita klola melalui media sosial ,dengan terhubungnya blog dengan media sosial tentunya akan berdapak baik bagi blog kita, slain dapat mengoptimakan upanya SEO dapat juga meningkatkan halama blog kita di mesin pencarian.
Untuk mempermudah pengunjung mengshare koten atau artikel yang berada di blog,maka sobat harus memasang tombol sehare media sosial di blog yang sobat kelola seperti di bawah artikel atau di atas artikel agar pengunjung dapat leluasa untuk mengshare artikel blog sobat, berikut saya bagikan script share media sosial Facebook,Twitter,Google Plus,Pinterest, Linkedin,Istagram,Whasapp Dan soasial media lainnya yang dapat di pasang di blog sobat .
Tempelkan Script CSS di dalamnya .
2. Masih di Dalam menu eidit Template,Sekarang sobat Cari <data:post.body/> dan tempelkan script HTML di bawahnya. Atau bisa juga dipastekan tepat di atas <div class='post-footer'> Selesai Save atau simpan kembali template.
Code script sudah saya siapkan di bawah silahkan simpan di bagian bagian yang sudah saya jelaskan di atas.
Simpan Script CSS di ]]></b:skin> atau </style>
Simpan Script HTML di <data:post.body/> Atau <div class='post-footer'>
Cara Membuat Tombol Sahare Media sosial atau Sosmed Di Bawah Postingan Artikel
Langkah Pemasangan Tombol Sahare Media Sosial di bawah artikel
1. Pertama sobat masuk pada menu Edit Templat Tekan Ctrl+F Lalu Cari ]]></b:skin> atau </style>Tempelkan Script CSS di dalamnya .
2. Masih di Dalam menu eidit Template,Sekarang sobat Cari <data:post.body/> dan tempelkan script HTML di bawahnya. Atau bisa juga dipastekan tepat di atas <div class='post-footer'> Selesai Save atau simpan kembali template.
Code script sudah saya siapkan di bawah silahkan simpan di bagian bagian yang sudah saya jelaskan di atas.
![]() |
Share media sosial Yang sudah Jadi |
Simpan Script CSS di ]]></b:skin> atau </style>
<!-- Sahare media sosial Zagan19.com -->
#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}
Simpan Script HTML di <data:post.body/> Atau <div class='post-footer'>
<!-- Sahare media sosial Zagan19.com -->
<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>
Untuk menampilkan icon Sosmed Tempelkan Script Berikut tepat di bawah code <head>
<link href='//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>
selesai lalu simpan tempalate sobat dan lihat hasilnya, itulah cara pasang tombol media sosil di bawah postingan semoga bermanpaat .
0 Response to "Cara Membuat Tombol Sosmed keren Dan Ringan Di Blogger"
Posting Komentar