Posting terkait Widget Untuk Blogger / Blogspot dengan jQuery

Terkait posting widget sangat penting bagi sebuah blog, karena meningkatkan jumlah tampilan halaman dan juga membantu pengunjung untuk melihat posting lain yang berhubungan dengan blog. Sekarang di sini adalah trik yang indah untuk menampilkan link ke posting terkait di bawah setiap posting. Pada blog mereka hari ini ada banyak jenis widget related post, dan item terkait thumbnail gambar menggunakan HTML, Java script, dll .. Di sini saya akan menunjukkan metode yang mudah untuk menunjukkan install.It judul jQuery.It widget posting hanya terkait akan terlihat seperti gambar di bawah ini.

Cara Tambah Widget Untuk Blogger Posting terkait



Saya telah melihat beberapa yang menunjukkan Widget Posting terkait posting di bawah posting mereka. Ini juga penempatan script yang baik yang dapat meningkatkan tampilan halaman Anda. Untuk menambahkan kode, cukup ikuti petunjuk di atas. saya harus menulis dua set instruksi untuk setiap langkah, karena beberapa dari Anda menggunakan layout default, dan beberapa dari Anda menggunakan template baru Anda layout.Backup sebelum mencoba tutorial ini. Langkah 1: Dalam layout lama: Pergi ke Dashboard - Desain - Edit HTML - Expand Template Widget.

Dalam layout baru: Pergi ke Dashboard - Template - Edit Template HTML - Expand Template Widget.

Sekarang menemukan (CTRL + F) kode ini dalam template:

</ Head>

Dan segera sebelum itu, paste kode ini:

<-! - Posting terkait Script dan Styles Mulai www.bdlab.blogspot.com> <! - Hapus -> < b: if cond = 'data: blog . pageType == "item" ' > <a href = "http://24work.blogspot.com" target = "_blank" title = "Blogger Widgets"> <img src = "http://safir85.ucoz.com/24work-blogspot/cursor-24work-10. png "border =" 0 "alt =" Blogger Widgets "style =" position: absolute; top: 0px; kanan: 0px; "/> </ a> < gaya type = "text / css" > # terkait-posting Widget. { padding-left: 6px; margin-bottom: 10px; } . # terkait-posting widget h2, # terkait-posting h2 { font-size: 1.6em; font-weight: bold; warna: hitam ; font-family : Georgia, " Times, New Roman ", Times, serif; margin-bottom: 0.75em; margin-top: 0EM; :; padding-top 0EM } # terkait-posting { , biru: warna } # terkait-posting: hover { color: blue; } # terkait-posting ul { list-style-type: none; margin: 0 0 0 0px; padding: 0px; text-decoration: bold; font-size: 15px; teks -color: # 000000 } # terkait-posting ul li { background: transparent tidak mengulang-, display : block; daftar-gaya-type: none; margin-bottom: 13px; padding-left: 30px; padding-top: 0px;} </ gaya > < Script jenis 'text / javascript' = > var relatedpoststitle = " Terkait Tulisan Script dan Gaya www.bdlab.blogspot.com End ->

Jika Anda ingin mengubah judul widget, Anda dapat mengedit ini baris kode di atas

var relatedpoststitle = " Related Posts ";

Jika Anda mau, Anda bisa mengedit biru dan  hitam  warna hadir dalam kode ini



2.Now menemukan baris kode

< div class 'post-footer-line post-footer-line-1' = / >

Jika Anda tidak dapat menemukannya kemudian mencoba menemukan satu ini

< p class 'post-footer-line post-footer-line-1' = / >

Sekarang segera setelah salah satu baris (mana Anda bisa menemukan) tempat ini potongan kode

<-! Posting terkait Kode  www.bdlab.blogspot.com Start -> <-! Hapus -> < b: if cond data = ': blog.pageType == = "True" '! > </ b: if > < b: if cond = 'data: blog.pageType == "item"' > < Script expr: src = '"/ feeds / posts / default / - / "+ data: label.name + style = "border: 0" alt = "Related Posts Widget for Blogger" /> </ A> <script type = 'text / javascript' > var maxresults = 5; removeRelatedDuplicates (); printRelatedLabels ( " < data: post.url /> " ); </ Script > </ div > < - Hapus ->! </ b: if > ! <- Posting terkait Kode  End www.bdlab.blogspot.com ->

