Home
Writed by
On
7:34 AM , 
Friday, March 26, 2010
Beberapa hari yang lalu k'ian sempat kerepotan waktu mengatur Code CSS diBlog ini, sampai-sampai k'ian hampir kehilangan seluruh konten dan aplikasi yang telah susah payah k'ian pasang, hanya karena ingin mengkompres code CSS nya. Hal inilah yang pada akhirnya menuntun k'ian untuk mencari dengan bantuan om-google, dan hasilnya adalah mencoba untuk mengkompres CSS codenya dengan menggunakan external (luar) link 
tanpa merubah susunan dari code itu sendiri.
tanpa merubah susunan dari code itu sendiri.Sampai disini k'ian tetap bertanya-tanya External linknya mau pakai yang mana..??? tapi k'ian teringat akan sebuah artikel dari sahabat (k'ian lupa namanya) yang memposting sebuah artikel "Cara mendaftar disitus Link External" beberapa bulan yang lalu, dan beliau merekomendasikan untuk menggunakan "Google sites" sebagai hosting untuk file - file yang akan kita buatkan linknya. Jika kamu belum punya situs / hostingan yang menyediakan external link, Untuk cara mendaftar di Google sites bisa kamu lihat disini.
Jika kamu sudah memiliki hostingan yang lain, kamu tetap bisa menggunakannya selama kode yang kita pasang dalam kondisi yang benar. Untuk tahapan awal masuk kedalam account blog kamu-->> Layouts -->> Edit HTML -->> copy / download template kamu terlebih dahulu agar jika terjadi kesalahan kamu tidak perlu khawatir, jangan lupa beri ceklist pada kotak "expand widget template", selanjutnya Cut atau potong kode CSS yang akan kita pindahkan. lihat contoh dibawah :
Seperti contoh diatas yang harus kamu perhatikan adalah proses pemotongan kode CSS nya dimulai setelah kode #navbar-iframe{height:0px; visibility:hidden; display:none} atau dimulai dari kode .body {...} dan sebelum kode ]]></b:skin>
jika sudah paste kan kode tadi kedalam file notepad dan simpan dengan nama yang kamu inginkan namun akhirannya dengan .css contoh template.css
Selanjutnya Upload file CSS kita tadi kedalam hostingan kamu ( Google sites ), jika sudah Copy link dari kodenya dengan cara klik kanan pada keterangan "download" pilih "copy link location". contohnya
Sebelum disimpan sebaiknya dilihat "preview" nya dulu untuk memastikan tidak terjadi kesalahan yang fatal, dan jika sudah dirasa baik silahkan disimpan. Code CSS kamu sudah berhasil di kompress sehingga Loading Blog kamu semakin cepat.
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<meta content='B67Ds/beDLpC3GoSzXThaBQpGkEK0RIQJm5Se1ygges=' name='verify-v1'/>
<b:include data='blog' name='all-head-content'/>
<meta content='600' http-equiv='refresh'/>
<meta content='kiancoi' name='author'/>
<title><data:blog.pageTitle/></title>
<SCRIPT src=' http://sites.google.com/site/kianbersama/javascript/date.js' type='text/javascript'/>
<b:skin><![CDATA[/*
-----------------------------------------------
Theme Name: Celebration of Kian
Theme URI: http://www.kianhome.blogspot.com
Description: wonderful slide and simple display.
Author: Kian coi
Author URI:www.kianhome.blogspot.com
Converted to blogger template modified by Kian coi
Author URI: http://www.kianhome.blogspot.com
----------------------------------------------- */
#navbar-iframe{height:0px; visibility:hidden; display:none}
potong kode Css nya Mulai dari sini
]]></b:skin>
Seperti contoh diatas yang harus kamu perhatikan adalah proses pemotongan kode CSS nya dimulai setelah kode #navbar-iframe{height:0px; visibility:hidden; display:none} atau dimulai dari kode .body {...} dan sebelum kode ]]></b:skin>
jika sudah paste kan kode tadi kedalam file notepad dan simpan dengan nama yang kamu inginkan namun akhirannya dengan .css contoh template.css
Selanjutnya Upload file CSS kita tadi kedalam hostingan kamu ( Google sites ), jika sudah Copy link dari kodenya dengan cara klik kanan pada keterangan "download" pilih "copy link location". contohnya
http://sites.google.com/site/kianbersama/javascript/jquery.magnifier.js?attredirects=0
kemudian paste kedalam halaman Edit HTML kamu, sampai disini kita belum selesai karena link tersebut belum dinyatakan valid atau berfungsi, sehingga kita perlu melakukan sedikit penambahan dan perbaikan agar linknya bisa berfungsi dengan baik.Hal yang pertama adalah dengan menghapus kode yang berwarna orange pada contoh diatas sehingga kodenya akan seperti ini:
http://sites.google.com/site/kianbersama/javascript/jquery.magnifier.jsKemudian tambahkan kode <link href='....' rel='styleSheet' 'type='text/css' />, sehingga kodenya akan seperti ini :
<link href='http://sites.google.com/site/kianbersama/javascript/tempalte.css' rel='styleSheet' 'type='text/css' />dan letakkan diantara kode]]></b:skin> dan kode </head>. contohnya seperti ini :
]]></b:skin><link href='http://sites.google.com/site/kianbersama/javascript/tempalte.css' rel='styleSheet' 'type='text/css' /></head>
Sebelum disimpan sebaiknya dilihat "preview" nya dulu untuk memastikan tidak terjadi kesalahan yang fatal, dan jika sudah dirasa baik silahkan disimpan. Code CSS kamu sudah berhasil di kompress sehingga Loading Blog kamu semakin cepat.
Nb:
Pada saat mengkompres pastikan bahwa kamu tidak akan melakukan perubahan lagi pada kode CSS di template kamu, sehingga kamu bisa lebih memaksimalkan kodenya.
Langkah ini tidak hanya berguna untuk kode CSS saja namun bisa kita gunakan untuk kode JAVASCRIPT dan lain-lain, mungkin akan k'ian bahas di artikel yang lainnya..!!!
Related Post :
nasional
- Modus Unik Pencurian Motor, Payudara Maut Hingga Razia Palsu
- Pedemo Sesaki Jalan Sudirman, 7 Bus TransJ Terjebak Macet
- Video : Misteri Karung Berlumuran darah
- Heboh, 2 Video Mesum beredar di Sungaililin
- Dukung Komodo dengan Pulsa Rp.1 Saja
- Tak Terima Anak Gadisnya di Hamili, Seorang Ibu Adukan Tetangga ke Polisi
- Heboh Video Penyiksaan Pelajar di Bandar Lampung
- Gadis Ini diperkosa di Atas Truk
- Rumah Mewah Terbakar, Gara-Gara Main Korek Api
- Siswi SMP Hasilkan Rp 84 Juta Dari Jual Diri di Facebook
- Payudara Melinda Dee Akan Dioperasi Siang Ini
- Tumbuhkan Nasionalisme Dari Statistik Negara Indonesia
- Manohara dan Sang Bunda Pamer Dada
- CPNS Paksa Pasangan Mesum Ulangi Adegan Untuk Direkam
- Malang!!!Gadis Muda ini diperkosa 5 Kali
- Ratusan Warga Pekanbaru Keracunan Mie Instan
Info
- Belanja Fashion Online di Zalora yuk...!!
- Regenass : Peserta kongres PSSI tidak punya sopan santun
- Inilah Peringkat 10 Besar Sekolah dengan Nilai Ujian Nasional
- Peringatan Hari Kebangkitan Nasional disambut goyang erotis
- Mahasiswa digrebek akibat bertamu hingga dini hari
- Terobsesi akan sebuah film, pria ini dengan sadis membunuh korbannya
- Survei : Orde Baru ternyata lebih baik dari Orde Reformasi
- Bintang seksi Jepang ditemukan bunuh diri
- Peran Orang tua adalah metode mudah anak Belajar matematika
- Ternyata, Email DPR baru aktif dua hari yang lalu
- Blogger Kanada umumkan kematiannya lewat blog
- Game Bola, bisa meningkatkan agresifitas sipemain
- Ditanya soal E-mail, komisi 8 DPR RI bersikap Garang
- Mau, Aplikasi ini dinilai lebih dari Blackberry Messanger
- Penis Pria Indonesia berada diurutan kedua dunia
- Pejabat ini dipenjara seumur hidup karena tiduri 100 wanita
Aplikasi%20blog
- cara download video dari Youtube, Metacafe, Dailymotion
- Cara menempatkan Text didalam gambar
- Widget Recent Post dengan Gambar
- Format Comment blog Baru dengan Facebook comment
- Award persahabatan dari K'ian buat Sobat tercinta
- Cara Pasang icon "Like this" Facebook di Blog Kamu
- New Menu Navigasi Ubah tampilan Blog jadi lebih elegant
- Modifikasi tampilan Image dengan efek shadow (bayangan)
- Efek zoom pada gambar dengan JQuery Magnify
- Cara Pasang Random post disidebar Blog
- Cara memasang kode HTML,CSS,Javascript didalam postingan
- Cara membuat efek scrol pada kotak komentar sahabat
- Cara Mendapatkan External link dari Google Sites
- Cara pasang Pagenavigation number
- Join with Zorpia site, take your Dollar
hadeh...gag mudeng rek... :'( ...Replay
yah.. Dah keduluan. @atas : cepet bgt.
Thx mas.. Tapi kok msh g ngeh y ...Replay
@ alliev : pada dasarnya tutorial ini mengenai format perampingan kode CSS maupun kode2 yg lain..dmn kita hanya perlu memasang link kode yang sudah kita simpan tadi,sehingga link yang akan kita jadikan acuan merupakan link dari kode CSS yg kita simpan..
@ super.sonic : penjelasannya sama kayak diatas sob...!!!
4all : thank's da comment...!!! ...Replay
Wah...bingung aku??, apaan sih itu, untuk apa trus kegunaannya apa??hehe..Akang sih pinter masalah gituan, klo neng sih sama seperti yang diatas gak mudeng..makasih udah mampir akang, kemana aja selama ini gak nongol batang idungnya hehe ...Replay
@ Lia : mungkin artikelnya terlalu cepat aku jelasin..mungkin lain waktu bakal aku update untuk kelengkapannya...!!!
makasih ya neng da comment..!!! cee u..!!! ...Replay
aq juga pernah menggunakan trik ini sob, ada perubahan si, tp g aq pakai lagi ...Replay
ok..ditunggu penjelasannya di posting berikutnya.. ...Replay
@ Lia_Lovaa : tunggu aja ya neng..tq da mampir..!!!! ...Replay
Terima kasih info bermanfaatnya.... ...Replay
@ Osi : sama-sama...!!! ...Replay
Wah,, keren nih artikelnya .. Request bhan2 css kode dan html donk ..
Keep share with me yah . :) ...Replay
bang..aku blogger baru, mau nanya TUTUP dan TAMPILKAN gimana seperti yang di sidebar blog ini, sekalian cara pasang banner You Comment I Follow nya...reply nya ke email djwelthan@gmail.com
(Saya ucapkan thank udah mau berbagi)
mlaili from kalteng @ http://mymoveis.blogspot.com ...Replay
bang..aku blogger baru, mau nanya gimana cara bikin TUTUP dan TAMPILKAN seperti yang di sidebar blog ini, sekalian cara pasang banner You Comment I Follow nya...reply nya ke email djwelthan@gmail.com
(Saya ucapkan thank udah mau berbagi)
mlaili from kalteng @ http://mymoveis.blogspot.com ...Replay
@ M.Lailie : Sob, pertanyaan lo udah aq jawab dengan seksama..semoga berhasil yach...!!! ...Replay