Membuat templat halaman untuk WordPress. Templat Halaman WordPress
Pada artikel ini, saya akan berbicara tentang cara membuat template untuk halaman permanen WordPress. Setiap metode memiliki pro dan kontra. Namun sebelum kita mulai, pengenalan singkat tentang apa itu halaman dan apa perbedaannya dengan postingan.
Di WordPress Anda dapat membuat halaman (pages) dan postingan (postingan). Perbedaannya adalah postingannya: muncul di feed di halaman utama; Kategori ditunjukkan untuk entri; postingan tidak boleh seperti pohon, dan halaman: digunakan untuk konten seperti “Tentang saya”, “Kontak”, “Peta situs”; tidak memiliki kategori, tetapi memiliki struktur pohon. Entri biasanya ditujukan untuk informasi kronologis (berdasarkan waktu penambahannya), dan halaman ditujukan untuk struktur pohon yang tidak bergantung pada waktu. Misalnya, artikel ini diterbitkan sebagai "entri" di bagian "Kode", dan link di menu header mengarah ke halaman: Fungsi.
Halaman mirip dengan catatan - mereka ditempatkan di tabel database yang sama dan datanya hampir sama: judul, teks, bidang tambahan, dll. Keduanya adalah postingan, tetapi jenisnya berbeda: halamannya seperti pohon dan diatur dengan membuat halaman induk dan anak, dan postingan disusun berdasarkan kategori dan tag. Di WordPress Anda dapat membuat jenis postingan tambahan, pohon atau tidak.
Membuat Halaman di WordPress
Seringkali Anda perlu membuat templat halaman terpisah agar informasi yang ditampilkan berbeda dari halaman lain. Dengan membuat templat halaman di WordPress, Anda dapat mengubah halaman sepenuhnya: menghapus sidebar, footer, header, atau mengubah halaman hingga tidak dapat dikenali lagi. Misalnya, di situs ini, halaman tempat kode file WordPress ditampilkan diubah dengan cara ini.
Metode 1: templat halaman menggunakan file dengan nama khusus dan menghubungkannya di panel admin (metode klasik)
Ini adalah cara paling umum untuk membuat templat halaman di WordPress. Untuk melakukan ini, Anda perlu membuat file .php, misalnya, tpl_my-page.php di folder tema dan di awal file tulis catatan bahwa file yang dibuat adalah templat untuk halaman:
Sekarang, saat membuat halaman di panel admin, di blok “Properti Halaman”, kita dapat memilih “template”:
Sejak WordPress 4.7. Templat halaman tersebut dapat dibuat untuk semua jenis postingan, bukan hanya halaman. Untuk melakukan ini, lengkapi komentar dengan baris: Template Post Type: post, page, Where post, page adalah nama jenis postingan yang memiliki template tersebut.
/* Nama Templat: Templat halaman saya Jenis Postingan Templat: postingan, halaman, produk */
Keuntungan:
- Hanya rekaman dengan templat tertentu yang dapat diambil. Misalnya, Anda dapat menampilkan semua halaman dengan template “Layanan” (file servises.php). Terkadang itu nyaman. Nama file template disimpan di metafield _wp_page_template, jadi untuk menampilkan halaman dengan template yang ditentukan, Anda perlu membuat kueri menggunakan metafield (lihat WP_Query).
Setelah membuat satu template, kita dapat dengan mudah menerapkannya ke halaman berbeda. Misalnya, Anda dapat membuat template tanpa sidebar dan menggunakannya di halaman berbeda.
Kekurangan:
Setelah membuat file template di folder tema, Anda perlu pergi ke panel admin dan menginstal template untuk halaman tersebut. Hal ini tidak selalu nyaman selama pengembangan. Oleh karena itu, jika Anda berniat menggunakan template hanya untuk satu halaman, gunakan cara kedua.
Bagaimana cara kerjanya:
Saat Anda masuk ke panel admin untuk mengedit halaman postingan pohon, WordPress memindai semua file template untuk baris:
Nama Templat: ***
Garis dapat ditempatkan di mana saja dan dengan cara apa pun di dalam file.
Semua file dengan string serupa dikumpulkan dan ditampilkan dalam pilihan template di blok "Atribut Halaman".
Saat menerbitkan halaman, bidang khusus _wp_page_template diisi dengan nama file templat atau default jika tidak ada templat yang ditentukan:
Wp_page_template = bawaan
_wp_page_template = tpl_halaman-saya.php
Selanjutnya ketika pengguna mengunjungi halaman tersebut, WordPress akan memeriksa meta field _wp_page_template, jika template sudah terinstall maka file template yang digunakan. Jika tidak, pencarian templat halaman akan dilanjutkan melalui hierarki.
Metode 2: templat halaman melalui file dengan nama tertentu (hierarki file templat)
Ketika sebuah halaman dibuat, label (siput, nama alternatif) diberikan padanya. Ini digunakan di URL halaman. Dan itu bisa diubah:
Untuk membuat template dengan cara ini, Anda perlu mencari slug halaman dan membuat file di folder tema. Misalkan slug kita seperti di gambar sama dengan contact, maka kita akan membuat file page-contacts.php di theme tersebut. dan isi dengan kode yang diperlukan (Anda dapat menyalin konten dari file template page.php dan mengeditnya sesuai keinginan Anda). Itu saja, sekarang ketika kita mengunjungi halaman tersebut kita akan melihat template baru. Demikian pula, Anda dapat mengambil ID (biarkan 12) halaman dan membuat file page-12.php .
Keuntungan:
Tidak perlu pergi ke panel admin dan menginstal file template. Templat mulai berfungsi segera setelah file dibuat. Nyaman untuk pengembangan.
Kekurangan:
Templat dibuat hanya untuk satu halaman tertentu. Tergantung pada slug halamannya; jika berubah, template tidak akan berfungsi. Jika menggunakan ID, maka ketergantungan pada slug hilang, namun di file tema menjadi tidak jelas halaman mana template tersebut (jika ada beberapa template dengan ID).
Hampir tidak berguna saat menulis template, dan terlebih lagi plugin. Ini dapat digunakan ketika Anda mengedit website Anda, yang slug atau ID halamannya sudah diketahui sebelumnya.
Bagaimana cara kerjanya:
WordPeress memilih file mana yang akan digunakan dengan urutan sebagai berikut (file harus berada di root tema):
- (any_name).php (saat menggunakan templat halaman)
- halaman-(post_label).php
- halaman-(post_ID).php
- halaman.php
- tunggal.php
- indeks.php
Metode 3: templat halaman melalui filter "template_include" (coding)
Ini adalah metode lanjutan, lebih kompleks, namun seiring dengan kerumitannya membuka kemungkinan yang luas. Dengan menggunakan metode ini, Anda dapat mengatur templat untuk halaman, postingan, kategori, publikasi apa pun di situs, atau bahkan grup publikasi apa pun. Lihat contoh dengan deskripsi:
// filter meneruskan variabel $template - jalur ke file templat. // Dengan mengubah jalur ini kita mengubah file template. add_filter("template_include", "my_template"); function my_template($template) ( # mirip dengan metode kedua // jika ini adalah halaman dengan slug portofolio, gunakan file template page-portfolio.php // gunakan tag kondisional is_page() if(is_page("portfolio" ))( if ($new_template = find_template(array("page-portfolio.php"))) return $new_template ; ) # template untuk grup kategori // contoh ini akan menggunakan file dari folder tema tpl_special-cats.php, // sebagai template untuk kategori dengan ID 9 , judul "Tidak Berkategori" dan slug "php" if(is_category(array(9, "Uncategorized", "php")))( return get_stylesheet_directory() . "/tpl_special-cats. php"; ) # template untuk entri berdasarkan ID // file template terletak di folder plugin /my-plugin/site-template.php global $post; if($post->ID == 12)( return wp_normalize_path( WP_PLUGIN_DIR) . "/my-plugin/site-template.php"; ) # template untuk halaman dengan tipe khusus "book" // diasumsikan bahwa file template book-tpl.php ada di folder tema global $post ; if($post->post_type == "buku")( kembalikan get_stylesheet_directory() . "/book-tpl.php";
) mengembalikan $templat; )
Keuntungan:
- Anda dapat mengatur templat untuk halaman atau grup halaman mana pun. Tindakan yang hampir lengkap.
Kode ini perlu ditempatkan di file function.php tema atau di plugin, atau dihubungkan dengan cara lain. Seperti yang dapat Anda lihat dari contoh, selama filter template_include, tag kondisional sudah berfungsi, variabel global disetel: $wp_query , $post , dll.
Kekurangan:
Anda dapat membuat template saat menulis plugin.
Kebutuhan untuk menulis kode dan menghubungkannya secara terpisah (misalnya, dalam fungsi tema.php).
Templat Halaman WordPress dirancang untuk memberikan tampilan yang dipersonalisasi pada halaman Anda. Seringkali, semua halaman memiliki satu templat, atau varian templat dengan atau tanpa bilah sisi. Setuju, ini tidak cukup untuk sebuah penerbangan mewah. Dalam tutorial ini kita akan melihat cara terbaik untuk membuat templat halaman Anda sendiri.
Apa itu templat halaman
Tema yang berbeda mungkin menyediakan templat halaman yang berbeda, misalnya templat untuk halaman lebar penuh (tanpa sidebar), dengan sidebar kiri, bukan sidebar kanan, dan seterusnya. Tidak adanya opsi ini saat mengedit halaman berarti tema tersebut belum menyatakan template tambahan.
Templat halaman dapat digunakan untuk lebih dari satu halaman, dan beberapa tema membuat templat yang sangat spesifik yang dimaksudkan untuk digunakan sekali saja.
Cara membuat templat halaman Anda sendiri
Saat menggunakan tema anak, Anda juga dapat menempatkan templat halaman di direktori root atau subdirektori, dan jika pembaruan tema induk dirilis, file Anda tidak akan terpengaruh.
Kapan tidak menggunakan templat halaman
Jika dengan menggunakan template Anda hanya mengubah gaya dan bukan struktur halaman tertentu, maka Anda dapat melakukannya tanpa menggunakan template tambahan.
WordPress memiliki fungsi pembantu body_class() yang digunakan di sebagian besar tema yang ada. Dengan menggunakan keluaran kelas dari fungsi ini, Anda dapat mengubah gaya halaman mana pun menggunakan kode CSS:
/* Sembunyikan sidebar di halaman 123 */ body.page-id-123 #secondary ( display: none; )
Templat halaman juga tidak boleh digunakan untuk mengubah parameter di loop utama WordPress, seperti menambahkan jenis posting khusus atau mengecualikan kategori. Untuk tujuan tersebut, ada filter khusus pre_get_posts di WP_Query() .
Jika Anda memiliki pertanyaan tentang bekerja dengan templat halaman di WordPress, saya akan dengan senang hati menjawabnya di komentar.
Belum lama ini sebuah manual diterbitkan tentang. Ini bersifat pengenalan pada tahap awal, tetapi juga mencakup contoh-contoh praktis. Saya ingin melanjutkan arah ini, perhatikan saja halamannya. Materi tentang topik ini multifungsi, yaitu sangat banyak. Oleh karena itu, akan sulit untuk membuka semua fitur template halaman dalam satu artikel. Namun setidaknya kami akan mencoba menyentuh detail tidak langsung dan, tentu saja, parameter utama.
Hirarki Halaman
Hirarki artinya urutan dari tingkat tertinggi sampai paling bawah, atau sebaliknya. Dalam kasus kami, ini adalah urutan otoritas yang sama dari file templat untuk halaman tersebut. Saat pengguna membuka salah satu halaman Anda, WordPress menampilkan kontennya berdasarkan opsi pembuatan halaman (selengkapnya di bawah).
Templat khusus– ditunjukkan dengan komentar bersyarat di bagian atas di dalam file dengan nama arbitrer.
halaman-slug.php– template dengan nama halaman (shortcut). Jika template khusus tidak ditentukan, maka WordPress menggunakan tipe ini sebagai yang utama.
halaman-id.php– pengidentifikasi halaman unik.
halaman.php– file standar yang bertanggung jawab atas konten halaman.
indeks.php– berkas indeks. Jika WordPress tidak menemukan salah satu template di atas, maka secara default WordPress akan bertanggung jawab atas halaman tersebut.
Perhatian. Ada juga templat halaman di WordPress yang disebut paged.php, namun tidak digunakan untuk menampilkan halaman postingan tunggal, melainkan untuk menampilkan daftar halaman di arsip postingan.
Buat templat khusus untuk penggunaan massal
Ada beberapa opsi untuk membuat template dengan kelebihan dan kekurangannya, hampir tidak signifikan. Opsi ini, yang sekarang akan kita pertimbangkan, adalah yang paling umum. Langkah pertama adalah membuat file php atau menduplikasi halaman standar.php. Kemudian simpan dengan nama lain, misalnya templates_my.php. Kemudian tambahkan komentar di bagian atas file:
Langkah selanjutnya adalah mengunggah file ke tema Anda, masuk ke panel admin di tab “Halaman - Tambah Baru” atau Anda dapat membuka yang sudah ada. Pada atribut halaman, pilih template mana yang akan digunakan pada halaman ini.
Jika tiba-tiba Anda tidak memiliki panel “Atribut Halaman”, cukup centang kotak di pengaturan layar di sudut kanan atas untuk menampilkannya.
Penggunaan massal berarti templat jenis ini dapat diterapkan ke halaman mana pun di situs. Berbeda dengan khusus, yang dibuat dengan pengidentifikasi atau label halaman tertentu.
Nasihat. Templat yang dibuat dengan cara ini dapat ditempatkan di subfolder dari tema saat ini. Jadi, tanpa memakan ruang ekstra dan menciptakan tampilan kompak.
Penting. Jangan gunakan awalan halaman- sebagai nama halaman templat. Karena WordPress akan menafsirkan file tersebut sebagai file khusus, yang jelas hanya berlaku untuk satu halaman.
Templat Halaman Kustom
Cara kedua ditujukan hanya untuk halaman tertentu saja tanpa terkecuali. Mari kita beri contoh menggunakan skema lama. Katakanlah Anda memiliki halaman bernama "Portofolio", secara default labelnya diterjemahkan ke dalam kata bahasa Inggris "portofolio". Ini dapat dilihat pada pengaturan “Page-Properties”. Sekarang kita cukup menduplikasi file page.php dan mengganti namanya menjadi page-portfolio.php.
ID dibuat dengan cara yang persis sama, hanya ID halaman yang menggantikan label. Letaknya di bilah alamat, bagian “Edit Halaman” terlihat seperti ini post=9 . Dengan cara yang sama, file standar diduplikasi dan diganti namanya menjadi halaman-9.php.
Penting. Templat dengan jenis yang sama yang dibuat hanya untuk halaman tertentu tidak dapat ditempatkan di subfolder tema. Persis sama seperti di tema anak.
Contoh praktis membuat templat halaman
Sekarang, sebagai contoh, mari buat templat berdasarkan opsi pertama dan ubah perulangan di dalamnya dengan menambahkan keluaran kategori dengan catatan. Buka editor apa saja, tambahkan kode di bawah ini, simpan dengan nama template_my.php, dan unggah ke server.
- ">
Kategori-1
has_posts()) : $the_query -> the_post(); ?>- ">
Kategori-2
has_posts()) : $the_query -> the_post(); ?>- ">
Kategori-3
has_posts()) : $the_query -> the_post(); ?>Sekarang Anda perlu menulis gaya di file style.css
My_main ( box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); margin: 20px otomatis; padding: 15px; latar belakang: #fff; lebar:1000px; ) .page_cat ( margin: 0 9px 20px; padding: 15px; perataan vertikal: atas; lebar: 28%; .page_cat h2 ( warna: #676767; font: tebal 18px arial; margin-bawah: 20px; ) .page_cat li a ( dekorasi teks : tidak ada; warna: #2879af ; tampilan: blok; ) .page_cat li ( margin-bawah: 6px; bantalan: 3px 3px 3px 10px; tampilan: blok; ) .page_cat li a:hover ( dekorasi teks: garis bawah; ) . 2n) ( latar belakang: #f7f7f7; )
Hanya ada satu hal yang harus dilakukan: di panel admin, di tab "Edit Halaman", tentukan "template contoh" template yang kami buat sebelumnya di atribut halaman.
Hasil.
Tag halaman bersyarat
Di paragraf terakhir, kita akan mempertimbangkan beberapa tag kondisional. Mereka ditulis dalam file page.php standar.
Menampilkan elemen pada halaman tertentu
/gambar/img.png"/> /gambar/img.jpg"/> /gambar/img.jpg"/> /gambar/img.jpg"/>
keluaran informasi