Tips Mempercepat Loading Blog (Part II)

Pada tutorial sebelumnya, saya juga membahas tentang tips mempercepat loading blog dengan mengkompress kode css, namun hasilnya tidak terlalu jauh berbeda dengan sebelum di kompress.

 

Berbeda dengan yang akan saya jelaskan kali ini, saya akan coba memberikan tips mempercepat loading blog dengan cara menyimpan kode css di tempat hosting gratis.

 

Kecepatan loading yang dihasilkan lumayan cukup signifikan dengan sebelum kode css di simpan di hosting gratis. Caranya sangat mudah, namun sebelumnya sobat harus punya dulu hosting yang akan dijadikan tempat menyimpan kode css-nya. Tidak perlu bayar, yang gratisan banyak kok, sobat bisa coba di Google Code. Silahkan daftar dulu, sudah daftar? baiklah sekarang ikuti langkah-langkahnya berikut ini :

 

1. Login ke blogger.

    

2. Silahkan tuju Elemen Halaman.

    

3. Klik Edit Template.

    

4. Biasakan backup template dulu sebelum melakukan perubahan.

    

5. Lalu klik Expand Template Widget.

    

6. Perhatikan kode css milik sobat, saya akan berikan sedikit contoh :

    

   #header {
       width: 960px;
       height: 150px;
       color: #888888;
       background:#000;
       font-size: 14px;
       font-weight: normal;
       margin: 0px auto;
       padding: 0px;
       overflow: hidden;
       position: relative }
   

   #header p {
       padding: 0px 0px 5px 0px;
       margin: 0px;
       line-height: 20px }

   
   #header h1 {
       color: #FFFFFF;
       font-size: 35px;
       font-family: Times New Roman, Georgia, Trebuchet MS;
       font-weight: normal;
       margin: 0px;
       padding: 20px 0px 0px 0px;
       text-decoration: none }

   
   #header h1 a, #header h1 a:visited {
       color: #EEEEEE;
       font-size: 40px;
       font-family: Times New Roman, Georgia, Trebuchet MS;
       font-weight: normal;
       margin: 0px;
       padding: 20px 0px 0px 0px;
       text-decoration: none }

   
   #header h1 a:hover {
       color: #CCCCCC;
       text-decoration: none }

    

7. Sudah ketemu kan? nah sekarang buka notepad, lalu copy paste semua kode css milik sobat kedalam notepad.

    

8. Setelah itu simpan file tersebut dalam bentuk css, sebagai contoh sobat bisa simpan dengan nama style.css

    

9. Sekarang login ke hosting gratis yang sudah sobat daftarkan tadi, kemudian upload file style.css ke hosting tersebut.

    

10. Setelah upload berhasil, sobat akan mendapatkan kode url, contoh seperti punya saya :

     

    http://miscah.googlecode.com/files/header.css

     

11. Kemudian ubah kode url tersebut menjadi seperti ini :

     

    <link href='http://miscah.googlecode.com/files/header.css' rel='stylesheet' type='text/css'/>

     

12. Dan letakkan kode tersebut tepat setelah kode ]]></b:skin>

     

13. Sehingga hasilnya menjadi seperti berikut ini :

     

    ]]></b:skin>
    

    <link href='http://miscah.googlecode.com/files/header.css' rel='stylesheet' type='text/css'/>

    </head> 
    

     

14. Jangan lupa Simpan Template.

 

Mudah kan, iya siapa bilang susah. Yang bilang susah berarti orang yang malas berpikir. Oke deh selamat mencoba !