Welcome To My Blog Software And Tips Blog | Free Download Sofware, Tips And Trik Serta Artikel Menarik Lainnya. ==> 'Copas jika perlu' ==> Don't forget to leave your footproof and thank you for visiting,,, "I hope your day more beautiful than ever"

16 June 2011

Tips Cara Mempercepat Loading Blog dengan CSS External

kali ini kita membahas trik mempercepat loading blog dengan menaruh file CSS di hosting Google site...Kenapa Google site?...ya...biar compactible aja n gak repot lagi nyimpan di hosting yang lain...OK sob...gampangnya sekarang di Google site aja lah...:-)

Maksud dari postingan kali ini adalah teknik kita menyimpan CSS (Cascading Style Sheet) ke hosting agar blog sedikit ringan karena file CSS dipisahkan dari XML-nya. Nah ketimbang waktunya habis buat curhat n baca postingan gak jelas..... Nah mendingan langsung kita bahas point pentingya ajabiar kalian pada ngerti semua...ok!!!


Ok gan.. nih resepnya:
  1. Login dulu ke account blogger dan setelah masuk di dasboard klik Layout/Rancangan
  2. Setelah masuk Layout/Rancangan pilih Edit HTML.
  3. Backup dulu templatenya dengan copas/copy paste di notepad..
  4. Gak usah mencentang Expand Widget Template
  5. sekarang cari kode CSS yaitu kode setelah <b:skin><![CDATA[/* dan sebelum kode ]]></b:skin> Biar cepet carinya pake CTRL F aja…Udah ketemu kan…? Ok lanjut…
  6. Copas di notepad  kemudian save dengan ekstensi "css" ... caranya dengan klik File trus pilih Save as dan trus kamu kasih nama di kolom yang disediakan namablog.css  lalu klik Save 
  7. Sekarang lanjutkan dengan Upload file yang sudah kita save tersebut di hosting ....iya hosting google site aja biar gak ribet registrasi hosting lagi...untuk cara upload file nya berikut bro:
  • Login ke Google Site dengan pakai email yang sudah anda miliki...atau klik disini .  
  • Walaupun sudah memiliki akun email atau blogspot, bila masih baru di google site masih tercatat sebagai member baru..so, klik Create site / Buat situs  
  • Nanti akan keluar form isian seperti ini :   
  1. Silahkan pilih template sesuai selera anda
  2. Nama  Situs , misalnya : nicksensa 
  3. Situs Anda akan ditempatkan di URL ini: http://sites.google.com/site/ nicksensa 
  4. Pilih tema dan opsi lainnya bisa diabaikan
  5. Masukan kode yang diberikan  
  6. Jika sudah tinggal klik Buat situs/Create Site  
  7. Sampai disini halaman web anda sudah terbentuk
       
  • Selanjutnya klik “ Create page “ dipojok kanan atas dan di tampilan selanjutnya isikan :
  1. Select a Template Use  → Pilih “ File Cabinet 
  2. Nama  → kamu isi dengan “ pandaanku“, ini sesuai selera tapi yang gampang aja...
  3. ta tanda pada Put page at the top level  
  4. Selanjutnya  klik tombol “ Create Page “ 
  • Klik tombol Add File  : Pilih file yang akan di upload , boleh  file dari folder atau dari file yang telah di upload di server lain. 
  •  Setelah file terupload tinggal copy Link tersebut, caranya :
  1. Klik kanan pada link Download di bawah nama file yang telah di upload
  2. Bila pakai Firefox tinggal Klik “ Copy Link Location “ 
  3. Paste link tersebut di notepad, bila bener script link tersebut seperti ini:
'http://sites.google.com/site/nicksensa/js/nicksensa.css'?attredirects=0&amp;d=1
  • Step diatas harus dirubah atau dimodifikasinya agar bisa dipasang di sebagai script CSS, So,  tinggal hapus saja kode warna kuning diatas terus tambahi dengan kode yang saya tulis dengan warna hijau, sehingga scriptnya akan jadi seperti ini : 
<link href='http://sites.google.com/site/nicksensa/js/nicksensa.css'rel='StyleSheet' type='text/css'/>
  •  Nah... sekarang kita sudah dapat link filenya. persis kayak diatas                                           
  •  Selanjutnya kembali ke blogger dan Copas letaknya antara ]]></b:skin> dan </b:skin> sehingga nanti tampilannya seperti ini:  (NB. kode yang lama dihapus saja)

]]></b:skin>
<link href='http://sites.google.com/site/nicksensa/js/nicksensa.css'rel='StyleSheet' type='text/css'/>
</b:skin>

  • Terakhir di Simpan/Save..

↓↓Baca Juga Artikel Terkait Lainnya↓↓

Loading

0 komentar:

Post a Comment

 
Photography Templates | Slideshow Software
Related Posts Plugin for WordPress, Blogger...