Cara Compress Code CSS & JavaScript

CSS dan JavaScript Terlalu banyak menggunakan akan sangat mempengaruhi loading blog anda. Bagi anda yang menggunakan banyak CSS dan JavaScript akan saya ajarkan cara mengkompresnya. Dengan kompres maka loadingpun akan sedikit banyak lebih cepat. Bagaimana cara kompresnya? tidak repot, karena kita akan menggunakan bantuan Online YUI Compressor


Cara menggunakannya? sangat mudah. Apa yang ingin anda kompres? CSS atau JavaScript? Tenang akan saya bahas keduanya.

Untuk kompres JavaScript cukup dengan mengcopy paste kode JavaScriptnya. TAPI ! bukan semua kode JavaScript nya. Yang di copy adalah kode yang ada di antara <script type='text/javascript'> dan </script> atau <script type='text/javascript'> //<![CDATA[ dan //]]> </script>

Contoh :

    <script type='text/javascript'>

    var thumbnail_mode = "float" ;

    summary_noimg = 450;

    summary_img = 450;

    img_thumb_height = 120;

    img_thumb_width = 120;

    </script>



    <script type='text/javascript'>

    //<![CDATA[

    function removeHtmlTag(strx,chop){
    if(strx.indexOf("<")!=-1)
    {
    var s = strx.split("<");
    for(var i=0;i<s.length;i++){
    if(s[i].indexOf(">")!=-1){
    s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
    }
    }
    strx = s.join("");
    }
    chop = (chop < strx.length-1) ? chop : strx.length-2;
    while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
    strx = strx.substring(0,chop-1);
    return strx+'...';
    }

    function createSummaryAndThumb(pID){
    var div = document.getElementById(pID);
    var imgtag = "";
    var img = div.getElementsByTagName("img");
    var summ = summary_noimg;
    if(img.length>=1) {
    imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
    summ = summary_img;
    }

    var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
    div.innerHTML = summary;
    }

    //]]>

    </script>

Cara kompresnya masukan kode JavaScript dari blog anda ke kotak yang tersedia, File Tipe isi dengan JS lalu Compress

Sekarang jika ingin mengkompres CSS. Design > Edit HTML > Lalu copy semua kode yang ada di antara <b:skin><![CDATA[/* dan ]]></b:skin>

Cara kompresnya isi kota yang tersedia dengan kode CSS anda lalu isi File Type dengan CSS dan Compress

ads

Ditulis Oleh : Belajar Yuk!!! Hari: 2:30 AM Kategori: