4/02/2012

Cara Membuat Title Post Rata Tengah

Cara membuat title post rata tengah. sejauh ini kebanyakan template akan mempunyai nilai default untuk title dengan perataan kiri. Memang default sebuah tulisan ya seperti itu lain lagi kalau di arab pasti dari kanan..hehe. Kalau soal ngeblog tampilan memang menurut selera masing-masing. Disini saya ingin share cara membuat tittle postingan rata tengah. contoh setelah saya mengubah perataan teks pada title seperti tampak pada gambar di bawah ini.


Tentu banyak sobat saya yang sudah tahu tips perataan pada title post, tapi juga tidak salah pula pada kesempatan kali ini saya akan menyampaikan tips ini pada sahabat saya yang masih bingung mengutak-atik template script html-nya.

Sebelum kita lanjut ke pembahasan, ada baiknya saya kasih tahukan dulu kepada sobat bahwasanya Title pada post dikategorikan sebagai 'selector'. dimana selector ini dalam bahasa Html-nya sering di syntax-kan dengan H3. intinya bahwa nanti bila kita ingin utak-atik  script html maka sobat fokus kepada pencarian H3, dimana selector H3 akan mempunyai deklarasi yang didalamnya ada 'properti' dan 'nilai'. oke, kita tidak akan membahas mengenai properti-properti di H3 tapi langsung pada inti topik diatas yaitu membuat agar title post kita nanti rata tengah.

Ikuti Step by step di bawah ini dan berdo'a dulu ya :) :
  • 1. Silahkan buka perancang template sobat ( disini saya gak ngasih tahu cara buka perancangnya ya... :) )
  • 2. Kemudian temukan Properti 'h3' yang mirip seperti script di bawah ini
                                 <b:includable id='post' var='post'>
                                 <div class='post hentry'>
                                 <a expr:name='data:post.id'/>
                                 <b:if cond='data:post.title'>
                                 <h3 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>
                                 </h3>
                                 </b:if>
  • 3. Bila sudah ketemu maka tulisan yang berwarna merah di ' <h3 class='post-title entry-title'> ' akan kita sisipkan syntax perataan tengah di depannya dengan perintah ' <center> ' dan penutupnya pada sesudah ' </h3> ' diberi penutup ' </center>.
  • 4. Sehingga syntax html diatas akan menjadi seperti berikut ini.
                                 <b:includable id='post' var='post'>
                                 <div class='post hentry'>
                                 <a expr:name='data:post.id'/>
                                 <b:if cond='data:post.title'>
                                 <center><h3 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>
                                 </h3></center>
                                 </b:if>
  • 5. Lakukan pratinjau dahulu hasil editan sobat dan bila sudah berhasil maka silahkan simpan perubahan tempalte-nya. 
  • 6. Selesai deh....
Bagaimana, Insya Allah mudah bila diiringi praktek langsung dan bersungguh-sungguh. kuncinya teliti dan sabar...hehehe.... Selamat mencoba dan semoga sukses selalu buat sahabat semua. 

41 komentar

kayaknya bagus juga mas title rata tengah.. terima kasih turornya...

wahh... mantapp bangg,, bagus untuk mereka yang mencari trik ini bang


happy blogging

emm..rata tengah ya? lebih enak yang gak rata tengah bagiku.. he he..support disini kang.

hehehe...master sabarmuanas dateng juga nih... salam buat sang master nih

kalau saya pengen judul blognya kang, bukan judul artikelnya

Kunjungan di sini sahabat, lama sepertinya tidak berkunjung di sini.Kangen sama ilmu dan sharingnya nih.
Nah kan saya dapat ilmu baru lagi di sini

sip kang hehehe,,, kalo pengen2 ketengah2 DS ntr ds pakai scriptnya :D

dicari h1 aja mas...trus dibuat center... :)

sy jg terapkan hal diatas.., emank terlihat lbh rapi & elegan.. sukses selalu buat kang Farhan..! Aamiin :)

wah biar senada sama google adsensya ya.. boleh ni, ane nunggu adsenya di terima dulu ah baru praktekin ini. heheh.

wah bisa ya bang, tapi punya saya uda ta rubah menjadi h1 e... gimana ya? hehe

wah biar senada dengan google adsensenya ya bang? mantap. ane ntar ah kaya gini juga, mau nunggu di terima dulu GA nya, heheh.

mantapp tutorialnya kang..
ternyata judul bisa di rata tengah juga. .

simple aja ya om caranya....
tapi lebih enak diliat yg biasa aja om....
hehe....... ^^

hihi nice share sob, kalo ane lebih suka kalo make align kiri ^^

Hmmm, ane baru perhatikan nih kang . Ternyata rata tengah, boleh nih dicoba sekali sekali, mohon arahannya kang

Wahh, manteb nih kang..
thannks yah udah share

wah ternyata bisa di rata tengah ya,,
terima kasih kang untuk infonya

Sebetulnya sepele yo... tapi kalau bagi orang yang males metani script kayak saya, rasane ini info yg sangat berharga untuk menambah wawasan mempercatik blog. Kira² blog-ku apik opo ora jika di rata tengah kangmasbro? :)

waaah pertamax deh ini tipsnya :D

nahh..ini dia nih yang saya cari kang...makasih banyak kang, insya allah segera di coba, ntar saya undang ke "rumah" klo dah jadi hehe
makasih sudah berbagi kang

hehehe... punya mas arie dibiarin gitu aja dah cuantik....hahayyyy

hehehe... kondangan suguhannya ubi cilembu ntar...hahayyy

judulnya jadi center ya sob ,,,
keren,,,

wilujeng ngeblog

kunjunga perdana sob..

sukses sob..

Title rata tengah gini pengaruh ke SEO ga om?

hehehe,tengah malem mampir kesini dapat ilmu baru dah,cakep juga judul dibuat rata tengah gan,selalu mantap neh agan tiap share sesuatu(niruin artis)...lanjut gan..

saya kira gak pengaruh mas, ya kayak penempatan iklan gitu pas di tengahkan...

alhamdulillah ya...sesuata ( niruin artis juga...wkwkwkw )

Wah mantap sekali nih kang tips & triknya :-)

terimakasih dan salam semangat :-)


hehe, maaf lama tak berkunjung

apa kabar kang?

lumayan kang.. kodenya bisa jadi koleksi ane lagi.
makasih ye....

Mantap tipsnya Om, tips penempatan centernya cihui.
Salam kenal ya Om.

wah sangat bermanfaaat

Visit today sob,, please support backsob ,,,,

kok bi blog saya tidak bisa ya pak, apa karena h3 gak ada?

Kini aku tahu.
Mantap banget tipsnya Kang

ilmu yang sangat bermanfaat gan , Terima Kasih sudah share :)

iya gan , ini yang aku cari . kadang kalo belum tau kita suka buat judul lagi dipostingan lalu pakai center untuk merata tengahkan .

Artikel yang bagus dan bermanfaat kang
Matur suwun


Emoticon Emoticon