Membuat Theme: Heading

Ini adalah pertemuan keenam dalam seri panduan membangun theme WordPress. Anda bisa membaca artikel-artikel sebelumnya dengan melihat daftar isi di bawah artikel ini.

Setelah kita melakukan tata letak layout di artikel sebelumnya, saatnya sekarang kita mengutak-atik bagian headernya. Disini kita akan mulai mencoba memasukkan fungsi-fungsi WordPress ke dalam theme blog kita. Yuk kita mulai!

   <head>
     <meta charset="<?php bloginfo( 'charset' ); ?>" />
     <title>
     <?php 
        wp_title( '|', true, 'right' );
      bloginfo( 'name' );
     ?>
     </title>
     <link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />
     <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
     <?php if ( is_singular() && get_option( 'thread_comments' ) )
    wp_enqueue_script( 'comment-reply' );
    wp_head();
     ?>
   </head>   

Hehehe… jangan pingsan dulu gan. Ane jelasin dah satu per satu 🙂 Kode diatas untuk menggantikan kode di index.php sebelumnya. Cari tag <head> hingga </head> lalu ganti dengan kode diatas. Apa aja sih fungsinya? Kita urut dari atas sampai bawah ya?

<meta charset="<?php bloginfo( 'charset' ); ?>" />

Kode ini untuk memberitahu browser kita memakai karakter apa dalam blog. Biarin seperti itu aja.

<title>
   <?php 
      wp_title( '|', true, 'right' );
      bloginfo( 'name' );
   ?>
</title>

Kode ini untuk mengatur title blog. Akan muncul di bagian paling atas browser. Kode wp_title akan berubah-ubah menurut judul artikel. Kalau di halaman depan, maka dia tidak akan memunculkan apa-apa. Sedangkan kode bloginfo('name'); akan memunculkan nama blog anda. Anda bisa mengubah nama blog melalui menu Settings – General

<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />

Ini kode untuk menerima ping back dari blog lain. Jadi kalau ada yang ngasih link ke kita, kita bisa langsung tahu.

<?php if ( is_singular() && get_option( 'thread_comments' ) )
  wp_enqueue_script( 'comment-reply' );
  wp_head();
?>

Kalau kode diatas kita perlukan agar fungsi reply comment berfungsi. Tahu kan reply comment? Contohnya di blog ini. Kalau anda klik reply, maka secara otomatis form akan muncul disana dan anda bisa langsung ketik komentar di bawahnya. Canggih ya?

Nah, kalau udah dimasukkan semua, simpan deh filenya index.php dan coba anda lihat hasilnya. Untuk menguji titlenya, coba buka sebuah artikel melalui menu Posts – Posts. Klik view salah satu artikel. Seharusnya judulnya sudah berganti-ganti menurut judul artikelnya.

Oke, kita sudah belajar aneka atribut di head. Insya Allah besok kita akan utak-atik bagian header blog. Ditunggu yah… 🙂

Dicari dengan kata kunci:

membuat themes,cara buat gambar berganti banner wordpress,membuat header web php,cara membuat header wordpress berganti-ganti,membuat gambar berganti di wordpress,buat tema dengan berganti ganti,fungsi meta charset,cara membuat kepala halaman berubah-ubah di wordpress,cara pasang slide kepala di wordpress,gambar berganti ganti di wordpress

52 thoughts on “Membuat Theme: Heading

  1. mashengky

    kalo beneran jadi 1 buku, aku pasti beli nih mas… lagi butuh banget tutorial dasar untuk bikin theme wordpress sendiri..

    1. admin Post author

      untuk design biasanya memang pakai photoshop, selanjutnya di potong-potong dan dijadikan HTML

  2. masher

    saya sudah mereplace kode sebelumnya di antara dengan di index.php tapi hasilnya error mas, tulisannya Fatal error: Call to undefine function. apa ada yang salah ya?

  3. masher

    saya sudah me-replace kode sebelumnya di antara <head> dan </head> di index.php tapi hasilnya error mas, tulisannya Fatal error: Call to undefine function wp_title() in… apa ada yang salah ya?

  4. awaludin

    Mas naya , setelah saya mengikuti tutorial tentang heading ini . ane coba ikuti membuat Post namun ko Post nya gak muncul yah apa yang salah yah terimakasih

    1. Wordpress blog

      karna untuk step ini cuma..
      1. memberitahu browser kita pake karakter apa
      2. menampilkan title blog klo kita rubah di general-settings
      3. menampilkan pingback
      4. menampilkan form komentar

      jdi belum bisa menampilkan konten CMIIW 🙂

  5. Medhy

    Saya masih pusing dengan kode-kode seperti diatas Maklumlah masih ingusan,,
    Tapi saya masih pakai yang bawaan sebelum nanti mengerti mengotak-atiknya..
    terimakasih mas..

  6. agus oka

    Dear Admin

    saya sangat berterimakasih atas semua artikel di blog ini, ini yang saya cari-cari dari dulu dan akhirnya ketemu juga.

    salam

  7. Ariev

    kalau untuk bagian ini maksudnya buat apa ya om?

    <link rel="stylesheet" type="text/css" media="all" href="” />

    dan bagian ini :

  8. jekave

    mas, saya udah baca dan praktekkan semua theme yang diajarkan, cuma mau nanya kalau untuk membuat space iklan di header gmn? atau enaknya membagi header jadi 2 bagian rata. makasih

  9. Rifqi Mahmud

    Maaf mas mau nanya. .saya kan pake editornya dreamweaver dan pake server lokal (localhost)nya XAMPP. .ketika saya masukkan kode” di atas kok kagak bisa yaa mas? ?apa itu dari awal extensi indexnya index.php mas? ?
    .terimakasih

  10. find more

    I just want to tell you that I am just beginner to weblog and absolutely liked your blog site. Almost certainly I’m planning to bookmark your website . You definitely have awesome article content. Thanks a lot for revealing your web-site.

  11. Vincenzo Shabot

    Well, I theorize that could live because Abigail and the girls commenced accusing additional persons of witchcraft when they had been recently discovered dancing naked in the interior the woods and therefore, bad. Abigail furthermore engaged in a affair along with John Proctor. Persons they were accusing were completely not answerable of accurately what they’d been recently accused allied with, and the particular accusers had been the greatest machine by the globe from being holy… they wrecked up point of reference bogus witness.

  12. Ronald Fixico

    Just desire to say your article is as astonishing. The clearness in your post is simply nice and i can assume you are an expert on this subject. Well with your permission allow me to grab your RSS feed to keep up to date with forthcoming post. Thanks a million and please carry on the gratifying work.

  13. Lazaro Tuchman

    It is perfect time to make a few plans for the future and it’s time to be happy. I have read this submit and if I could I wish to counsel you some attention-grabbing issues or advice. Perhaps you can write subsequent articles referring to this article. I want to learn even more issues about it!

  14. Ronnie Azim

    I like the valuable info you provide in your articles. I will bookmark your blog and check again here regularly. I’m quite sure I’ll learn many new stuff right here! Good luck for the next!

Comments are closed.