Membuat Judul Postingan Bisa Diklik (Link)

Membuat judul postingan menjadi link - Beberapa template yang dishare oleh rekan blogger baik dalam atau pun luar negeri mempunyai kode CSS dan HTML berbeda. Otomatis strukturnya juga berbeda.

Diantara sekian banyak perbedaan itu ada judul yang merupakan link, ada juga yang tidak berupa link. Atau dalam istilah blogger pemula, ada judul yang bisa diklik ada juga yang tidak bisa di klik.

Semua itu tergantung selera sobat dalam menentukan tampilan blog sobat. Ada yang menyukai judul yang tidak bisa diklik, ada juga yang suka. Bagi saya pribadi, saya lebih suka clickable post title (berupa link).

Bagi sobat yang suka dengan judul yang berupa link, silahkan simak aja langkah mudahnya :

Membuat Judul Postingan menjadi Link


1. Login ke Blogger
2. Klik Template --> Edit HTML centang Expand Template Widget
3. Cari kode dibawah ini

<h2 class='post-title entry-title'>
      <b:if cond='data:post.link'>
        <a expr:href='data:post.link'><data:post.title/></a>
      <b:else/>
        <b:if cond='data:post.url'>
          <b:if cond='data:blog.url != data:post.url'>
            <a expr:href='data:post.url'><data:post.title/></a>
          <b:else/>
            <data:post.title/>
          </b:if>
        <b:else/>
          <data:post.title/>
        </b:if>
      </b:if>
      </h2>
ganti dengan kode :
<h2 class='post-title entry-title'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link'><data:post.title/></a>
     <b:else/>
        <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
        <b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
      </h2>
4. Simpan Template

Apabila kode di atas tidak ada, kemungkinan template sobat menggunakan tag h3 untuk judul, solusinya ganti tulisan h2 di atas menjadi h3.

Semoga bermanfaat...

