Membuat Theme Wordpress Dari Awal

September 07, 2019 • ☕️ 2 min read

Kali ini saya akan belajar menulis tentang bagaimana cara membuat theme wordpress dari awal.

Langkah Awal dalam Membuat Template Wordpress

Adapun yang harus kita persiapkan untuk membuat template wordpress yaitu:

  1. Kita Sudah memahami dasar HTML, CSS, Javascript/Jquery Dan PHP
  2. Text Editor Seperti Sublime - Visual Studio atau Atom
  3. Wordpress yang sudah terinstall di localhost, yang belum bisa install kita bisa menggunakan Local By Flyewheel untuk membuat wordpress di localhost dengan cepat

Pemahaman terhadap kote HTML,CSS,Javascript/Jquery dan Juga PHP akan sangat Membantu kita dalam pembuatan template wordpress

Struktur Awal Template

di wordpress theme akan di simpan pada direktori wp-content/theme. Di sanalah kita akan membuat theme baru.

sebagai contoh saya membuat folder dengan nama rickyjanuari.com untuk di jadikan theme

alt text

di folder tersebut kita akan menyimpan semua file theme di dalam folder tersebut. Pada Tahapan Awal pembuatan tema ini, kita buat terlebih dahulu 2 file pengting, yaitu:

  1. index.php
  2. styles.css

File index.php ini adalah file utama yang akan diakses saat website di buka. sementara itu, file styles.css ini berisis kode CSS untuk menghias dan mengatur tampilan theme

Sekarang ayo kita isi file index.php seperti ini

<!DOCTYPE html>
<html>
  <head>
    <title>Theme Wordpress Pertama Saya</title>
    <body>
      <h1>Hello Jomblo. ini adalah theme wordpress pertama saya</h1>
      <p>dibuat dari awal dengan penuh semangat</p>
    </body>
  </head>
</html>

dan kita isi file style.css

/*
Theme Name: rickyjanuari
Author: Ricky Januari
Author URI: https://rickyjanuari.com
Version: 0.1
Description: Theme ini untuk belajar membuat theme dari awal
*/

Perhatikan Baik Baik

Di dalam kode style.css ini berisi komentar yang akan menjadi meta data atau keterangan dari theme

  • Theme Name Untuk memberi Nama Theme
  • Author untuk memberi nama pembuat theme atau developer theme
  • Author URI untuk membari alamat website pembuat theme
  • Version memberi versi theme
  • Description adalah keterangan singkat tentang theme anda

Uji Coba Theme Wordpress yang baru kita buat


Sekarang Saatnya kita untuk uji coba theme wordpress yang baru kita biat

Kita Masuk Terlebih dahulu ke wp-admin->appreance->theme, disana kita akan menembukan sebuah theme tanpa gambar thumbnail dengan tanda kota merah. itu adalah theme yang baru yang kita buat. Coba aktipkan tema tersebut

alt text

Setelah itu. kita coba buka website wordpress nya

alt text

Selamat File index anda sudah terbaca

Next ?

Di Tulisan selanjutnya kita akan membuat header dan footer serta menambahkan css