Cara Membuat Judul Postingan Satu Kata di Homepage

Homepage

XDTPD Blogs | Kali ini kita akan membahas cara membuat judul artikel menjadi satu kata saat muncul di homepage. Tutorial ini saya ambil refrensinya dari Bungfranki. Nah biasanya ada sebagai blogger yang tidak ingin menampilkan judul postingannya terlalu panjang diblog mereka dikarenakan ingin membuat homepage blognya menjadi lebih rapi. Cara ini sangat cocok dilakukan pada blog-blog yang berniche seperti blog yang membagikan Template, Software dan lainnya.

Contoh dari tutorial yang kita bahas ini adalah seperti judul ini : Gridisme - Responsive Blogger Theme menjadi Gridisme saja yang muncul di homepage ataupun halaman utama blog kita. Cara ini sangat bagus diterapkan pada blog yang membagikan template agar homepage nya menjadi lebih rapi dan singkat.

#CARA MEMBUAT JUDUL POSTINGAN SATU KATA DI HOMEPAGE

Adapaun tutorial untuk memunculkan judul artikel hanya satu kata ,dihomepage adalah sebagai berikut. Silahkan ikuti langkkah-langkah dibawah ini dengan sesama.

Pertama, Silahkan masuk ke Dashboard blogger seperti biasa.

Kemudian, cari kode </head> dan letakkan kode yang ada dibawah ini tepat diatas kode </head> tersebut.

<b:if cond='data:blog.pageType != &quot;item&quot;'>

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>

<script type='text/javascript'>

    $(document).ready(function(){

   var abc = $("body").find(".entry-title a").eq(0).text().split(" ");

    $("body").find(".entry-title a").eq(0).text(abc[0]);

    var def = $("body").find(".entry-title a").eq(1).text().split(" ");

    $("body").find(".entry-title a").eq(1).text(def[0]);

    var hij = $("body").find(".entry-title a").eq(2).text().split(" ");

    $("body").find(".entry-title a").eq(2).text(hij[0]);

    var klm = $("body").find(".entry-title a").eq(3).text().split(" ");

    $("body").find(".entry-title a").eq(3).text(klm[0]);

    var nop = $("body").find(".entry-title a").eq(4).text().split(" ");

    $("body").find(".entry-title a").eq(4).text(nop[0]);

    var qrs = $("body").find(".entry-title a").eq(5).text().split(" ");

    $("body").find(".entry-title a").eq(5).text(qrs[0]);

    });

</script></b:if>

</b:if>

Nah, kode diatas hanya berlaku untuk 5 postingan saja yang ada dihomepage. Jika sobat mempunyai lebih dari 5 artikel pada homepagenya, silahkan tambah dan ganti kode yang telah saya tandai dibawah ini :

var qrs = $("body").find(".entry-title a").eq(5).text().split(" ");

    $("body").find(".entry-title a").eq(5).text(qrs[0]);

1. Silahkan ganti kode qrs dengan dengan kode lainnya sesuka sobat, yang pastinya tidak sama.

2. Silahkan ubah angka 5 sesuai dengan yang sobat inginkan ataupun sesuai dengan berapa artikel yang ada dihomepage sobat.

Selanjutnya, silahkan tambahkan kode jQuery librari yang ada dibawah ini jika pada template yang sobat pakai belum ada. Namun, jika sudah terdapat kode jQuery librari tersebut dengan versi berapapun, maka sobat gak harus menambahkannya lagi.

<script src='//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>

Lalu, Simpan template sobat dan selesai.

Itu saja tutorial untuk postingan kali ini, semoga bisa membantu dan menjadi refrensi untuk semua kawan-kawan blogger lainnya. Jika sobat ada pertanyaan silahkan tanyakan langsung pada kolom komentar yang tersedia dibawah. Oh iya, jangan lupa untuk berkunjung kembali karena XDTPD akan selalu mengupdate berbagai tutorial menarik lainnya setiap saat.

Refrensi : BungFrangki.com