Hi ketemu lagi nih, kali ini kita akan membahas tentang tutorial bagaimana membuat blog menggunakan CodeIgniter, yang kita bahas disini lebih ke arah frontend atau halaman depan dari blognya. Untuk modul backend insyaallah akan saya buatkan tulisan lain ya. Tulisan ini adalah tulisan pertama saya dalam seri Tutorial Membuat Blog Menggunakan CodeIgniter.
Sebagai gambaran blognya nanti akan ada beberapa bagian yaitu:
1. Halaman about me
2. Halaman home dengan isi daftar postingan blog
3. Halaman kategori (untuk menampilkan postingan berdasarkan kategori tertentu)
4. Halaman detail yaitu halaman detail dari postingan blog ketika di klik
1. Mendownload CodeIgniter
Sebagai awal kita harus mendownload CodeIgniter, versi dari CodeIgniter yang saya gunakan adalah 3.1.11 untuk download silahkan melalui download CodeIgniter versi 3.1.11. Selanjutnya kalian ekstrak file zip tersebut ke root htdocs kalian lalu ganti nama folder dengan nama "blog_ci". Lalu kalian buka alamat "http://localhost/blog_ci" dan jika tidak ada kesalahan maka akan muncul seperti gambar dibawah ini.
2. Setup Database MySQL
Langkah selanjutnya adalah melakukan setup database, untuk melakukannya kalian bisa buat sebuah database melalui phpmyadmin dengan nama "blog_ci" lalu eksekusi sql dibawah ini.
3. Konfigurasi CodeIgniter
Sebagai awal ada beberapa hal yang perlu kita konfigurasi di CodeIgniter yang telah kita download tadi.
a. Enable Helper Url
Helper url ini digunakan agar kita bisa menggunakan function "base_url()" pada template file kita agar bisa memanggil base url pada CodeIgniter untuk keperluan load file CSS atau JS. Untuk melakukannya silahkan buka file "application/config/autoload.php" lalu cari code ini
Lalu rubah menjadi seperti dibawah ini.
b. Konfigurasi index_page
Kedua hal ini berguna agar url blog yang kita buat lebih ramah SEO dengan menghilangkan "index.php". Untuk melakukan konfigurasi silahkan buka file "application/config/config.php" lalu cari baris dibawah ini.
Lalu rubah menjadi seperti dibawah ini
c. Konfigurasi base_url.
Lalu kalian cari baris dibawah ini untuk melakukan set base_urlnya.
Lalu rubah menjadi seperti dibawah ini.
Lalu jangan lupa kalian membuat file .htaccess untuk mendukung konfigurasi index.php yang telah kita hapus tadi, untuk detailnya silahkan lihat pada tulisan menghilangkan index.php pada CodeIgniter.
2. Membuat Halaman Home
Setelah persiapan panjang yang telah kita lakukan tadi, berikutnya kita sudah masuk kedalam pembuatan halaman home pada blog kita. Halaman blog ini akan memiliki beberapa elemen yaitu:
- Daftar tulisan
- Menu navigasi
- sidebar berisikan kategori dan search box
- footer berisikan informasi websitenya
Untuk lebih jelasnya silahkan lihat gambar dibawah ini
Konfigurasi Koneksi Database
Untuk menghubungkan CodeIgniter ke database MySQL yang telah kita buat tadi, kita harus mengupdate file yang ada di "application/config/database.php" untuk lebih jelasnya lihat potongan kode dibawah ini.
Lalu sesuaikan ke empat baris tersebut dengan konfigurasi akses database MySQL milik kalian, sebagai contoh lihat code dibawah ini.
Untuk "username" dan "password" gunakan seperti konfigurasi untuk mengakses database anda, sedangkan "database" kalian isi dengan blog_ci.
Sebelum melanjutkan kalian harus mengupdate file "application/config/autoload.php" untuk mengaktifkan library database, lihat pada baris
Silahkan kalian rubah seperti dibawah ini
Buat Core MY_Model
Buatlah sebuah file dengan nama "MY_Model.php" pada folder "application/core/" lalu copy code dibawah ini.
Mengupdate Controller Welcome
Setelah merubah pada bagian konfigurasi database CodeIgniter, berikutnya kalian perlu merubah isi file yang ada di "application/controllers/Welcome.php" pada bagian dibawah ini Hal ini dilakukan agar controller default kita (dalam hal ini adalah controller Welcome) akan meload file view dengan nama blog.
Setelah itu buatlah file dengan nama "blog.php" pada folder "application/views/" lalu isi dengan code dibawah ini.
Selanjutnya kita perlu membuat 2 buah model Blogpost_model.php dan Categories_model.php. Silahkan kalian buat file dengan nama "Blogpost_model.php" pada folder "application/models/" lalu isi dengan code dibawah ini.
Lalu buat file dengan nama "Categories_model.php" pada folder yang sama yaitu di "application/models/" lalu isi dengan code dibawah ini.
Lalu silahkan kalian buka browser kalian maka akan muncul halaman home blogpost dengan beberapa postingan dengan sidebar dengan isi kategori, search box dan footer, untuk lebih jelasnya silahkan lihat gambar dibawah ini ya
Pada tulisan selanjutnya kita akan bahas tentang pembuatan halaman detail blog. Silahkan tunggu tulisan selanjutnya ya.
Download source code Tutorial Membuat Blog dengan CodeIgniter.
Buat kalian yang udah coba dan ada pertanyaan jangan sungkan untuk bertanya disini ya
Sebagai gambaran blognya nanti akan ada beberapa bagian yaitu:
1. Halaman about me
2. Halaman home dengan isi daftar postingan blog
3. Halaman kategori (untuk menampilkan postingan berdasarkan kategori tertentu)
4. Halaman detail yaitu halaman detail dari postingan blog ketika di klik
1. Mendownload CodeIgniter
Sebagai awal kita harus mendownload CodeIgniter, versi dari CodeIgniter yang saya gunakan adalah 3.1.11 untuk download silahkan melalui download CodeIgniter versi 3.1.11. Selanjutnya kalian ekstrak file zip tersebut ke root htdocs kalian lalu ganti nama folder dengan nama "blog_ci". Lalu kalian buka alamat "http://localhost/blog_ci" dan jika tidak ada kesalahan maka akan muncul seperti gambar dibawah ini.
2. Setup Database MySQL
Langkah selanjutnya adalah melakukan setup database, untuk melakukannya kalian bisa buat sebuah database melalui phpmyadmin dengan nama "blog_ci" lalu eksekusi sql dibawah ini.
3. Konfigurasi CodeIgniter
Sebagai awal ada beberapa hal yang perlu kita konfigurasi di CodeIgniter yang telah kita download tadi.
a. Enable Helper Url
Helper url ini digunakan agar kita bisa menggunakan function "base_url()" pada template file kita agar bisa memanggil base url pada CodeIgniter untuk keperluan load file CSS atau JS. Untuk melakukannya silahkan buka file "application/config/autoload.php" lalu cari code ini
$autoload['helper'] = array();
$autoload['helper'] = array('url');
Kedua hal ini berguna agar url blog yang kita buat lebih ramah SEO dengan menghilangkan "index.php". Untuk melakukan konfigurasi silahkan buka file "application/config/config.php" lalu cari baris dibawah ini.
$config['index_page'] = 'index.php';
$config['index_page'] = 'index.php';
Lalu kalian cari baris dibawah ini untuk melakukan set base_urlnya.
$config['base_url'] = '';
$config['base_url'] = 'http://localhost/blog_ci/';
2. Membuat Halaman Home
Setelah persiapan panjang yang telah kita lakukan tadi, berikutnya kita sudah masuk kedalam pembuatan halaman home pada blog kita. Halaman blog ini akan memiliki beberapa elemen yaitu:
- Daftar tulisan
- Menu navigasi
- sidebar berisikan kategori dan search box
- footer berisikan informasi websitenya
Untuk lebih jelasnya silahkan lihat gambar dibawah ini
Konfigurasi Koneksi Database
Untuk menghubungkan CodeIgniter ke database MySQL yang telah kita buat tadi, kita harus mengupdate file yang ada di "application/config/database.php" untuk lebih jelasnya lihat potongan kode dibawah ini.
'hostname' => 'localhost',
'username' => '',
'password' => '',
'database' => '',
'hostname' => 'localhost',
'username' => 'root',
'password' => 'root',
'database' => 'blog_ci',
Sebelum melanjutkan kalian harus mengupdate file "application/config/autoload.php" untuk mengaktifkan library database, lihat pada baris
$autoload['libraries'] = array();
$autoload['libraries'] = array('database');
Buatlah sebuah file dengan nama "MY_Model.php" pada folder "application/core/" lalu copy code dibawah ini.
Mengupdate Controller Welcome
Setelah merubah pada bagian konfigurasi database CodeIgniter, berikutnya kalian perlu merubah isi file yang ada di "application/controllers/Welcome.php" pada bagian dibawah ini Hal ini dilakukan agar controller default kita (dalam hal ini adalah controller Welcome) akan meload file view dengan nama blog.
Setelah itu buatlah file dengan nama "blog.php" pada folder "application/views/" lalu isi dengan code dibawah ini.
Selanjutnya kita perlu membuat 2 buah model Blogpost_model.php dan Categories_model.php. Silahkan kalian buat file dengan nama "Blogpost_model.php" pada folder "application/models/" lalu isi dengan code dibawah ini.
Lalu buat file dengan nama "Categories_model.php" pada folder yang sama yaitu di "application/models/" lalu isi dengan code dibawah ini.
Lalu silahkan kalian buka browser kalian maka akan muncul halaman home blogpost dengan beberapa postingan dengan sidebar dengan isi kategori, search box dan footer, untuk lebih jelasnya silahkan lihat gambar dibawah ini ya
Pada tulisan selanjutnya kita akan bahas tentang pembuatan halaman detail blog. Silahkan tunggu tulisan selanjutnya ya.
Download source code Tutorial Membuat Blog dengan CodeIgniter.
Buat kalian yang udah coba dan ada pertanyaan jangan sungkan untuk bertanya disini ya