Cara Terbaru Membuat Tombol Share Melayang Sticky Pada Template Viomagz Dengan Mudah

==Iklan Dipate Disini===

Lapakinfo.net
Lapakinfo.net - Pada kesempatan kali ini saya akan membagikan tutorial tentang Cara Terbaru Membuat Tombol Share Melayang ( Sticky ) Di Blog Dengan Mudah di template viomagz, seperti yang kalian ketahui keberadaan tombol share sangat penting buat blogger, selain untuk membagikan postingan kita tombol juga mempunya manfaat yang sangat baik buat blog kita seperti bisa menaikan DA dan PA. Dengan adanya tombol share pada blog kita itu bisa mempermudah pengunjung membagikan informasi dari blog kita dengan mudah.

Terinspirasi dari Blog Igniel yang mempunyai tombol share sticky atau fixed saya sendiri akan merombaknya pada template viomagz agar tombol sharenya ikut sticky seperti pada blog igniel, untuk tutorialnya pun sangat mudah hanya sedikit merubah pada bagian CSS saja. Jika kalian ingin membuat tombol share sticky pada template viomagz bisa kalian ikuti langkahnya di bawah ini.

Cara Terbaru Membuat Tombol Share Melayang Sticky Di Blog Dengan Mudah


1. Buka Blog kalian
2. Pilih Tema lalu pilih Edit HTML
3. Cari kode yang mirip dengan kode di bawah ini
#wrapper {
background: #ffffff;
max-width: 1000px;
margin: 0 auto;
padding: 70px 30px 30px;
overflow: hidden;
}

4. Ganti tulisan overflow: hidden; menjadi overflow: unset; seperti kode yang ada di bawah ini
#wrapper {
background: #ffffff;
max-width: 1000px;
margin: 0 auto;
padding: 70px 30px 30px;
overflow: unset;
}

5. Selanjutnya kalian cari kode #share-container { atau seperti yang di bawah ini
#share-container {
margin: 20px auto 30px;
overflow: hidden;
}

6. Hapus kode di atas dan ganti dengan kode di bawah ini
#share-container {
background: #fff;
width:100%;
display: inline-block;
flex-wrap: nowrap;
align-items: center;
position: -webkit-sticky;
position:sticky;
bottom: 0px;
z-index: 1;
}

7. Masih dalam mode Edit HTML, sekarang kalian cari kode seperti di bawah ini
<div id='share-container'>
<div class='label-line-c'>
<p class='share-this-pleaseeeee'><b:switch var='data:blog.locale'><b:case value='id'/>Bagikan Artikel ini<b:default/>Share this post</b:switch></p>
</div>
<div id='share'>

8. Hapus kode tersebut ,dan ganti dengan kode di bawah ini
<div class='label-line-c'>
<p class='share-this-pleaseeeee'><b:switch var='data:blog.locale'><b:case value='id'/>Bagikan Artikel ini<b:default/>Share this post</b:switch></p>
</div>
<div id='share-container'>
<div id='share'>

9. Simpan template kalian dan selesai

Sangat mudah bukan untuk membuat tombol share menjadi sticky atau fixed pada template viomagz kalian, jika kalian merasa bingung atau kurang paham kalian bisa tanyakan langsung melalui kolom komentar di bawah ini. Terimakasih atas kunjungannya dan semoga bermanfaat buat kalian semua

==Iklan Dipate Disini===

Related Posts

Comments


EmoticonEmoticon