Catatan Adzkia

Menjaga kelestarian melalui ilmu pengetahuan

Membangun sendiri tema blogger dengan bootstrap, responsive dan user friendly (Bag. 1)

Aplikasi, Gadget, Komputer

Hai sobat blogger, salam html apakah kalian tahu tentang web / blogger yang enak dilihat dan enak di baca? web / blog yang user friendly di buka di manapun akan terlihat mewah baik di smartphone, PC / Laptop dan tablet. Oke kali ini saya akan membagikan bagaimana cara membuat blog dengan template bootstrap. Untuk membuat template bootstrap di blog yang pertama kita lakukan adalah memiliki blog agar kita bisa menerapkan template tersebut dalam blog. Mudah kok untuk membuat blog tinggal kita daftar ke blogger.com maka kita sudah memiliki sebuah blog yang dinamis dari google. Setelah kita mendaftar baru kita bisa menerapkan template dengan bootstrap tanpa mengunduh atau membeli template blog. Langsung saja bagaimana cara kita untuk membuat template blog sendiri berbasis bootstrap

Langkah pertama adalah buka blog kalian dan pilihlah tema, maka akan muncul banyak tema bawaan dari blogger. Lalu pada bagian atas ada menu sesuaikan tema dan klik pilih edit html maka akan muncul seperti pada gambar di bawah ini


Setelah muncul halaman editor tema blog maka kita akan mongotak atik di sini, tapi harus hati - hati jangan sampai menghapus kode yang riskan atau kode yang diperlukan oleh blog. Langkah selanjutnya kita pasang kode CSS (template web) dan Java Script dari bootstrap. Bagaimana kita mendapatkannya tentu saja kita pergi ke halaman Bootsrtap di sana kita bisa mengkopi CSS dan Java Script bootstrap secara gratis dan tidak berbayar. Copylah file CSS dan letakan di halaman editor HTML blog tadi. Untuk java script silakan lakukanlah seperti CSS.  atau kalian bisa mengkopy linkdi bawah ini

 CSS only

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> 
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
Kalian bisa copy kode di atas dan letakkan tepat di atas kode <head> dan hapuslah semua CSS yang berada di halaman editor html tersebut agar pembuatan tidak diganggu dengan kode css untuk proses penggantian dengan bootstrab berlanjut pada artikel berikutnya (bag. 2)
Aplikasi, Gadget, Komputer

Created By Adzkia Design Copy right®️ 2018 -