Berita Lebih Baru Berita Lebih Lama
  • Raden Kian Santang
    Profil: http://faceblog45.blogspot.com/
    26 Desember, 2012

    Pertamax kang... :) izin repost linknya pasti mengarah ke sini ko :)

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      28 Desember, 2012

      Silahkan dengan senang hati Raden... :)

  • Blog Keperawatan
    Profil: http://askep-net.blogspot.com/2012/11/iphone5-gadget-impian.html
    26 Desember, 2012

    Saya bawaan template judul artikelnya berupa link Kang Ismet..
    Mohon bantuannya Kang Ismet untuk Klik G+1 dalam artikel ini.Semoga berkenan membantu Kang.
    Terima kasih sebelum dan sesudahnya saya ucapkan

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      28 Desember, 2012

      Lagi ikut kontes ya, kayaknya yang ngadain Malaysia ya... apa sobat juga di malaysia?

  • Angel Shared
    Profil: https://www.blogger.com/profile/03581491401180240611
    26 Desember, 2012

    Sangat bermanfaat sekali kang

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      28 Desember, 2012

      Okey sob... terimakasih

  • kaoskaos.net
    Profil: https://www.blogger.com/profile/06130842728623355771
    27 Desember, 2012

    makasih bang :)

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      28 Desember, 2012

      Sama2...

  • Unknown
    Profil: https://www.blogger.com/profile/01918695702499505922
    27 Desember, 2012

    Blog walking sore nih, kang.
    Itu judul posting dihalaman posting kan ya kang? bukan yang di homepage blog, kan?
    Dicoba dulu deh...Thanks sharingnya kang :)

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      28 Desember, 2012

      Iya di halaman posting, kalau hompage biasanya pake autoreadmore

  • Unknown
    Profil: https://www.blogger.com/profile/00206732353940909979
    30 Desember, 2012

    wah punya saya udah otomatis ke link :D

  • ASR_Blanco
    Profil: https://www.blogger.com/profile/15329895649169297548
    01 Januari, 2013

    gam saya mau nanya kalau mau Membuat Judul Postingan ketika di sorot oleh kursor memunculkan gambar, sepereti website ( games.co.id )

  • Anonim
    Profil:
    04 Januari, 2013

    kang kalo bikin kalimat pertama isi postingan seperti judul postingan itu bagaimana ya ??

  • Jelajahi Info
    Profil: https://www.blogger.com/profile/03567288295224614736
    06 Januari, 2013

    wah .
    dulu saya pernah ngalamin kayak gini, postnya gak bisa di klik, yang bisa cuma tombol Readmorenya doang :D
    Kang, kalo cara biar Judul Blog memiliki Attribut tittle gimana ?
    aku udah pasang menggunakan expr:data.post.Title , tetapi di Homepage gk muncul, yang muncul cuma di bagian Post Pagenya aja, maaf OOT

  • http://globalonlinebook.blogspot.com/
    Profil: http://globalonlinebook.blogspot.com/
    06 Januari, 2013

    Thanks Gan...sangat membantu

  • Anonim
    Profil:
    07 Januari, 2013

    Hallo kang Ismet,

    Tolong kang, bikin tutorial Cara membuat judul posting menjadi kalimat awal dari postingan, trus kalimat tersebut ngelink ke postingan yg baru dibuat secara otomatis. Contohnya seperti kalimat awal pada postingan kang Ismet diatas "Membuat judul postingan menjadi link". Soalnya saya agak susah mengetahui link posting kita sebelum kita tekan publish.

  • diablo
    Profil: http://nextspirit.blogspot.com/2013/01/history-of-freemasonry.html
    07 Januari, 2013

    nice kang...mantap dah buat saya sbg pemula hehehe

  • Anonim
    Profil:
    07 Januari, 2013

    Sudah ketemu Kang,

    Ternyata bisa langsung ngelink ke permalink postingan...

    berkat blog kang Ismet jadi ketemu cara yg slama ini dicari.

    Thank you

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      08 Januari, 2013

      Congrats deh sob.. maaf baru dibalas, lumayan sibuk nih :)

  • hyeongnimwan
    Profil: http://bajumuslim-hn.blogspot.com/
    08 Januari, 2013

    iya kawan saya milih yg nge link. sy maw ubah. saya coba tutorialnya ya..

  • hyeongnimwan
    Profil: http://bajumuslim-hn.blogspot.com/
    08 Januari, 2013

    huft, sama aja gan. gak ngaruh.

  • hyeongnimwan
    Profil: http://bajumuslim-hn.blogspot.com/
    08 Januari, 2013

    oh gk jadi gan, ngelink kok tnyata. thanks nih.

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      08 Januari, 2013

      Kalau mau merubah warnanya, tinggal edit CSSnya sob :)

  • Muhammad Farhan
    Profil: http://farhanshare.blogspot.com
    22 Januari, 2013

    kang mohon di edit ulang ya sama saya artikelnya, buat diterbitkan di blog saya, insya allah pasti saya akan pakai hasil karya saya sendiri, namun inspirasi artikel saya dari blog kang ismet ini, dan saya juga akan cantumkan sumber inspirasi artikel blog akang ini di bawah postinganya, terimakasih banyak kang, terus berkarya.

  • ristizona
    Profil: http://www.ristizona.com
    30 Januari, 2013

    menurut kang ismet judul yg bisa diklik ini termasuk seo onpage gak??

  • woi
    Profil: http://whiteduivel.blogspot.com/2012/07/pantun-matematika.html
    31 Januari, 2013

    thx kang

    komen back ye

  • Unknown
    Profil: https://www.blogger.com/profile/15097328824240402454
    07 Februari, 2013

    assalamualaikum mas. ana sudah coba ini, tapi kok tetap gak bisa ya? pas diarahkan kursor ke judul posnya, gak bisa diklik. hehe

  • Semipedia
    Profil: http://semipedia.blogspot.com
    07 Februari, 2013

    Terima kasih kang ismet sangat membantu...

  • PutuGiBagi
    Profil: http://putugibagi.blogspot.com/
    08 Februari, 2013

    terima kasih atas tutorial blognya gan :)..

  • ViperGoy
    Profil: http://www.vipergoy.com/2013/01/gofress-menghilangkan-bau-mulut.html
    08 Februari, 2013

    Wah bermanfaat banget nih tutornya^^

  • penyakit maag kronis
    Profil: http://carapengobatanalternatif.com/obat-herbal/penyakit-maag-kronis/
    11 Februari, 2013

    sangat membantu sekali niihh inonya,,makasih bnyak kang..

  • indrysefvi
    Profil: https://www.blogger.com/profile/02640673018006926064
    18 Februari, 2013

    Mampir gan numpang chat walking yaa :)
    Kunjung balik yaa kaka
    Secarik Info

  • Sakti
    Profil: https://www.blogger.com/profile/17796238138352501558
    07 April, 2013

    mantep banget bang, makasih banyak ya ^_^

  • Rianti Mahadewi
    Profil: https://www.blogger.com/profile/18080493721893058434
    21 April, 2013

    kang cara mengirim Postingan Otomatis ke Halaman Google Plus gimana yah??
    Ke halaman, bukan ke Profil kang...

    please bantu

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      03 Mei, 2013

      Masuk dulu ke google+ dan aktifkan sebagai halaman...

  • Admin
    Profil: https://www.blogger.com/profile/07232685658747386108
    03 Mei, 2013

    Kang, saya mau nanya, kalo untuk membatasi jumlah karakter yang tampil di judul artikel itu gimana yah ?

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      03 Mei, 2013

      Intinya jangan terlalu panjang aja sob, soalnya pencarian google membatasi 66 karakter

    • Admin
      Profil:https://www.blogger.com/profile/07232685658747386108
      03 Mei, 2013

      Gini kang, misalnya saya menuliskan dengan judul "Cara download blablabla" trus di homepage, saya cuma pengen nampilin beberapa karakter, misalnya jadi gini "Cara download bla..."
      Gitu bisa nggak yah Kang ??
      Makasih untuk respon nya kang ismet :)

    • Kang Ismet
      Profil:https://www.blogger.com/profile/07706142952405337288
      03 Mei, 2013

      Bisa sob, menggunakan tag kondisional dan CSS Ellipsis. Contoh kode seperti ini :
      Simpan kode yang di bawah setelah
      ]]></b:skin>
      <b:if cond='data:blog.url == data:blog.homepageUrl'>
      <style type='text/css'>
      .post h2{
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      -o-text-overflow: ellipsis;
      -moz-binding: url('assets/xml/ellipsis.xml#ellipsis');
      }
      </style>
      </b:if>

  • Unknown
    Profil: https://www.blogger.com/profile/15350118506616148846
    22 Mei, 2013

    kang.
    Tolong ajarin Cara Membuat Judlul Entri Bisa Di Masukin Link..
    Kyk Pekalongan-community.
    Setiap Di Klik Judul bisa masuk Ke Link aktif

    Please kang

  • MSsholeh
    Profil: https://www.blogger.com/profile/08777172445833822661
    10 Juli, 2013

    setelah saya membaca postingan kang ismet saya jadi bersemangat blogging.
    kang, minta kritik dan sarannya buat blog saya dong !! muhammad-sholeh{dot}info

  • KERJA SAMPINGAN ONLINE
    Profil: https://www.blogger.com/profile/03488737941458662679
    03 Februari, 2014

    Thanx infonya..
    bagi yang berminat kerja sampingan,,silahkan mampir ke situs resmi kami :
    http://kerja-online-parttime.blogspot.com

  • Unknown
    Profil: https://www.blogger.com/profile/07305432438245022406
    28 Februari, 2014

    Komentar ini telah dihapus oleh Unknown sebagai penulis.

  • Unknown
    Profil: https://www.blogger.com/profile/07305432438245022406
    28 Februari, 2014

    coba cari tutorial di google cukup lama akhirnya saya mendapatkan <a href="http://arima-art.blogspot.com/">tutorial</a> dengan <a href="http://arima-art.blogspot.com/">gambar</a> yang sangat bagus dan mudah dimengerti disini.

  • Unknown
    Profil: https://www.blogger.com/profile/00010576343703295403
    13 Maret, 2014

    Komentar ini telah dihapus oleh Unknown sebagai penulis.

  • Unknown
    Profil: https://www.blogger.com/profile/00260198425743375101
    13 Maret, 2014

    mas saya udah ikutin instruksinya kok kagak bisa ya, templatenya pun baru saya download punya kangismet yang superseo-gbt.blogspot.com

  • Unknown
    Profil: https://www.blogger.com/profile/00437994991176854200
    11 April, 2014

    Wah setelah sekian lama mutar-mutar..akhirnya terdampar (ketemu) ama blog ini....thanks kang......

  • Anonim
    Profil:
    08 Juli, 2014

    Pake expr:href ya kangIsmet..?

Tambahkan Komentar
comment url
Terima kasih telah berkomentar di Blog Kang Ismet.
  • Untuk menyisipkan Gambar, Kode, atau Kutipan silahkan klik Tab Sisipkan di atas.
  • Emoji yang bisa digunakan pada komentar :), :D, :( <3, :love dan :top
  • Untuk melihat Komentar yang telah ditambah sisipan kunjungi DEMO
Masukkan URL Gambar atau Potongan Kode, atau Quote, lalu klik tombol yang kamu inginkan untuk di-parse. Klik tombol Salin Kode! lalu paste ke kolom komentar.


image quote pre code
51 Komentar