membuat template blog sederhana dengan bootstrap

Membuat Template Blog Sederhana Dengan Bootstrap


Membuat Template Blog Sederhana Dengan Bootstrap

Membuat Template Blog Sederhana Dengan Bootstrap – Template website adalah salah satu yang terpenting. template mencerminkan mutu atau kualitas dari blog itu sendiri. karena saat user mengunjungi sebuah website atau blog maka yang pertama kali di lihat adalah tampilan dari website tersebut. bagaimana jika website tersebut memiliki tampilan yang kurang menarik? dan tentu akan menjadi nilai lebih jika tampilan template website tersebut sangat bagus. apalagi responsive, tetap rapi jika di buka dari segala platform.

Tentu dari permasalah di responsive di atas, bootstrap telah lama menjadi solusi nya. dengan menggunakan bootstrap kita tidak perlu lagi mengurusi keresponsive-an template website kita. kita tinggal menggunakan fitur grid yang sudah tersedia pada bootstrap. untuk tutorial grid system sendiri telah kita bahas pada tutorial bootstrap sebelumnya di www.malasngoding.com. (baca : tutorial grid system bootstrap).

Sebenarnya artikel Membuat Template Blog Sederhana Dengan Bootstrap ini merupakan tutorial lanjutan dari tutorial-tutorial dasar bootstrap yang telah di bahas di www.malasngoding.com. jadi kita akan mencoba menggabungkan setiap element komponen bootstrap yang telah kita pelajari cara pembuatan nya dengan bootstrap, menjadi sebuah template website sederhana. dan renponsive tentunya.

Adapun tutorial bootstrap lainnya yang berhubungan dengan tutorial membuat template website dengan bootstrap ini adalah :

Dalam penjelasan tutorial ini tidak lagi di jelaskan secara mendetail tentang component bootstrap seperti pada poin atas.  teman-teman dapat mempelajari nya sendiri di malasngoding.com.Membuat Template Blog Sederhana Dengan Bootstrap

Persiapan Membuat Template Blog Sederhana Dengan Bootstrap

Adapun beberapa persiapan yang harus di siapkan adalah:

  • Bootstrap. download di sini.
  • Beberapa file gambar(untuk cover posting).

Membuat Template Website Sederhana Dengan Bootstrap

Setelah teman-teman download bootstrap dan menyediakan beberapa file gambar. letakkan di dalam satu directory. seperti gambar di bawah.

membuat template blog sederhana dengan bootstrap

membuat template blog sederhana dengan bootstrap

Dan isi folder gambar nya, saya menyediakan beberapa file gambar.

membuat template website

membuat template website

Langsung saja kita mulai membuat template website sendiri sederhana dengan bootstrap. di sini kita akan membuat halaman depan(index) dan halaman single post(single).

index.html

jalankan pada browser. dan hasilnya.

membuat template sederhana dengan bootstrap

membuat template sederhana dengan bootstrap

Dan tampilan responsive nya jika di buka dari ukuran layar smartphone. Membuat Template Blog Sederhana Dengan Bootstrap.

membuat template dengan bootstrap

membuat template dengan bootstrap

klik pada login atau daftar. di sini kita menggunakan modal.

membuat modal login dengan bootstrap

membuat modal login dengan bootstrap

Membuat halaman single

single.html

dan jalankan pada browser. Membuat Template Blog Sederhana Dengan Bootstrap.

membuat template responsive dengan bootstrap

membuat template responsive dengan bootstrap

Template telah jadi. mungkin sekian saja tutorial kali ini tentang cara membuat template sederhana sendiri dengan bootstrap. semoga dapat bermanfaat. terima kasih sudah berkunjung.

Incoming search terms:

  • download template bootstrap sederhana
  • cara membuat template
  • membuat blog dengan bootstrap
  • bootstrap sederhana
  • Cara membuat template blog
  • malesngoding
  • membuat template bootstrap
  • cara membuat template website dengan bootstrap
  • template bootstrap sederhana
  • membuat template blogger dengan bootstrap




About the author
Diki Alfarabi Hadi

Coding enthusiast. Someone who love learn something new. especially about web programming and web design. happy to share about knowledge and learn from other.


Discussion
  • 5 Comments

Write a Comment

Your email address will not be published. Required fields are marked *


CENTANG untuk bisa mengirimkan komentar. [ Verifikasi bukan robot ]