Dari WP Theme Lesson #5: The Loop oleh Small Potato diterjemahkan ke Bahasa Indonesia oleh Mochammad Kurniawan.

Perulangan memanggil untuk isi blog anda. Ini sangat penting menyeting kode-kode PHP. Sekarang, anda harus siap mengetahui apa yang dilakukan sebelum memasuki pelajaran ini, dari tutorial berseri ini dari awal. Pergilah dan lakukan itu pertama kali, sebelum mempelajari pelajaran berikut lebih jauh.

Lebih jauh, anda telah belajar:

• peraturan, struktur, dan hirarki dari sebuah theme WordPress
• masing-masing dari halaman anda terdiri dari apa saja
• bagaimana menginstall theme anda
• bagaimana memanggil judul blog anda dan membuatnya sebagai sebuah link
• bagaimana untuk memanggil deskripsi dan memisahkan header dari seluruh bagian theme

Mari kita mulai pelajaran #5:
Sekarang, anda harus membuka Xampp Control, folder theme tutorial, browser di http://localhost/wordpress, dan file index.php di notepad.

Ini adalah apa yang harus anda miliki di file index.php:

Ingat, untuk mempelajari kode-kode tersebut, ketik semuanya, JANGAN copy dan paste saja.

Langkah 1:
Tambahkan sebuah DIV (kotak tak terlihat) di bawah area header. Berikan ID “container” seperti ini:

<div id=”container”>

</div>

Apa kegunaan DIV yang ini? Fungsinya untuk memisahkan content anda dari seluruh bagian theme, seperti sidebar dan footer.

Langkah 2: Tambahkan kode-kode berikut di antara tag DIV Containar. Cobalah untuk mengetik semuanya seperti yang anda lihat berikut. Jika muncul error, ulangi ketikan anda.

<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>

<?php endwhile; ?>

<?php endif; ?>

Dari poin ini, itu akan lebih mudah jika mengetahui fungsi masing-masing dan bagaimana cara kerjanya. Apa yang baru saja anda ketik adalah Perulangan di WordPress. Sebelum saya menjelaskan kode-kode itu dengan tulisan. Anda harus mempunyai ini:

Kenali bahwa saya memberi tanda setiap garis di dalam kotak dan saya cenderung untuk melompat satu baris banyak. Itu untuk mengorganisasir. Itu tidak cukup untuk mengetik mengkode. Anda perlu mengorganisir mereka, kemudian, anda mengetahui di mana segalanya adalah dan set yang dari kode-kode terkait. Untuk penandaan, gunakan tab sebagai ganti spasi

Apa yang telah terjadi?

• if(have_posts()) – mengecek untuk melihat jika anda punya postingan.
• while(have_posts()) – jika anda sudah punya postingan, ketika anda punya post, if you do have it, while you have any post, jalankan the_post().
• the_post() – panggil postingan untuk ditampilkan.
• endwhile; – ingat peraturan #1, ini untuk menutup while()
• endif; – tutup if()
• Catatan: tidak semua set dari kode membutuhkan dua bagian untuk membuka dan menutup. Beberapa bisa menutup sendiri, dimana dijelaskan pada have_posts() dan the_post();. Karena the_post(); berada di luar if() and while(), itu menggunakan titik koma untuk mengakhiri/menutup sendiri.

Langkah 3: Pada pelajaran sebelumnya, anda diajari bagaimana untuk memanggil judul blog anda menggunakan bloginfo(‘name’). Sekarang, anda belajar untuk memanggil judul post di antara Perulangan

Ketik <?php the_title(); ?> setelah the_post(); ?> dan sebelum <?php endwhile; ?>

Simpan file index.php, refresh browser anda. Anda akan melihat Hello World di bawah uraian blog anda. Secara langsung, blog anda hanya mempunyai satu posting. Untuk saya, blog test saya mempunyai banyak posting jadi saya mempunyai banyak judul post. Dan karena judul post saya gunakan sama dan tidak diorganisir pada bagian tutorial, itu kelihatan seperti baris panjang dari Hello World.

Langkah 4: Menampilkan judul post anda sebagai link judul post. Masih ingat bagaimana anda menampilkan judul blog ke sebuah link. Hal yang sama di sini, tambahkan <a href=”#”> dan </a> di antara <?php the_title(); ?>

Simpan index.php dan refresh browser. Sekarang judul anda adalah link judul, tapi mereka mengarah tidak kemana pun juga. Untuk membuat masing-masing judul mengarah ke post yang benar. Anda harus mengganti tanda # dengan the_permalink().

<a href=”<?php the_permalink(); ?>“><?php the_title(); ?></a>

the_permalink() adalah fungsi PHP yang memanggil alamat atau lokasi masing-masing post. Simpan dan refresh browsher. Jika anda hanya punya satu judul Hello World, arahkan mouse pada link, lihat pada status bar, di bawah browser anda; itu sudah bukan lagi http://localhost/wordpress/#.

Jika anda mempunyai lebih dari satu link judul, anda akan melihat bahwa masing-masing link judul ke sebuah post berbeda atau halaman web, Tapi, link post kami masih pada baris yang sama. Untuk membedakan mereka, tambahkan tag <h2> dan </h2> di antara kode link anda.

<h2><a href=”<?php the_permalink(); ?>”><?php the_title(); ?></a></h2>

Masih ingat H1 kita gunakan untuk judul blog? Itu untuk halaman web heading. H2 untuk sub-heading. Sekarang link judul adalah sub-heading, masing-masing mempunyai baris sendiri. Simpan index.php dan refresh browser untuk melihat perubahan.

Kali ini sekian dulu pelajaran ini. Anda seharusnya mempunyai:

Catatan: Jika anda belum siap, buatlah post dummy/terserah untuk mengetes theme anda. Pergi ke http://localhost/wordpress/wp-login.php. Login, klik pada tab Write, yakinlah anda melihat Write Post, buat sebuah post, lalu lakukan untuk beberapa kali. Anda bisa mengisi judul dengan Hello World semua atau judul yang berbeda.

Ikuti Tutorial berseri Theme WordPress dari awal.