Dan sekarang klik Simpan Template





Anda dapat menyesuaikan jumlah maksimum posting terkait yang ditampilkan dengan mengedit baris ini dalam kode.

var maxresults = 5;

Catatan: Jika Anda ingin menampilkan Posting terkait pada setiap halaman, kemudian hapus baris kode dimulai dengan <- Hapus ->

Cara Tambah Widget jQuery Posting terkait untuk Blogger

Khas Penggunaan # 1

Untuk menampilkan link terkait di akhir setiap posting. copy kode ini ke dalam widget HTML / Javascript baru dan tempat di bagian bawah posting atau di footer di bagian halaman elemen. Widget menggunakan jQuery v1.3.2, Jika Anda sudah termasuk jQuery ke blog Anda. tidak perlu melakukannya lagi.

Dalam layout lama: Pergi ke Dashboard - Desain - Edit HTML - Expand Template Widget. Dalam layout baru:. Pergi ke Dashboard - Template - Edit Template HTML - Expand Template Widget Sekarang cari (CTRL + F) kode ini dalam template:

<data:post.body/>

Dan segera setelah itu, paste kode ini:

<a target="_blank" href="http://24work.blogspot.com" title="Blogger Widgets"> <img src = "http://safir85.ucoz.com/24work-blogspot/cursor-24work- 10.png "border =" 0 "alt =" Blogger Widgets "style =" position: absolute; top: 0px; kanan: 0px; "/> </ a> <script src =" http://ajax.googleapis. com/ajax/libs/jquery/1.3.2/jquery.min.js "type =" text / javascript "> </ script> <script src = "http://safir85.ucoz.com/24work-blogspot/related -posts/related-posts-widget-1.0-24work.js "type =" text / javascript "> </ script> <script

Dan sekarang klik Simpan Template




Penggunaan Khas # 2

Untuk menampilkan link terkait di kolom samping. copy kode ini ke dalam widget HTML / Javascript baru dan tempat di sisi dalam section.Again halaman elemen, Jika Anda sudah termasuk jQuery ke blog Anda. tidak perlu melakukannya lagi.

Cara Instal link Widget Posting terkait terkait di kolom sisi


saya harus menulis dua set instruksi untuk setiap langkah, karena beberapa dari Anda menggunakan layout default, dan beberapa dari Anda menggunakan layout baru. Jadi, mari kita lihat cara menginstal widget ini keren di blog Anda .. Langkah 1: Jika Anda menggunakan antarmuka Blogger lama: Pergi ke Dashboard - Desain - Elemen Halaman - Tambah Gadget.

Tambahkan Gadget HTML / JavaScript jenis.

Jika Anda menggunakan antarmuka Blogger baru: Pergi ke Dashboard - Layout - Tambah Gadget

2.Click pada 'Tambah Gadget' di sidebar. 3.Select 'HTML / Javascript' dan tambahkan salah satu kode yang diberikan di bawah 4. Sekarang Klik Pada Save 'JavaScript' Anda telah selesai.

<a target="_blank" href="http://24work.blogspot.com" title="Blogger Widgets"> <img src = "http://safir85.ucoz.com/24work-blogspot/cursor-24work- 10.png "border =" 0 "alt =" Blogger Widgets "style =" position: absolute; top: 0px; kanan: 0px; "/> </ a> <script src =" http://ajax.googleapis. com/ajax/libs/jquery/1.3.2/jquery.min.js "type =" text / javascript "> </ script>
<script src = "http://safir85.ucoz.com/24work-blogspot/related -posts/related-posts-widget-1.0-24work.js "type =" text / javascript "> </ script>
<script type="text/javascript">
relatedPostsWidget ({
'loadingText': 'loading ...'
}); </ script>

Dan sekarang klik Simpan

Seperti Ini? Silakan Bagi It: Posting dilihat: ? Like It Silakan Bagi It:

3