Cara menggunakan custom html page wordpress

Ketika Anda membuat sebuah web berbasis wordpress khususnya ketika Anda membuat template Wordpress sendiri dengan bentuk sesuai yang Anda inginkan, Maka Anda juga perlu tahu bagaimana cara membuat custom page ini.


Untuk membuat sebuah halaman kustom, Anda cukup membuat satu buah file PHP kemudian isikan file PHP tsb dengan kode berikut dibagian paling atas:

<?php
/* Template Name: nama_halaman */
?>


setelah Anda mengisikan kode diatas baru Anda dapat mengisi halaman kustom tsb dengan konten yang Anda inginkan.

misal saja kita akan membuat halaman portfolio maka beri nama file tsb portfolio.php letakan file tsb di folder utama template yang Anda buat 


wordpress > wp-content > themes > folder_tema_Anda > portfolio.php


dan isi portfolio.php tsb adalah seperti gambar berikut :


<? php
/* Template Name: portfolio */
?>

<? echo "Ini adalah isi halaman Portfolio"; ?>



Cara menggunakan custom html page wordpress



Setelah Anda isi file portfolio.php dengan kode diatas selanjutnya adalah buka Halaman Administrator Wordpress Anda melalui browser

http://localhost/wordpress/wp-admin/


Kemudian di halaman Adminstrator atau yang lebih kerennya disebut Back End pilih Page > Add New  kemudian beri nama page baru Anda (misal Portfolio) dan biarkan isi page tetap kosong, Lihat pada page attributes > template  akan muncul portfolio dari file PHP yang telah kita buat tadi. Pilih portfolio tersebut dan klik publish.

Secara default, WordPress telah menyiapkan sebuah theme gratis yang dapat kita pakai untuk membuat sebuah website. Setiap theme tersebut sudah tersedia satu file khusus untuk menghandle tampilan sebuah halaman atau page. Namun, semua konten page akan mempunyai tampilan yang sama satu sama lain atau generik, yang membedakan hanya konten isinya saja. Nah bagaimana jika ada kebutuhan untuk membuat sebuah page khusus yang mengharuskan mempunyai tampilan yang berbeda dari halaman lain? Solusinya adalah custom page.

Membuat custom page di WordPress tergolong sangat mudah, tapi dengan catatan kamu sudah mempunyai halaman yang sudah siap untuk ditampilkan. Jika belum bagaimana? Tidak masalah karena saya hanya akan menunjukan bagaimana cara membuat custom page di WordPress. Pada artikel kali ini saya akan memakai theme bawaan WordPress yaitu Twenty Nineteen. Dan berikut list file yang tersedia pada theme Twenty Nineteen tersebut.

Cara menggunakan custom html page wordpress

Untuk membuat custom page baru, kamu perlu membuat satu file baru didalam folder theme tersebut. Seperti berikut:

Cara menggunakan custom html page wordpress

Pada contoh kali ini saya membuat file baru dengan nama “custom-page-test.php”. Menggunakan nama “custom” di depan nama file untuk menandakan bahwa file tersebut adalah file yang akan digunakan untuk menghandle halaman custom. Setelah itu isi file tersebut dengan kode berikut:

<?php
/*
Template Name: Test Page
*/
?>
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Test Page</title>
    </head>
    <body>
        <p>Ini adalah custom page WordPress.</p>        
    </body>
</html>

Pada kode tersebut, kita telah membuat satu custom page dengan nama Test Page. Setelah disave, sekarang kamu coba buat sebuah halaman baru melalui dashboard WordPress. Caranya dengan mengakses url http://namadomain.com/wp-admin. Nama domain disesuaikan dengan nama website kamu ya. Tidak masalah jika kamu masih menggunakan localhost.

Jika sudah login ke dashboard, pilih menu Pages dan klik tombol Add New.

Cara menggunakan custom html page wordpress

Jika sudah akan muncul tampilan untuk membuat halaman baru. Nah disebelah kanan bawah halaman terdapat box dengan judul Page Attributes. Kamu klik pilihan template yang dapat dipakai seperti gambar dibawah ini:

Cara menggunakan custom html page wordpress

Dipilihan tersebut akan muncul opsi Test Page. Jika kamu memilih opsi tersebut, maka halaman yang kamu buat saat ini akan memakai tampilan dari Test Page tersebut. Hasilnya sebagai berikut:

Cara menggunakan custom html page wordpress

Sampai sini kamu sudah berhasil untuk membuat sebuah custom page sederhana. Mudah bukan? Kamu dapat membuatnya lebih baik lagi dengan menambahkan CSS dan JavaScript sebagai pelengkapnya. Kamu juga dapat menjalankan kode PHP untuk menarik data dari database dihalaman custom page tersebut.

Apakah WordPress menggunakan HTML?

Seperti yang Anda ketahui, WordPress menggunakan empat bahasa pemrograman yang berbeda, yaitu HTML, CSS, PHP, dan JavaScript. Setiap bahasa memiliki kode sendiri dan memiliki fungsi yang berbeda. Misalnya, HTML menangani struktur konten dan CSS mengelola tampilan.

Program apa saja yang dapat digunakan untuk mengedit HTML?

Berikut ini beberapa aplikasi text editor lainnya yang bisa digunakan untuk belajar penulisan kode HTML..
Notepad++.
BracketsText..
Sublime Text Editor..
Visual Studio Editor..
Emacs..
Netbeans..
Aptana Studio..

Apa itu Page di WordPress?

Pengertian dan Fungsi Page WordPress Page adalah sebuah halaman statis pada sebuah website. Sebuah page atau laman merupakan konten yang bersifat timeless atau tidak terikat waktu. Halaman atau konten satu ini juga jarang mendapatkan perubahan karena itulah disebut sebagai halaman statis.