Panduan Lengkap Mengenal WordPress Template Hierarchy

 

Jika ingin mengenal WordPress lebih dalam lagi, ada baiknya kalau Anda mengetahui theme WordPress terlebih dulu. Pada saat WordPress melakukan rendering, CMS ini menggunakan template untuk mengatur tampilan halaman secara keseluruhan. Terlebih lagi, platform ini mematuhi hirarki yang ketat sehingga semuanya dapat terorganisir dengan baik. Agar bisa mengelola template website sepenuhnya, Anda harus mengetahui WordPress template hierarchy dan cara kerja hirarki tersebut.

WordPress template hierarchy terbagi dalam tujuh kategori utama:

  1. Site front page
  2. Single posts
  3. Single pages
  4. Category and tag pages
  5. Custom post types
  6. Search results pages
  7. 404 error pages

Di tutorial ini, kami akan membahas template WordPress beserta hirarkinya. Di samping itu, kami juga akan menjelaskan cara kerja tema dalam menggunakan file template untuk menampilkan halaman website.

Pengenalan File Template (dan Hubungannya dengan Tema WordPress)

Pada saat membuat website statis sederhana, biasanya Anda hanya menggunakan HTML dan CSS untuk melakukan rendering dan kustomisasi tampilan. Di sisi lain, WordPress dikenal sebagai CMS yang sangat powerful. Platform ini dibuat dengan bahasa pemrograman PHP dan menggunakan beberapa file .php untuk mengatur tampilan dari setiap aspek halaman website Anda.

Sebagai contoh, lihat sisi kanan dari tutorial ini. Ada sidebar yang menampilkan artikel atau tutorial terkait yang diposting di blog kami. Apabila browser memerintah WordPress untuk memuat post ini, maka CMS terpopuler ini juga akan memuat beberapa file ‘template’, salah satunya adalah sidebar.php. File tersebut menyediakan informasi mengenai cara rendering sidebar yang sedang Anda lihat saat, dan elemen apa saja yang ditawarkan:

Sidebar hanyalah satu dari sekian banyak file yang memengaruhi tampilan halaman secara keseluruhan. Sebagian besar halaman WordPress membutuhkan beberapa file template agar bisa berfungsi sebagaimana mestinya, seperti:

  • index.php
  • header.php
  • sidebar.php
  • footer.php
  • functions.php
  • single.php
  • comments.php

File-file yang disebutkan di atas merupakan sebagian template file yang bisa Anda dapatkan di WordPress. header.php, sidebar.php, dan footer.php adalah file yang sangat penting dan juga dikenal dengan sebutan ‘template partials’. Hal ini menunjukkan bahwa ketiga file tersebut dapat di-embed ke berbagai template lainnya.

Cara WordPress dalam melakukan rendering terkesan sulit pada awalnya. Meski demikian, metode ini terbilang efektif. Jika Anda ingin membuat template yang unik bagi masing-masing halaman website, maka kustomisasi bukanlah cara yang tepat untuk dilakukan. Sebaiknya manfaatkan WordPress modular approach untuk template yang memungkinkan Anda mengelola setiap file serta menerapkan elemen tersebut di seluruh website kapan pun Anda inginkan.

Ketika memilih template untuk setiap halaman, hal pertama yang dilakukan WordPress adalah mengecek tipe atau jenis tema yang Anda terapkan saat ini. Masing-masing tema memiliki seperangkat file template yang akan diprioritaskan. Inilah yang kami sebut dengan WordPress ‘template hierarchy’.

Sampai di sini, Anda sudah mengetahui dua hal, yakni cara WordPress rendering halaman situs dan tema sebenarnya adalah kumpulan dari file template. Dalam praktiknya, satu tema membutuhkan satu file template agar bisa berfungsi, dan file tersebut adalah index.php. Namun, ada juga tema yang membutukan lebih banyak template. Untuk hal-hal lain yang tidak disertakan dalam tema, WordPress dalam hirarkinya akan menggunakan file lain guna mengisi kekosongan.

Cara kerja WordPress Template Hierarchy

Sebelumnya, kami sudah menyebutkan beberapa contoh dari file template. Hanya saja, template tersebut digunakan ketika halaman atau post telah di-load. WordPress template hierarchy menentukan template yang akan digunakan beserta fungsinya.

Sebagai contoh, apabila Anda mencoba loading halaman di kategori hosting hypothetical, maka inilah yang terjadi di background:

  1. WordPress akan mencari file template category-hosting.php di direktori tema saat ini.
  2. Jika file category-hosting.php tidak ditemukan, maka WordPress akan mencari file yang menggunakan ID kategori, misalnya category-2.php.
  3. Apabila WordPress tidak juga menemukan dua file yang dimaksud, maka CMS ini akan mencari file generic category.php.
  4. Jika file category.php tidak ditemukan, maka WordPress akan mencari template archive.php.
  5. Jika semua file di atas tidak juga ditemukan, platform blogging ini akan meloading file tema index.php dan menggunakannya sebagai template halaman.

