css
dan html
di template xml
yang dapat sedikit membantu mengurangi beban blog saat loading. Perhatian
- Pada tutorial ini saya menggunakan template
xml
minima white. - silahkan back-up template (Download full template) sebelum melakukan tips berikut.
Proses
[...] setelah berada di laman editHtml
[...] cari dan hapus code html
ini:
/* Variable definitions
====================
<Variable name="bgcolor" description="Page Background Color"
type="color" default="#fff" value="#ffffff">
<Variable name="textcolor" description="Text Color"
type="color" default="#333" value="#333333">
<Variable name="linkcolor" description="Link Color"
type="color" default="#58a" value="#5588aa">
<Variable name="pagetitlecolor" description="Blog Title Color"
type="color" default="#666" value="#666666">
<Variable name="descriptioncolor" description="Blog Description Color"
type="color" default="#999" value="#999999">
<Variable name="titlecolor" description="Post Title Color"
type="color" default="#c60" value="#cc6600">
<Variable name="bordercolor" description="Border Color"
type="color" default="#ccc" value="#cccccc">
<Variable name="sidebarcolor" description="Sidebar Title Color"
type="color" default="#999" value="#999999">
<Variable name="sidebartextcolor" description="Sidebar Text Color"
type="color" default="#666" value="#666666">
<Variable name="visitedlinkcolor" description="Visited Link Color"
type="color" default="#999" value="#999999">
<Variable name="bodyfont" description="Text Font"
type="font" default="normal normal 100% Georgia, Serif" value="normal normal 100% Georgia, Serif">
<Variable name="headerfont" description="Sidebar Title Font"
type="font"
default="normal normal 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif" value="normal normal 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif">
<Variable name="pagetitlefont" description="Blog Title Font"
type="font"
default="normal normal 200% Georgia, Serif" value="normal normal 200% Georgia, Serif">
<Variable name="descriptionfont" description="Blog Description Font"
type="font"
default="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif">
<Variable name="postfooterfont" description="Post Footer Font"
type="font"
default="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif">
<Variable name="startSide" description="Side where text starts in blog language"
type="automatic" default="left" value="left">
<Variable name="endSide" description="Side where text ends in blog language"
type="automatic" default="right" value="right">
*/
Hapus semua tanda berikut:-----------------------------------------------
Kode css
untuk widget profil, hapus jika tidak di perlukan
/* Profile
----------------------------------------------- */
.profile-img {
float: $startSide;
margin-top: 0;
margin-$endSide: 5px;
margin-bottom: 5px;
margin-$startSide: 0;
padding: 4px;
border: 1px solid $bordercolor;
}
.profile-data {
margin:0;
text-transform:uppercase;
letter-spacing:.1em;
font: $postfooterfont;
color: $sidebarcolor;
font-weight: bold;
line-height: 1.6em;
}
.profile-datablock {
margin:.5em 0 .5em;
}
.profile-textblock {
margin: 0.5em 0;
line-height: 1.6em;
}
.profile-link {
font: $postfooterfont;
text-transform: uppercase;
letter-spacing: .1em;
}
Hapus juga code ini:
body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}
Kemudian ganti kode css
diatas dengan kode di bawah ini:
body {
background:#fff;
margin:0 auto;
color:#000;
font:75% Georgia "Times New Roman", Times,Serif;letter-spacing:0.2px;line-height:12px}
Hapus juga kode yang berawalan $
, kemudian tetapkan kode value/jenisnya, contoh: $bgcolor, $textcolor, $linkcolor, $visitedlinkcolor, $bordercolor, $startSide, $endSide, $bodyfont
Ganti $....color
dengan kode warna html, misalnya untuk warna hitam #000000
atau dapat di persingkat menjadi #000
, kemudian ganti juga kode $startSide
dengan value left
dan $endSide
dengan value right
$bodyfont, $descriptionfont, $postfooterfont
ganti dengan jenis font yang sobat anggap menarik, contoh: 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif'
Untuk Demo sudah saya terapkan pada template ini.
26 komentar (Tips meringankan loading blog = Mengurangi css & html)
sebagian kayaknya belum tak hapus sob, ok deh habisa BW2 kalau masih ada waktu lang tak oprek blog q, makasih sob
he he... sama-sama kang
layak untuk dicoba, thanks sharenya :)
maaf ane bengong sebentar disini kawan (5 menit lagi) templatenya kereeeeeeeen banged.. mangtabs
he he, ada-ada aja...
wah mantap nih ilmunya buat ringanin blog saya yg beraaat banget , hehehe
saya salut buat blog ini , tampilannya bagus dan sangat ringan :D
mantabs tipsnya, kawan...
bisa dicoba nih, biar blog saya tambah enteng..he.he..
Tips manteb kang, bisa nambah wawasan saya. Tapi belum berani saya untuk menghapus-hapus kode.
Mampir kalu bersedia dan jangan lupa komentnya mas
http://bilbulsama.blogspot.com/
harus saya praktikkan ini.. sayangnya saya masih kurang menguasai php, wp dsb nya.. self hosting :( mohon bimbingannya mas.. terimakasih :)
ini cepat kalo loadignnya.. :)
sichandra »
mungkin template ini yang sobat maksud:
http://deconstructioncode.blogspot.com/
Majalah Masjid Kita »
maaf, sayapun belum atau bahkan tidak mengerti tentang php, wp apalagi self hosting, jusru saya ingin belajar dengan siapapun yang bersedia termasuk sobat.
Siap praktek,,Gan!!
balasan
load berat repot juga
asal tahan nunggunnya, mungkin gak masalah :D
di blogspot masih rada2 nggak berani sob
coba bisa di oofline kan ya
yoii... pasti lebih ok.
Wow... bahasanya bikin ane puyeng hehehe... Harus smedi dulu neh buat belajarnya.
Salam!
selalu saja ada yang bermanfaat jika bertandang ke sini.. saya harap suatu saat nanti masnya memposting tips dan triks yang berkenaan dengan wp selfhosting... karena saya masih bener2 buta akan hal satu ini :(
kagak mudeng Sob.. pengin buanget bisa bahasa pemrograman tapi kayaknya Ssussah buanggggget
mumet q pak :doh
@Bai
sama, setelah saya ngetik posting diatas, saya langsung minum obat :D
udah aku coba malah berantakan...
heheh dasar otakku katro.
nice share bos...
Intinya cuma meminimalisir & memindahkan aja bro...
kagak mudeng Bosss
;) Mantap sob tutornya Mempercepat Loading Blog Dengan CSS Compressor
Happy Blogging
mank yg g k'pake msti d'hpus..tz klo bs cssx mesti d'persingkat, atau mungkin dengan bahasa yg tidak saya kenal dinamakan css shorthand...
nice info mas..makasih..
sip. biar enteng loadingnya
Back to form