Cara Memasukkan Peta Situs "Table of Contents" yang Menarik di Blogger

Sangat penting bagi penerbit untuk menyisipkan Peta Situs (Table of Contents) di blognya agar terlihat lebih profesional. Pada dasarnya Sitemap (Daftar Isi) adalah tempat di blog Anda di mana semua posting Anda diatur sesuai dengan tipenya.Inilah alasan mengapa hari ini kita akan Memasukkan Daftar Isi di Blogger.

Kami telah merancang daftar isi untuk blogger yang akan diperbarui secara otomatis sehingga Anda tidak perlu mengeditnya setiap kali ketika Anda mempublikasikan posting baru. Jika Anda mempublikasikan posting baru di blog Anda, itu akan secara otomatis ditambahkan ke Daftar Isi Anda. Halaman jadi itu benar-benar menghemat banyak waktu. Widget Table of Contents ini akan menampilkan semua posting Anda yang diatur dengan baik di bawah kategori spesifik mereka (LABELS). 

Widget ini dirancang dan dioptimalkan dengan CSS sehingga terlihat sangat menarik dan memiliki beberapa Jquery yang menarik perhatian Anda. Jadi mari kita mulai dengan mempelajari tutorial ini.

Tapi pertama-tama saya tahu Anda akan senang melihat pratinjau widget, jadi lihat dulu widget yang akan kami terapkan di blog kami

Pratinjau Daftar Isi Sekarang

Fitur:

• Peta Situs (Daftar Isi) diperbarui secara otomatis ketika Anda mempublikasikan sebuah posting

• Ini akan secara otomatis menandai posting terbaru Anda sebagai BARU di sitemap (Daftar Isi)

• Anda semua posting akan diatur dengan baik di bawah kategori yang diberikan (Label) 

• Memiliki tampilan yang segar dan baru dengan fitur drop down

Menambahkan Daftar Isi di Blogger:

Untuk menyisipkan Daftar Isi Menarik (Peta Situs) di Blogger Ikuti Langkah-langkah ini

• Pergi ke Blogger >> Templat >> Edit HTML >> Lanjutkan 

• Sekarang cari  ]]> </ b: skin> di Template Anda dengan (CTRL + F) 

• ketika Anda menemukan  ]]> </ b: skin> tepat di atasnya tempatkan kode berikut 

/ * -------- MyBloggerLab TOC ----- * /  
.judul-label {  
background-color: #denCF9; 
font-weight: bold; 
garis-tinggi: 1.4em; 
margin-bottom: 5px; 
overflow: disembunyikan; 
white-space: nowrap; 
vertical-align: baseline; 
margin: 0 2px; 
garis besar: tidak ada; 
kursor: pointer; 
teks-dekorasi: tidak ada; 
font: 14px / 100% Arial, Helvetica, sans-serif; 
padding: .5em 2em .55em; 
text-shadow: 0 1px 1px rgba (0,0,0, .3); 
-webkit-border-radius: .5em; 
-moz-border-radius: .5em; 
batas-jari-jari: .5em; 
-webkit-box-shadow: 0 1px 2px rgba (0,0,0, .2); 
-moz-box-shadow: 1px 1px 4px #AAAAAA; 
box-shadow: 0 1px 2px rgba (0,0,0, .2); 
warna: # e9e9e9; 
perbatasan: 2px putih solid! penting; 
latar belakang: # 6e6e6e; 
latar belakang: -webkit-gradient (linear, kiri atas, kiri bawah, dari (# 888), ke (# 575757)); 
latar belakang: -moz-linear-gradient (atas, # 888, # 575757); 
filter: progid: DXImageTransform.Microsoft.gradient (startColorstr = '# 888888', endColorstr = '# 575757'); 
}  
.data-list {  
line-height: 1.5em; 
margin-kiri: 5px; 
margin-right: 5px; 
padding-left: 15px; 
padding-right: 5px; 
white-space: nowrap; 
perataan teks: kiri; 
font-family: "Arial", sans-serif; 
ukuran font: 12px; 
}  
.list-ganjil {  
background-color: # F6F6F6; 
}  
.headactive { 
    warna: # fef4e9; 
    perbatasan: 2px putih solid! penting; 
    latar belakang: # 1C8DFF; 
    latar belakang: -webkit-gradient (linear, kiri atas, kiri bawah, dari (# 9dc2e7 ), hingga ( # 438cd2 )); 
    latar belakang: -moz-linear-gradient (atas,   # 9dc2e7 ,   # 438cd2 ); 
    filter: progid: DXImageTransform.Microsoft.gradient (startColorstr = ' # 9dc2e7 ', endColorstr = ' # 438cd2 '); 
}

• Sekarang simpan template dengan menekan Save Template tombol 

• Sekarang kita akan membuat halaman baru untuk Tabel kami isi  Ingat: kita akan membuat halaman baru tidak post.To membuat halaman baru pergi keBlogger >> Pages >> New Halaman> > Halaman Kosong 

• Sekarang Beri judul ke halaman Anda yaitu " XYZ Daftar Isi " dan sekarang di bawah tab EDIT HTML (tombol) rekatkan kode berikut

<script src = "http://nurulimaminfo.googlecode.com/files/daftarisiv2-pack.js">

</script> 

<script src = " http://www.mybloggerlab.com / feeds / posts / ringkasan? max-results = 1000 & amp; alt = json-in-script & amp; callback = loadtoc">

</script> 

<script type = "text / javascript">

var accToc = true; 

</script> 

<script src = "http://deroc.googlecode.com/files/accordion-pack.js" type = "text / javascript">

</script>

Sekarang setelah menempelkan kode di atas, cari http://www.mybloggerlab.com dan gantilah dengan URL blog Anda dan publikasikan halamannya sekarang dan lihat Daftar Isi Luar Biasa Anda dengan gaya Drop down.

Semoga Anda menyukai Widget Table Of Contents (TOC) ini. Widget ini benar-benar unik karena saat ini kami adalah satu-satunya yang memiliki versi widget widget Daftar Isi Abufarhan dengan style CSS MyBloggerTricks CSS, jadi jika Anda merasakan kesulitan bebas untuk bertanya sampai saat itu damai, berkah dan senang menciptakan TOC

Cara Memasukkan Peta Situs "Table of Contents" yang Menarik di Blogger 2019-02-16T03:52:00-08:00 Rating: 4.5 Diposkan Oleh: Sebar Iklan Masal Gratis Online