Tips menandai link postingan yang sama dan sedang aktif di Blog dengan jquery

Diposkan: 24 Desember, 2014
Judulnya lucu dan agak aneh, yang kita maksud itu link yang sama dengan link postingan sama dengan link yang ada pada widget contohnya di related posts, widget popular posts atau apalah yang artinya apa bila link tersebut di buka akan menuju ke halaman postingan itu juga.

Ilustrasi, menandai link posting yang sama

Tentunya lebih interaktif  kepada user apabila di tandai atau di beri warna lain, karena pengguna mengenali dan lebih lebih di nonaktifkan linknya. Sedangkan untuk menandai link yang pernah di kunjungi bisa menggunakan link a:visited.

Yang pertama di lakukan pastikan di template blog menyimpan code Jquery ataupun Jquery library yang dihosted di Google cdn. Karena disini melibatkan jquery. Namun perlu diketahui terlebih dahulu ini trik postingan untuk blogspot. 

Dan ini khusus untuk halaman postingan (pageType item).

Salin code di bawah ini tempel di atas tag penutup </body>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
var y = ".html";
var x = window.location.pathname,
    b = x.lastIndexOf(y),
    c = x.substring(-1, b),
    path = c+y;
 $("#ID_or_class ul li a").each(function(){
  if (this.href.indexOf(path)!=-1){
    $(this).css("color", "black").css("font-weight", "bold");
   }
 });
</script>
</b:if>

Untuk targetnya silahkan sesuaikan widget, ID ataupun classnya masing masing.

Bila ingin menambahkan lebih dari satu bisa di tulis seperti halnya menulis ID atau Class untuk CSS

$("#IDrelatedPosts1 ul li a,.ClassTarget2 ul li a")......

Untuk menambah Class atau yang lainnya

.addClass("class_Sesuatu")

Untuk menghapus attribute a href

.removeAttr("href")

Untuk mengeceknya buka salah satu postingan apakah sudah mengenai sasaran yang di maksud bila link yang sama mengarah ke konten yang sama..?

Ada kesulitan chat di komentar ...

0 Komentar

Posting Komentar