File template akan dicari sesuai urutan. Karena itulah, file-file tersebut tersusun dalam sebuah hirarki. Dalam artian lebih luas, website WordPress terdiri atas tujuh kategori halaman dan masing-masing memiliki hirarki yang ketat.

7 Kategori dalam WordPress Template Hierarchy

Semua website yang dibuat di WordPress terbagi ke dalam tujuh tipe halaman. Setiap kategorinya memiliki built-in WordPress template hierarchy.

1. Site Front Page

Pertama-tama, kita akan mebahas halaman depan website. Ketika WordPress meloading halaman beranda utama website Anda, hal pertama yang akan dicari adalah file front-page.php. Seandainya file ini tidak ditemukan, maka platform WordPress akan kembali ke home.php. Bagaimana kalau kedua file ini tidak dapat ditemukan? Maka WordPress akan mencari file index.php.

Begini urutan cara kerja hirarkinya:

  1. front-page.php
  2. home.php
  3. index.php

Meskipun ketiga file tersebut sama, WordPress masih saja mengacu pada internal logic-nya. Walaupun demikian, hirarkinya ini terkesan lebih mudah.

2. Single Posts

Artikel WordPress (seperti artikel Gudang Informasi ini ) masuk dalam kategori single posts. Di awal kami sudah menyebutkan terdapat beberapa file template yang disertakan saat rendering post. Hanya saja, sebagian besar file template tersebut merupakan elemen internal. Sebelum WordPress melakukan rendering terhadap file tersebut, sebaiknya tentukan terlebih dulu mana file template yang akan digunakan di halaman secara keseluruhan.

Berikut cara kerja hirarki single posts:

  1. single-{post-type}-{slug}.php
  2. single-{post-type}.php
  3. single.php
  4. singular.php
  5. index.php

Apakah ada beberapa file template di atas yang terbilang masih baru untuk Anda? Jika ya, maka kami akan membahasnya satu per satu. Lihat nomor satu pada daftar, single-{post-type}-{slug}.php. Misalnya saat ini Anda tengah membangun dan mengelola toko online, maka contohnya akan seperti ini, single-product-ca-12.php. Dengan kata lain, WordPress akan mencari file template yang unik untuk setiap post yang di-load dalam kategori tertentu. Seandainya platform WordPress tidak bisa menemukan template yang relevan, maka CMS ini akan kembali ke single-{post-type}.php dan begitu seterusnya sampai tiba di index.php.

Dalam praktifknya, cara ini memungkinkan Anda untuk mendesain sendiri template yang hendak dipasangkan di masing-masing post atau produk. Satu lagi, jika Anda ingin menerapkan satu template untuk semua post di situs, maka gunakan single.php.

3. Single Pages

Single pages membuat kategori sendiri di WordPress. Kami akan mengambil situs Gudang Informasi sebagai contoh. https://www.dikaprasetya.net adalah beranda atau halaman utama website. Pada saat kita mengakses halaman utama, WordPress akan meloading template front-page.php. Sementara itu, halaman lain, seperti https://www.dikaprasetya.net/web-hosting, menjadi bagian dari single pages.

Berikut hirarki yang dipatuhi oleh single page:

  1. File template custom
  2. page-{slug}.php
  3. page-{id}.php
  4. page.php
  5. singular.php
  6. index.php

Di nomor satu, entry tersebut bukanlah nama file. Hal ini terjadi karena WordPress bisa mendeteksi beberapa tipe konten sebagai single pages. Misalnya, jika Anda ingin mengelola sebuah post, WordPress akan menetapkan hirarki default yang telah kami jelaskan sebelumnya. Di sisi lain, single pages (contohnya, /web-hosting) akan berpindah ke page-slug.php. Sebagai contoh, page-web-hosting.php (seandainya file seperti ini tersedia).

Sistem kerja hirarki pada single page akan sama seperti pada post. Jika tidak ada file template untuk slug unik dari suatu halaman, maka WordPress akan mencari file yang cocok dengan ID-nya. Begitu seterusnya. Seperti biasa, semua line akan berakhir di index.php semisal beberapa file sebelumnya tidak ditemukan.

4. Category and Tag Pages

Berikut file template yang masuk dalam hirarki untuk kategori ini:

  1. category-{slug}.php
  2. category-{id}.php
  3. category.php
  4. archive.php
  5. index.php

