Cara Membuat JavaScript dan CSS Dibungkus Menjadi Ringan


Artikel kali ini adalah Cara Membungkus JavaScript dan CSS Pada Blog Agar Menjadi Ringan.
Kita tahu bahwa CSS dan JavaScript itu sangat banyak dan panjang, itu bisa membuat loading blog kita menjadi berat. Nah, untuk itu Saya mempunyai cara agar loading blog menjadi ringan dan tidak terlihat banyak CSS dan JavaScript-nya.

Cara Membuat JavaScript dan CSS dibungkus Menjadi Ringan

Berikut di bawah ini caranya untuk JavaScript :

  • Login ke blogger.com, jika sudah,
  • Pilih Template → Edit HTML
  • Cari kode //<![CDATA[ , agar mudah mencari tekan F3
  • Copy dari kode //<![CDATA[ sampai ujungnya //]]> ke dalam notepad
  • Kira-kira seperti ini

<script type='text/javascript'>//<![CDATA[var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();function related_results_labels(c){for(var b=0;b<c.feed.entry.length;b++){var d=c.feed.entry[b];relatedTitles[relatedTitlesNum]=d.title.$t;for(var a=0;a<d.link.length;a++){if(d.link[a].rel=="alternate"){relatedUrls[relatedTitlesNum]=d.link[a].href;relatedTitlesNum++;break}}}}function removeRelatedDuplicates(){var b=new Array(0);var c=new Array(0);for(var a=0;a<relatedUrls.length;a++){if(!contains(b,relatedUrls[a])){b.length+=1;b[b.length-1]=relatedUrls[a];c.length+=1;c[c.length-1]=relatedTitles[a]}}relatedTitles=c;relatedUrls=b}function contains(b,d){for(var c=0;c<b.length;c++){if(b[c]==d){return true}}return false}function printRelatedLabels(a){for(var b=0;b<relatedUrls.length;b++){if(relatedUrls[b]==a){relatedUrls.splice(b,1);relatedTitles.splice(b,1)}}var c=Math.floor((relatedTitles.length-1)*Math.random());var b=0;if(relatedTitles.length>1){document.write("<h2>"+relatedpoststitle+"</h2>")}document.write("<ul>");while(b<relatedTitles.length&&b<20&&b<maxresults){document.write('<li><a href="'+relatedUrls[c]+'">'+relatedTitles[c]+"</a></li>");if(c<relatedTitles.length-1){c++}else{c=0}b++}document.write("</ul>");relatedUrls.splice(0,relatedUrls.length);relatedTitles.splice(0,relatedTitles.length)};//]]></script>

  • Hapus kode yang tersisa yaitu kode <script type='text/javascript'></script>
  • Simpan script yang tadi dicopy ke dalam notepad menjadi file dengan format .js (contoh:script.js)
  • Upload file tadi yang bernama script.js ke https://sites.google.com
  • Jika sudah, klik kanan pada file yang di upload tadi untuk mengambil URL javascript tersebut seperti ini

https://sites.google.com/site/suryachandragobelblogspot/home/surya_osd/script2.js?attredirects=0&d=1

  • Ubah link tadi menjadi seperti ini

https://sites.google.com/site/suryachandragobelblogspot/home/surya_osd/script2.js

  • Buka notepad lagi, copy dan ubah URL tadi menjadi seperti ini

<script src="https://sites.google.com/site/suryachandragobelblogspot/home/surya_osd/script2.js" type="text/javascript"/>

  • Letakkan script tadi di atas kode </head>

Masih di Edit HTML, sekarang untuk CSS-nya

Hampir sama dengan JavaScript, tapi CSS ini dicopy semua jika memang sudah tidak ada yang perlu diedit lagi dari CSS tersebut, berikut caranya :

  • Cari kode <b:skin><![CDATA[ script CSS yang dicut ke notepad ]]></b:skin>
  • Jika sudah dicopy ke notepad, simpan dengan format .css (contoh : script.css)
  • Setelah itu upload dan ikuti seperti cara di atas tadi
  • Setelah dicut tadi sisanya kan cuma <b:skin><![CDATA[ ]]></b:skin>
  • Ubah <b:skin><![CDATA[ ]]></b:skin>
  • Menjadi seperti ini

<link href='https://sites.google.com/site/suryachandragobelblogspot/home/surya_osd/css.css' rel='stylesheet' type='text/css'/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<b:skin><![CDATA[ ]]></b:skin>
</b:if>

  • Simpan dan lihat hasilnya.

Semoga Bermanfaat !

1 Komentar untuk "Cara Membuat JavaScript dan CSS Dibungkus Menjadi Ringan"

  1. makasih infonya,, sangat bermanfaat.. dan pesan di bawah postingan itu (swt) banget :D

    BalasHapus

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel

Tekan close (x) 2 kali untuk menutup, jangan lupa Berlangganan

Masukkan Email aktif untuk update artikel via email :

Delivered by FeedBurner

×