Ikhtisar Chapter 3: WordPress Specific PHP

Apa yang Dipelajari?

Tiga konsep fondasi WordPress: The Loop (cara menampilkan konten dari database), Header/Footer (bagian yang muncul di semua halaman), dan cara mengubah template HTML statis jadi theme WordPress.

Poin Utama

1. The Loop — Jantung WordPress

The Loop adalah kode yang berulang satu kali untuk setiap post/page dari database:

php

<?php while(have_posts()) { the_post(); ?>
    <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
    <?php the_content(); ?>
<?php } ?>

the_title() → tampilkan judul
the_content() → tampilkan isi
the_permalink() → URL menuju halaman detail

Template Hierarchy — WordPress otomatis pilih file berdasarkan URL:

Halaman	File yang Dicari
Homepage	`index.php`
Detail post	`single.php` → fallback `index.php`
Halaman page	`page.php` → fallback `index.php`

2. Header & Footer Global

Masalah: kalau tulis header di index.php, halaman lain tidak kebagian.

Solusi: buat file terpisah lalu panggil:

header.php → berisi <!DOCTYPE html>, <head>, wp_head(), navigasi
footer.php → berisi wp_footer(), </body>, </html>
Panggil dengan get_header() dan get_footer() di setiap template

3. functions.php — "Otak" Theme

File khusus untuk berkomunikasi dengan sistem WordPress. Dipakai untuk memuat CSS & JS:

php

function university_files() {
    wp_enqueue_style('nama', get_theme_file_uri('/build/style-index.css'));
    wp_enqueue_script('nama', get_theme_file_uri('/build/index.js'), null, '1.0', true);
}
add_action('wp_enqueue_scripts', 'university_files');

wp_enqueue_style() → muat file CSS
wp_enqueue_script() → muat file JS
get_theme_file_uri() → dapatkan URL file di folder theme
Jangan pakai tag <link> atau <script> langsung di HTML

4. Konversi Template Statis → WordPress

Download template HTML/CSS yang sudah jadi
Copy bagian <header> ke header.php, <footer> ke footer.php
Pindahkan folder aset (css, images, js) ke folder theme
Muat CSS/JS via functions.php
Fix path gambar: url(images/foto.jpg) → url(<?php echo get_theme_file_uri('/images/foto.jpg'); ?>)

Fungsi WordPress Penting

Fungsi	Kegunaan
`wp_head()`	Wajib di `<head>` — biar WP bisa inject CSS/JS
`wp_footer()`	Wajib sebelum `</body>` — biar WP bisa inject JS + admin bar
`get_header()` / `get_footer()`	Sertakan header.php / footer.php
`wp_enqueue_style()`	Muat file CSS dengan benar
`wp_enqueue_script()`	Muat file JS dengan benar
`get_theme_file_uri()`	Dapatkan URL ke file di folder theme

Satu Kalimat

The Loop menampilkan konten, header/footer membungkus halaman, dan functions.php menghubungkan tema ke WordPress — tiga fondasi ini dipakai di seluruh course.

Ikhtisar Chapter 3: WordPress Specific PHP ​

Apa yang Dipelajari? ​

Poin Utama ​

1. The Loop — Jantung WordPress ​

2. Header & Footer Global ​

3. functions.php — "Otak" Theme ​

4. Konversi Template Statis → WordPress ​

Fungsi WordPress Penting ​

Satu Kalimat ​