You are here → Home √ Buat Heading, Subheading, Minor Heading lebih keren & Cantik

Buat Heading, Subheading, Minor Heading lebih keren & Cantik

Dipublikasikan oleh Ilham Bachtiar pada Thursday, August 30, 2012

Kali ini saya mau bagi-bagi css heading, subheading, minor heading template saya. Kalo menurut saya sih keren dan enak dilihat, entah kalo menurut sobat. jika menurut sobat juga keren bisa disedot langsung deh.

Heading

.post h2 {background:url(http://3.bp.blogspot.com/-MWU-FEV2XYc/UA7dBBQO4BI/AAAAAAAACOc/61Pg8LiMrjY/s1600/garis-bawah2.gif) left bottom no-repeat;
color: #2673AC;
font-size: 20px;
font-family: Arial, sans-serif;
font-weight: normal;
margin-bottom: 15px;
margin-top: 5px;
padding-left: 0px;
padding-bottom: 10px;
line-height: 27px;
}

Subheading

.post h3 {
font-family: 'Share', Arial; font-size:15px; font-weight:bold; margin:8px 0;text-shadow:1px 0 0 #eee,-1px 0 0 #fff,0 1px 0 #eee,0 -1px 0 #eee,1px 1px 2px #000;
}

Minor Heading

.post h4 {
background:url(http://1.bp.blogspot.com/-h4ZLomxOJsc/TzcHp_4RpDI/AAAAAAAABbM/XqbwFDg0ptQ/s1600/point.png) left bottom no-repeat;
color: #2673AC;
font-size: 20px;
font-family: arial, sans-serif;
font-weight: normal;
margin-bottom: 15px;
margin-top: -5px;
padding-left: 40px;
line-height: 27px;
}

Bagi sobat yang belum tau cara pasangnya gimana, gini nih cara pasang kode cssnya :

1. Mengedit Heading, Subheading, Minor Heading

Pada halaman Edit HTML cari aja tag post h2, post h3, post h4. satu-satu ya nyarinya, kalo salah satu sudah ketemu langsung ganti aja dengan kode yang sudah saya sediakan diatas. Namun sob ada beberapa template yang kodenya nggak dipisah-pisah kayak kode saya. kalo punya saya kan udah saya pisahin jadi heading, subheading, minor heading udah saya pisahin sendiri-sendiri. sedangkan yang belum, biasanya langsung digabungin jadi sati. misalnya h2, h3, h4, h5, h6 dst. itu sobat hapus aja yang h2, h3, h4. lalu pasang aja semua kode diatas diatas tag penutup CSS "]]></b:skin>"

Kayaknya ribet banget nih saya ngejelasinnya, bagi kamu yang kesulitan ngutak-ngatiknya. mumpung saya lagi ganteng nih, sini saya bantuin. kirim template kamu ke email 1lhamatsarhjm@gmail.com, ntar saya beresin. hehe lagi ganteng nih. buruan! biasanya saya gantengnya cuma semenit abis itu jelek setahun tapi kalo emailnya sudah dikirim kasih konfirmasi ya!

2.Menerapkan Heading, Subheading, Minor Heading

Ini kan fungsinya buat nandain teks-teks penting pada postingan kamu. jadi ini cuma berlaku pada postingan kamu aja. cara nerapinnya gini :


  • 1. Pada form Entri buat judul seperlunya kamu. misalnya "Ilham Bachtiar Ganteng" wkwkwk
  • 2. Kemudian pada akhir judul itu kamu tekan aja salah satu menunya (Heading/Subheading/Minor Heading) yang ada di menu bar form entri kamu.


  • 3. dan hasilnya

Ilham Bachtiar Ganteng


Sekian dulu kalo gitu sob, karena ini udah malem dan nggak sabar lagi mau main Point Blank oya terakhir saya mau ngasih tau posisi saya dimana. saya lagi diwarnet depannya smp 1 batu namanya study net lantai 2 nomor 18. SStttt jangan keras-keras. malam ini ane lagi jadi teroris, males jadi CT. jangan bilang-bilang kedensus kalo ane disini ya takut warnetnya ancur ditembakin, kan punya orang. hehehe Selamat bekerja, semoga berhasil sesuai dengan harapan.

41 Komentar:

  1. oke sobat, langsung dibungkus, trims postingannya

    ReplyDelete
  2. Replies
    1. iya nie. mas nya ganteng ya. hehhehehe. jadi penasaran pengen coba gara gara gantengnya itu loh

      Delete
    2. haha jadi nyesel saya kasih contoh gitu. wkwk :)

      Delete
  3. fontface kayaknya nih "ont-family: 'Share'" hahaxD

    ReplyDelete
  4. hehe.. ini sih mau propaganda ganteng niih... hahaha
    btw, OK, saya ngerti, saya save siapa tau nanti kepake, makasih

    ReplyDelete
    Replies
    1. hehe mungkin sedikit ada maksud seperti itu sob. daripada nggak ada yang bilang saya ganteng wkwk :D

      Delete
    2. hahaha... jangan kuatir,
      banyak yang akan berkata demikian,
      termasuk saya, wkwkwk...

      Delete
  5. Replies
    1. kalo soal seo saya nggak begitu faham. blog saya saja nggak tau udah begitu seo apa belum :D

      Delete
  6. Replies
    1. yah cuma kecil-kecilan sob. terima kasih juga sudah rela mampir kesini :)

      Delete
  7. wah keren headingnya sobat,, perlu belajar untuk menerapkannya sobat...

    ReplyDelete
  8. bagus headingnya sob, terima kasih tutorialnya...

    ReplyDelete
  9. Thnaks sob, dapat tambahan ilmu nih :)

    ReplyDelete
  10. Itu gunanya buat apa ya?
    Maklum, sya bkn master Css.

    ReplyDelete
    Replies
    1. Gunanya buat subjudul didalam postingan sob. misalnya pada post tutorial kan ada beberapa step yang mesti dilakukan. nah dengan heading kita bisa memperjelas post kita untuk para pemirsa. kenapa ruwet bannget ya. ah tau ah :D

      Delete
  11. wah menarik nie bang, jadi penasaran hasilnya seperti apa. kalau ane tulis riza ganteng, bakalan sama ga ya? hehehe.

    ReplyDelete
    Replies
    1. hasilnya sama sob. tapi kalo gantengnya entar dulu, bisa dicoba hehe :D

      Delete
  12. wah.. keren sob tutornya...

    maaf baru berkunjung, ada kesibukan offline..

    ReplyDelete
  13. Wkwkwk,,, ngga tertarik, soalnya memusingkan hehe

    ReplyDelete
  14. wah jadi menarik ya bang. bisa di coba nie. saya simpen dulu ya :D

    ReplyDelete
  15. wiiihh kodenya keluar kalo kursornya diarahin ke situ ya, kereennn *hihi norse

    ReplyDelete
  16. Wah kerennya gimana ya mas ganteng? penasaran nih... ntar nyoba ah. soalnya sekarang lagi ol lewat hp :-D

    ReplyDelete
  17. Thanks postingnya, klu untuk di WP gmn ya? Newbie bingung belajar nge-blog :D

    ReplyDelete
  18. Makasih bro, pas nemu di google langsung ada :D mantep deh

    ReplyDelete
  19. artikelnya bermanfaat semua terimakasi mas bro...

    ReplyDelete

 
Copyright © 2013 Obachti 95 . Powered by Blogger . All Rights Reserved