Cara Membuat Template Wordpress Bagian 1 - Persiapan

Cara Membuat Template Wordpress Bagian 1 - Persiapan


Salam. Mungkin banyak dari Anda yang web designer, yang sudah sekian lama bergelut di bidang html dan css, ingin sekali tau cara membuat template wordpress  sendiri, tanpa mengerti bagaimana caranya, kalaupun tutorialnya ada itu pun dengan segala keterbatasan.

Pengen Belajar Web Development HTML CSS JQuery Javascript Codeigniter Lebih Lengkap, Mudah, dan Lebih Terstruktur?

Pake Modul Video Tutorial Interaktif Mudah Jelas Gamblang, Nggak Pakai Ribet, Kenapa Video? Kalo Ebook Atau Buku Tebelnya minta ampun Gan. Mumpung Ada Promo, Beli Sekarang Dah Gan!! Promo Tutorial Premium Mahir Web Development Bangun 5 Project Website + Mahir Membuat 4 Aplikasi Android + Bonus Tutorial Membuat Themes Wordpress Premium, 3 Tutorial Isi 5 Dvd Cuma Rp 150rb Aja Gan (harga normal Rp 296rb) !!! Terbatas Sampe 12 Februari 2020 (Yang Bikin Videonya Udah Pengalaman Di Web Development Lebih Dari 15 Tahun Gan!!) (Pemesanan bisa SMS/WA ke 0838 1157 5876, atau bisa pesan secara online di sini)


Tutorial kali ini penulis khususkan bagi Anda semua yang baru akan menginjak atau sudah lama di dunia web design, dan ingin tau caranya bagaimana cara membuat template wordpress sendiri.

Di tutorial bagian pertama ini kita akan mempelajari bagaimana dasar-dasar dalam melakukan pembuatan template wordpress. Mengapa wordpress? Banyak sekali alasannya, selain karena wordpress dapat dikostumisasi secara maksimal, web designer pemula pun dengan mudah membuat templatenya.

Meskipun mudah, tapi hal yang paling utama di butuhkan adalah logika. Jadi dari sekarang mainkan logika Anda.

Ada beberapa yang perlu di persiapkan dalam pembuatan template wordpress...

Pastikan Anda sudah menginstall xampp dan wordpress terlebih dahulu, misalkan letaknya ada di  :

x:/xampp/htdocs/wplabz

ini adalah letak folder wordpress bagi Anda yang menggunakan xampp , diluar dari xampp silahkan di sesuaikan

 

Langkah 1

Di haruskan menyediakan satu buat template karya Anda sendiri, lalu tempatkan folder template Anda yang berisi file-file HTML, CSS,  gambar-gambar dan lain lain, letakkan di

x:/xampp/htdocs/wplabz/wp-content/themes

Struktur filenya kurang lebih seperti ini nantinya :

  1. Folder images,
  2. index.html,
  3. style.css

wp

Jika struktur file template Anda masih belum seperti itu maka silahkan di sesuaikan , jika ada file-file tambahan yang lain biarkan saja. Tapi jelasnya file css untuk template nya bernama style.css jika ada yang meletakkan di dalam folder atau file css nya memiliki nama yang berbeda silahkan di sesuaikan dan di rapikan.

 

Langkah 2

Yang paling utama dari template wordpress adalah file index.php dan style.css nya. Namun sistem wordpress mendeteksi nama, jenis, deskripsi, dan pembuat template ada dibagian header dari file style.css seperti apakah ??

/*  

Theme Name: TemplateSayah

Theme URI: http://www.ilmuwebsite.com

Description: Ini adalah template percobaan gan!

Author: Loka Dwiartara

Author URI: http://facebook.com/loka.dwiartara

Version: 1

*/

 

Silahkan masukkan script tersebut di bagian paling Atas dari file style.css

script

Kemudian jika bagian template utama nama filenya adalah index.html maka silahkan diganti terlebih dahulu menjadi index.php

Bagi Anda yang ingin mendalami konversi template html dan css ke dalam template wordpress, atau cara membuat template wordpress sendiri dari nol. Kami menyediakan Video Tutorial + Ebook. Berjudul "IW Course: Konversi HTML&CSS Ke Wordpress - WP Themes Development". Mengantarkan Anda menjadi master dalam Wordpress Themes Development. Terdiri dari 10 BAB Pembahasan, membuat template wordpress profesional, beserta admin panelnya. Klik disini untuk memesan IW Course: Konversi HTML&CSS Ke Wordpress - WP Themes Development

 

Setelah itu silahkan masuk ke dalam admin wordpress dan masuk ke bagian :
Appearance > Themes

result

 

http://localhost/wplabz/wp-admin/themes.php

dan lihat hasilnya ...

kita akan lanjut di pertemuan selanjutnya ...

silahkan download file latihannya di sini

http://www.ilmuwebsite.com/wp-content/uploads/2013/11/coolblue-template.rar

Begitulah tutorial bagaimana cara membuat template wordpress sendiri...  Silahkan lanjutkan ke tutorial Cara Membuat Template WordPress Bagian 2 – Header

 

Loka Dwiartara
Ilmuwebsite Staff

 

Artikel Terkait :