√ Cara Menciptakan Toc (Table Of Content) Sederhana Di Blogger

Lapaklama.com | Hallo sahabat blogger, di postingan kali ini kami akan membagikan sebuah tips sederhana yang dapat menciptakan postingan kau lebih menarik, Apa itu? Yaitu Membuat TOC (Table of Content) di setiap postingan blogger kamu.

Dengan adanya TOC (Table of Content) selain menciptakan postingan lebih menarik di mata mesin pencari, Juga sangat berkhasiat untuk memudahkan pengunjung dalam membaca inti konten yang ada di postingan tersebut. Buat kau yang mungkin belum mengetahui menyerupai apa itu TOC (Table of Content) silahkan lihat conton dibawah ini.

Membuat TOC (Table of Content) di Blogger

Daftar isi di postingan atau yang biasa di sebut TOC sudah sangat banyak di gunakan para blogger ternama di indonesia menyerupai wikipedia, blog niagahoster. Saya sendiri menggunakan TOC demi memperlihatkan kenyamanan kepada pengunjung untuk eksklusif melihat topik utama yang saya bahas di setiap artikelnya. dengan fitur ini pengunjung tidak perlu membaca dari awal artikel sampai ahir untuk menemukan inti dari pembahasan tersebut.

Panduan ini kami rekomendasikan untuk kalian para pengguna platform blogger, sedangkan untuk pengguna wordpress, Kami sudah pernah membagikan cara menciptakan TOC (Table of Content) di wordpress dengan memakai plugin.

Table Of Content yang kami berikan ini hanya memakai CSS yang sangat sedikit sehingga tidak membebani loading blog kalian, serta tampilannya yang juga sangat sederhana. Langsung saja simak panduanya berikut ini.

Panduan Membuat TOC (Table of Content) Sederhana di Blogger

1. Silahkan masuk kehalaman dasboard blogger kamu, lalu pilih menu Tema dan klik Edit HTML

2. Dihalaman edit HTML silahkan cari instruksi ]]></b:skin> (Gunakan kombinasi tombol CTRL + F untuk memudahkan dalam mencari instruksi tersebut).

3. Jika instruksi sudah anda temukan, Tambahkan CSS berikut ini sempurna dibawah instruksi tersebut.

.kurabox1 {background: #ddd; border: 1px dashed #007bfd;}
.kurabox2 {background: #ccc; border-bottom: 2px solid #007bfd;}
.kuradaftar {padding-left: 10px;font-size:19px}
.kuratoctabel {border-bottom: #007bfd dashed 1px; margin-left: -15px;padding:3px}
a.alink {text-decoration:none;font-weight:bold}

4. dan Jangan lupa klik Simpan Perubahan sesudah semuanya sudah kau lakukan.

5. Beralih kemenu Postingan, Silahkan buat postingan gres atau edit Postingan usang dan Copy instruksi dibawah ini pada mode HTML bukan Compose.

<div class="kurabox1">
<div class="kurabox2">
<span class="kuradaftar"><b><i class="fa fa-book"></i> Daftar isi</b></span></div>
<ol>
<li class="kuratoctabel"><a class="alink" href="#toc1">Title 1</a>
<ul>
<li><a class="alink" href="#toc2">Sub Title 1.1</a></li>
<li><a class="alink" href="#toc3">Sub Title 1.2</a></li>
</ul>
</li>
<li class="kuratoctabel"><a class="alink" href="#toc4">Title 2</a></li>
<li class="kuratoctabel"><a class="alink" href="#toc5">Title 3</a></li>
<li class="kuratoctabel"><a class="alink" href="#toc6">Title 4</a>
<ul>
<li><a class="alink" href="#toc7">Sub Title 4.1</a></li>
<li><a class="alink" href="#toc8">Sub Title 4.2</a></li>
</ul>
</li>
</ol>
</div>

6. Silahkan Edit Title dan Sub Title sesuai dengan kebutuhan anda. dan jangan lupa untuk menempatkan id=”toc1″ dan seterusnya dibagian H1 H2 dan seterusnya pada postingan tersebut.

7. Jika sudah, silahkan Publikasikan / Perbarui postingan tersebut.

Hasil Makara Tampilan TOC:

Note: Tampilan diatas mungkin akan berbeda, Hal ini dikarenakan faktor template yang kau gunakan.

Baca:

5 Faktor SEO Terbaru 2019 Yang Wajib Kalian Ketahui

3 Cara Praktis Cek Artikel Sudah Terindex Google Atau Belum

4 Langkah Praktis Membuat Website Portofolio Untuk Freelancer

Demikian isu kali ini, dan terimakasih telah membaca postingan Cara Membuat TOC (Table of Content) Sederhana di Blogger.

Sumber aciknadzirah.blogspot.com