Cara Membuat Menu Table Of Contents Berkedip di Template [Median UI Versi 1.5]
ShayTekno.com - Pada pembahasan sebelumnya admin sudah membahas tentang Cara Menampilkan Judul Blog, di Dalam Postingan Blog di Template Median Ui, dan Cara Menampilkan Icon Profile di Halaman Postingan Blog [Median UI Versi 1.5].
Karena admin sendiri sudah melakukan berbagai modifikasi kepada template medium ui yang saya beli di Jago desain, sesuai dengan yang admin tanyakan juga langsung kepada pemilik template yaitu Mas maky membolehkan kita melakukan berbagai modifikasi terhadap template Median UI sesuai dengan keinginan kita.
Keuntungan Membuat Menu Table Of Contents Berkedip di Template [Median UI Versi 1.5]
Adapun keuntungan yang bisa kita dapatkan membaut menu table OF contents berkedip hanya serana mempercantik tampilan halaman saja.
Namun tidak terlepas dari itu semua, yaitu hoby mungkin dari sebagai teman-teman suka dengan menampilkan table OF contents berkedip, ada pula yang tidak suka , bisa admin katakan juga ini adalah sesuai selera pengguna.
Adapun keuntungan yang bisa kita dapatkan dalam membaut teble of contents berkedip iyalah memudahkan pengguna tahu isi atau materi yang kita tulis didalam artikel, karena kita tahu bahwa menu header teble of contents adalah suatu rangkuman H1, H2, H3, pada halaman artikel kita.
Baiklah tanpa berlama-lama membacot di awal mari simak panduan selengkapnya tentang Cara Membuat Menu Table Of Contents Berkedip di Template [Median UI Versi 1.5] berikut ini:
Cara Membuat Menu Table Of Contents Berkedip di Template [Median UI Versi 1.5]
Warning!! Sebelum Melakukan Edit bagaian HTML di template Median UI, Silahkan anda gunakan laptop/FC atau bisa menggunakan keyboard android, yang mendukung Ctrl F, agar lebih memudahkan anda dalam melakukan Edit HTML.
- Buka Dasbor Blogger.
- Lalu pilih TEMA.
- Lalu klik pada icon warna kuning.
- Lalu pilih Edit HTML.
- Lalu silahkan gunakan Ctrl F.
- Lalu cari kode .postToc{position:fixed;top:0;right:-355px;bottom:0;left:0; width:355px;margin-left:auto;
- Lalu letakkan kode di bawah ini.
.Blog .post-tocContainer .show:before{content:unset;display:block;position:absolute;width:10px;left:13px;border-radius:50px;top:7px;height:10px;background:#555;webkit-animation:indicator 1s ease infinite;-moz-animation:indicator 1s ease infinite;animation:indicator 1s ease infinite}
@-webkit-keyframes indicator{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
@-moz-keyframes indicator{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
@keyframes indicator{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.tableOfIcon:before {
content: '';
display: block;
width: 12px;
height: 12px;
background-color: var(--link-color);
border: 2px solid var(--content-bg);
border-radius: 50%;
position: absolute;
top: 8px;
left: 15px;
animation: indicator 1s ease infinite;
-webkit-animation: indicator 1s ease infinite;}
- Di bagian Atas .postToc{position:fixed;top:0;right:-355px;bottom:0;left:0; width:355px;margin-left:auto;
- Sesuai dengan gambar dibawah ini.
- Jika sudah klik simpan.
- Lalu cek blog anda, pastikan bahwa Toc teble of contents anda sudah berkedip.
Kesimpulan
Mungkin anda bertanya-tanya kenapa admin tidak melakukan perubahan terhadap template medium ui, cuman menambahkan kode HTML saja.
Karena kita ketahui juga bahwa template Median UI memiliki banyak sekali Versi, dan akan mendapatkan update versi setiap bulannya, Dengan memasukkan kode HTML saja kita tidak repot-repot lagi untuk menghapusnya. Jika kita perlu melakukan perubahan kembali.
Demikian itulah tutorial cara membuat menu header teble of contents berkedip di halaman postingan blog di template Median UI Versi.1.5, semoga artikel ini bermanfaat, dan membantu Anda yang sedang mencari informasi terkait TOC table OF contents berkedip. Selamat mencoba.
Post a Comment