Hal ini tentunya membuat blog kita kurang diminati oleh pengunjung. salah satu alternatifnya yaitu dengan membuat file CSS / JavaScript ke dalam file tersendiri dan menguploadnya ke Hosting yang berbeda,
sehingga dapat dengan mudah menerapkannya pada situs blog. Sayangnya, blogger memiliki beberapa keterbatasan yang membuat kita tidak bisa meng-Host file CSS dan JavaScript.
Untungnya, Google Drive menyediakan kita kesempatan untuk meng-Host file CSS, JavaScript dan HTML secara GRATIS. Pada artikel kali ini, saya akan menunjukkan Bagaimana cara meng- Host file CSS dengan Google Drive di Blogger.
Apa Keuntungan dari Hosting CSS / JavaScript dalam satu file?
Blogger tidak memberikan penggunanya fleksibilitas untuk meng- Host file CSS atau JavaScript dalam satu link terpisah. Blogger menyimpan semua coding melalui HTML Tag.Untuk StyleSheet, tag <style> ini digunakan untuk mendefinisikan informasi gaya / desain untuk dokumen HTML. Kode CSS digunakan untuk menentukan bagaimana setiap elemen HTML harus ditampilkan di web browser. Setiap dokumen HTML dapat berisi beberapa tag <style>.
Untuk tag <script> JavaScript digunakan untuk mendefinisikan script, seperti JavaScript. Tag <script> baik yang berisi pernyataan scripting atau yang menunjuk ke suatu file eksternal (link) melalui atribut "src". Setiap dokumen HTML dapat berisi beberapa tag <script>.
Menggabungkan semua kode StyleSheet (CSS) / JavaScript ke dalam satu file akan membuat sebuah website / blog untuk memuat / loading lebih cepat. Selain itu, membantu mesin pencari (search engine) untuk menjelajah / meng- index situs situs kita dengan mudah dan lancar, sehingga dapat meningkatkan SEO blog / website.
Cara meng- Host file CSS / JavaScript Blogger dengan Google Drive
1. Copy kode CSS di dalam Template blog
- Login ke dashboard blogger
- Klik Template >> Edit HTML, kemudian cari kode <b:skin><![CDATA[
- Copy semua kode CSS yang ada mulai dari setelah tag <b:skin><![CDATA[ sampai sebelum tag ]]></b:skin>
2. Menyiapkan file CSS
- Buka Notepad atau Notepad ++ lalu paste kode CSS yang telah di copy dari template kedalam Notepad
- Lalu simpan dengan ekstensi .css
3. Host file CSS ke Google Drive
- Buka halaman Google Drive disini
- Lalu login dengan menggunakan akun Gmail
- Klik tombol Create >> Folder, lalu berinama webhost atau sesuai yang kita mau
- Klik folder yang telah kita buat, lalu klik Upload Icon >> Files...
- Pilih file CSS yang telah disimpan tadi
- Setelah file terupload, klik Share >> pilih Public on the web >> Save
4. Mengcopy Link file CSS untuk blogger
- Klik Kanan di file CSS yang di upload tadi lalu pilih Share >> Share
- Copy link file CSS lalu paste di notepad, linknya akan seperti https://docs.google.com/file/d/your-file-code/
- Ganti menjadi https://googledrive.com/host/your-file-code
5. Menambahkan File CSS yang terlah di Host ke Blogger
- Pastikan membackup template sebelumnya
- Masuk ke Dashboard Blogger >> Klik Template >> Edit HTML
- Pastikan semua kode CSS telah dihapus pada template
- Cari kode <head>, lalu paste kode di bawah ini
<link href='https://googledrive.com/host/your-file-code' rel='stylesheet'/> - Ganti https://googledrive.com/host/your-file-code dengan link file CSS anda.
- Klik Save Template
No comments:
Post a Comment