Cara mudah belajar pemrograman komputer

Selasa, 17 Maret 2015

Tutorial membuat theme wordpress sendiri


Wordpress merupakan sebuah content management system atau CMS yang sangat populer dikalangan web developer maupun blogger, bukan hanya karena wordpress merupakan CMS gratis namun juga karena wordpress sangat-sangat fleksibel dan mudah di customisasi serta memiliki dokumentasi yang lengkap dan dukungan forum yang begitu banyak. Tentu kita juga tidak dapat mengabaikan tentang banyaknya theme wordpress dari yang gratis hingga yang berbayar, anda tidak perlu ragu dengan keindahan dan kesesuaian theme wordpress bahkan yang gratis sekalipun. Lebih dari itu kita juga bisa menggunakan segudang fungsionalitas tambahan untuk menyesuaikan kebutuhan kita, cukup dengan memasang plugin yang jumlahnya ribuan dan kebanyakan gratis.
Selain itu pandangan pribadi saya tentang wordpress ini bukan hanya tentang kemudahan dan banyaknya fitur yang dapat kita nikmati gratis tetapi juga tentang bagaimana kita ingin membuat website atau blog kita yang berbasis wordpress ini menjadi sama sekali tidak terlihat seperti dibuat dengan wordpress, itulah sebabnya saya lebih suka menyebut wordpress sebagai development framework ketimbang CMS.

Salah satu bentuk nyata dari ke-fleksibel-an si wordpress ini adalah kita dapat membuat theme wordpress sendiri, sesuka hati kita untuk berkreasi dan menuangkan imajinasi sehingga tercipta suatu website yang indah dan sesuai dengan keinginan kita.

Dalam tulisan kali ini kita akan membahas tentang tutorial membuat theme wordpress sendiri dari nol. Bagimana langkah demi langkah dalam membuat theme wordpress ini. Simak dalam tutorial berikut ini.

Sebelum kita melanjutkan, saya akan membuat beberapa asumsi:
1. Anda sudah tahu bagaimana mendownload dan menginstall wordpress
2. Anda menguasai atau setidaknya mengerti css, html, dan php
3. Anda tahu bagaimana cara membuat folder, membuat file, dan menggunakan text editor.
Jika anda belum memenuhi syarat seperti asumsi yang saya berikan diatas, anda tetap dapat meneruskan membaca tulisan ini, namun mungkin anda akan sedikit mengerutkan dahi pada beberapa istilah dalam tulisan ini. Namun jangan khawatir, saya akan berusaha untuk membuat tulisan ini agar dapat dipahami oleh anda yang mungkin pada saat ini baru ingin memulai atau memasuki dunia pemrograman web.

Pertama tentu saja anda harus mendownload file CMS wordpress dari wordpress.org dan menginstallnya di web server local seperti xampp.
Setelah terinstall buka directory dimana theme wordpress diletakkan, bisanya didalam folder htdocs (C:\xampp\htdocs\wordpress\wp-content\themes). Jika anda berada di directory yang benar maka anda akan menemukan tiga buah folder dan satu buah file index.php



Selanjutnya buatlah satu buah folder baru pada directory tersebut dan berinama dengan nama tema yang anda inginkan misalnya : themewpsaya
Lalu buka folder tersebut.



Kemudian buka text editor anda dan buat tiga file didalam folder tersebut yaitu index.php, style.css, dan functions.php
Pada file style.css copy paste kode berikut ini.


/*
Theme Name: Theme Wordpress saya
Theme URI: http://goll.in/belajarthemplate;
Author: Programmer Goblog
Author URI: http://goll.in/
Description: Ini adalah template untuk belajar membuat theme wordpress dari programmer goBlog
Version: 1.0
*/



kemudian simpan.
Sampai pada tahap ini theme wordpress yang anda buat telah ada di sistem wordpress, anda dapat melihatnya melelui halaman admin pada menu Appearance -> themes. Kemudian kita coba aktifkan dengan click pada tombol activate diatas themes wordpress anda tadi.



Setelah anda mengaktifkan theme tadi coba buka website anda. Muncul halaman kosong? Yup karena kita memang belum menambahkan apapun pada theme kita tadi. Untuk mengujinya silahkan edit pada file index.php dan isi dengan konten html standar.

<html>
<head>
<title>Ini Template wordpress saya</title>
</head>
<body>
<h1>JUDUL WEBSITE SAYA</h1>
<p>Belajar bersama programmer goblog</p>
</body>
</html>



Sekarang buka lagi website anda. Sudah ada yang muncul? berarti theme anda sudah aktif. Sekarang kita bisa melanjutkan ke tahap selanjutnya.



Buka kembali file index.php dan tempatkan kode ini <?php wp_head();?> tepat dibawah tag <title>...</title>
Dan tambahkan kode <?php wp_footer();?> tepat diatas tutup tag </body>



Setelah itu anda kan melihat perubahan pada website anda yaitu munculnya menu bar pada bagian atas website anda. Seperti terlihat pada gambar dibawah ini.



Nah, sampai disini kita telah memiliki ide dasar tentang bagaimana cara membuat theme wordpress sendiri. Pada tulisan selanjutnya kita kan membahas lebih lanjut tentang bagaimana cara mebuat theme wordpress sendiri termasuk tentang bagaimana menampilkan menu, menampilkan post, menampilkan sidebar widget dll. So follow gplus Programmer goBlog untuk agar tidak ketinggalan info tulisan tersebut.

1 komentar:

Popular Posts

Recent Posts

Unordered List

Pages

Kunjungan

Diberdayakan oleh Blogger.