Cara kerja hirarki di bagian ini sama seperti cara kerja hirarki terhadap post dan halaman. WordPress akan mencari template yang unik untuk kategori yang hendak di-loading. Pertama-tama, platform ini akan mencari filename yang menyertakan slug, kemudian ID. Jika filename yang dimaksud tidak ditemukan, maka WordPress akan mencari category.php. Apabila gagal lagi, WordPress akan kembali mencari archive.php. Arsip WordPress haruslah memuat post dari semua kategori sehingga dapat diikutsertakan dalam hirarki.

Selain itu, kami juga telah mengelompokkan WordPress tag ke bagian ini karena keduanya merupakan elemen taxonomic. Hirarki keduanya pun serupa, kecuali ika Anda mengganti semua contoh category dari tag.category-{slug}.php menjadi tag-{slug}.php.

5. Custom Post Types

Pada dasarnya custom post types adalah tipe atau jenis konten yang tidak tergabung dalam klasifikasi default WordPress. Misalnya, Anda memiliki blog yang berfokus pada konten review atau ulasan, maka sudah pasti Anda ingin membuat custom post type yang disebut reviews dan kemudian menambahkan fitur tambahan ke dalam konten review tersebut.

Berikut hirarki dari tipe kontent:

  1. archive-{post_type}.php
  2. archive.php
  3. index.php

Seperti yang Anda lihat, hirarki tersebut tidak menyediakan informasi yang mendetail seperti pada beberapa hirarki sebelumnya. Meski demikian, WordPress masih harus melewati beberapa file template sebelum sampai pada index.php untuk membuat berbagai halaman yang rumit atau kompleks.

6. Search Result Pages

Umumnya, kategori search result pages tidak sesulit lima kategori sebelumnya. Hal ini dikarenakan telah tersusunnya tata letak atau layout terkait. Kemudahan ini tercermin dalam hirarki search result pages:

  1. search.php
  2. index.php

Dalam kasus ini, WordPress diatur secara default ke index.php apabila tidak ditemukannya custom template untuk halaman hasil pencarian (search result page) Anda. Sebagian besar tema modern akanmenyertakan beberapa kustomisasi untuk halaman pencarian.

7. 404 Error Pages

Halaman error adalah salah satu halaman yang paling dihindari oleh siapa pun baik Anda sebagai pemilik situs maupun para pengunjung website. Namun, tetap saja halaman error harus dibuat jikalau kesalahan terjadi. Sekadar informasi, WordPress tidak menawarkan custom error pages. Namun jangan khawatir, untuk membuat halaman error sangatlah mudah.

Jika Anda membuat halaman error, WordPress akan mendeteksinya terlebih dulu, seperti yang akan didemonstrasikan oleh hirarkinya di bawah ini:

  1. 404.php
  2. index.php

Kami menyarankan agar Anda membuat halaman error jika traffic website Anda saat ini semakin ramai.

WordPress Template Hierarchy Dalam Praktiknya

Di sub-bab ini, kami akan membahas cara kerja WordPress template hierarchy. Kami akan menggunakan hypothetical website sebagai contohnya.

Anggap saja Anda sudah membuat website yang telah dilengkapi dengan beranda atau halaman utama, single pages, dan berbagai postingan atau konten. Selain itu, website Anda pun telah dikelola dengan custom theme yang menyertakan file template berikut ini:

  • index.php
  • home.php
  • page.php
  • archive.php
  • category.php

Meski sedikit, template file yang kami informasikan bisa Anda gunakan untuk membuat dan mengelola website. Sebagai contoh, jika Anda mencoba mengakses beranda atau halaman utama, maka WordPress akan memuat atau me-loading template home.php.

Berikut beberapa contoh halaman lain yang diakses beserta file template yang akan di-load:

  • Postingan yang acak akan me-loading index.php sebagai file template karena tidak ada opsi lain dari hirarkinya.
  • Karena ketersediaannya, kategori apa pun yang Anda buka akan menggunakan category.php. Jika file tersebut tidak ditemukan, WordPress akan mencari dan meloading archive.php.
  • Single pages akan meloading page.php. Namun, single pages tersebut akan diatur secara default ke index.php jika file template sebelumnya tidak ditemukan.
  • Seandainya Anda tidak membuat halaman error, maka WordPress akan meloading index.php sebagai template kalau-kalau suatu saat kesalahan terjadi.

File yang telah disiapkan oleh tema dan hirarki yang sudah kami jelaskan sebelumnya menentukan tipe template yang akan diload WordPress. Semoga dengan adanya artikel ini, Anda bisa menggunakan WordPress template hierarchy.

Kesimpulan

Untuk memudahkan pemahaman terhadap WordPress template hierarchy, kami telah menunjukkan file template mana saja yang diloading terlebih dulu. Melalui artikel ini, kami berharap Anda mengetahui file mana saja yang harus diubah jika Anda ingin melakukan beberapa perubahan terhadap tema WordPress yang aktif saat ini.

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *