Blog

Cara Membuat Tema WordPress Dengan Bootstrap

Cara Membuat Tema WordPress Dengan Bootstrap

Cara Membuat Tema WordPress Dengan Bootstrap

09 Mei 2019

Untuk membuat Tema WordPress, kita dapat menggunakan base template atau yang biasa disebut dengan template dasar. Dengan template dasar ini, struktur direktori sebuah template sudah disediakan secara langsung, kita cukup mendesainnya saja tanpa harus memikirkan struktur foldernya seperti apa.Untuk itu, kodi memberikan beberapa rekomendasi base template yang bisa kamu gunakan untuk membuat template WordPress menggunakan Bootstrap, yuk langsung check aja! 

UnderStrap menggabungkan tema Underscore (yang dibuat oleh Automattic) yang sudah mendukung responsiveweb desain yaitu Bootstrap 4 (oleh Twitter) menjadi framework yang sempurna untuk proyek theme WordPress kamu.

Coba  personally menggunakan base template ini karena sudah tersedia banyak fitur seperti :

1.      SASS
Memanfaatkan tools SASS untuk mempermudah pembuatan stylesheet, yang membuat mengganti warna, font, stylings dll menjadi mudah

2.      NPM
Dilengkapi dengan dukungan NPM untuk mengelola semua dependensi. Hanya satu perintah yang bisa kamu jalankan di terminal kamu untuk memperbarui semua aset.

3.      Gulp
Dilengkapi dengan Gulp sebagai task runner dan satu file gulpfile.js dengan beberapa tugas default. Misalnya untuk mengkompilasi SASS ke CSS.

Sage, yang dibuat oleh Roots, merupakan base template kedua rekomendasi saya. Template ini hampir sama dengan Understrap, hanya saja template ini tidak berdasarkan oleh Underscore yang dibuat oleh WordPress. Ada beberapa fitur juga dalam base template Sage yang sangat membantu kita dalam proses development :

1.      Menulis stylesheet dengan Sass

2.      Secara otomatis memeriksa kode JavaScript kamu dari error

3.      Mengoptimalkan gambar, memungkinkannya pengujian browser tersinkronasi, dan lainnya dengan setup gulp yang disediakan oleh template

4.      Sage hadir dengan versi terbaru dari Bootstrap.

5.      Template didasarkan pada HTML5 Boilerplate.