Membuat Daftar Isi Pada Blog ~ Rippons Birdwing

Uyyeeaahh... balik lagi.. bikin postingan ga' mutu lagi..

Kalo kita tanya,"Gimana kalo kita buat daftar isi pada blog kita?". Lu pada pasti jawab "Yaah mbel, itu sih dah banyak yang posting, kaliii..!!!". Uyeeaahh.. kalo kata kita, "itu sih cara orang ga' kreatif yang males, tinggal tangkringin URL script orang yang udah susah-susah bikin ama upload script.. Kasiaan sama yang buat doonk.. Lagian kalo cara begituan kaya'nya ga' ada gregetnya deeh, kali ini kita bakal membuat widget yang merupakan hasil usaha sendiri. kita akan edit scriptnya, kita akan upload scriptnya, kita buat widgetnya, kita rasakan hasil kerja keras kita. Gimana... mau...?"

Pertama-tama, buat text dokumen baru menggunakan notepad atau dari start menu => run ketik notepad, itu sih dah pada tau'..

Iya deeh.. tapi yang ini belum pada tau' kan.. nih ta' ajari jurus mautku (weleeh mbel... gayamu.. gomballl..)

Pada notepad ketikkan ini, atau copas aja deh, timbang kelamaan,

//<![CDATA[
function showrecentposts(json) {
for (var i = 0; i < numposts; i++) {
    var entry = json.feed.entry[i];
    var posttitle = entry.title.$t;
    var posturl;
    if (i == json.feed.entry.length) break;
    for (var k = 0; k < entry.link.length; k++) {
      if (entry.link[k].rel == 'alternate') {
        posturl = entry.link[k].href;
        break;
      }
    }
    posttitle = posttitle.link(posturl);
    var readmorelink = "(more)";
    readmorelink = readmorelink.link(posturl);
    var postdate = entry.published.$t;
    var cdyear = postdate.substring(0,4);
    var cdmonth = postdate.substring(5,7);
    var cdday = postdate.substring(8,10);
    var monthnames = new Array();
    monthnames[1] = "Jan";
    monthnames[2] = "Feb";
    monthnames[3] = "Mar";
    monthnames[4] = "Apr";
    monthnames[5] = "May";
    monthnames[6] = "Jun";
    monthnames[7] = "Jul";
    monthnames[8] = "Aug";
    monthnames[9] = "Sep";
    monthnames[10] = "Oct";
    monthnames[11] = "Nov";
    monthnames[12] = "Dec";
    if ("content" in entry) {
      var postcontent = entry.content.$t;}
    else
    if ("summary" in entry) {
      var postcontent = entry.summary.$t;}
    else var postcontent = "";
    var re = /<\S[^>]*>/g;
    postcontent = postcontent.replace(re, "");
    if (!standardstyling) document.write('<div class="bbrecpost">');
    if (standardstyling) document.write('<br/>');
    document.write(posttitle);
    if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);
    if (!standardstyling) document.write('</div><div class="bbrecpostsum"">');
    if (showpostsummary == true) {
      if (standardstyling) document.write('<br/>');
      if (postcontent.length < numchars) {
         if (standardstyling) document.write('<i>');
         document.write(postcontent);
         if (standardstyling) document.write('</i>');}
      else {
         if (standardstyling) document.write('<i>');
         postcontent = postcontent.substring(0, numchars);
         var quoteEnd = postcontent.lastIndexOf(" ");
         postcontent = postcontent.substring(0,quoteEnd);
         document.write(postcontent + '...' + readmorelink);
         if (standardstyling) document.write('</i>');}
}
    if (!standardstyling) document.write('</div>');
    if (standardstyling) document.write('');
}
if (!standardstyling) document.write('');
if (standardstyling) document.write('');
document.write('');
if (!standardstyling) document.write('');

}
//]]>

kalo udah selesai kita akan menyimpannya sebagai text javascript, Save As... judulnya_terserah.js dan dalam kotak Save As Type: pilih All files.

Untuk hasil optimal sebaiknya file di simpan dengan ekstensi *.js jangan *.txt

Nah langkah pertama selesai.. lanjut langkah kedua..

1. Buka tab baru pada browser anda.. (ciaaa.. serasa guru kursus aja..) masuk ke Google sites login menggunakan akun google

2. setelah masuk halaman utama google site klik create site.

3. pada pilihan template, pilih blank template

4. masukkan judul situs (judulnya bagusnya nama saya deeh.. tapi kalo ga' mau, terserah deeh....^_^)

5. isi captcha klik create site (iyaa.. ga' diajarin juga tau..)

6. setelah situs jadi, pada halaman Home klik Create page, (itu looh, tombol yang ada palang ijonya..)

7. Pilih halaman type List (yang ke-empat)

8. Masukan nama halaman (judulnya terserah juga),

9. klik create page.

10. setelah kita masuk ke halaman list yang kita buat tadi klik Attachments

11. pada kotak Attach a file: upload file Java-script yang tadi kita buat.

12. Setelah file selesai di upload, klik kanan pada kata 'download'=> Copy Link Location.. salin Link ke notepad

contoh link

https://sites.google.com/site/neranjikematian/list0/Myrecentspost.js?attredirects=0&d=1

nah URL inilah yang akan kita gunakan sebagai target widget kita, namun karena yang akan kita gunakan hanya URL target text javascript-nya saja maka kita akan hapus direct downloadnya dengan cara memotong URL dari belakang hingga akhir ekstensi file (dalam hal ini js adalah ekstensinya)
contoh link target yang sudah di potong redirect-nya

https://sites.google.com/site/neranjikematian/list0/Myrecentspost.js

13. Naah.. pada tahap ini kita sudah selesai..

Lanjut langkah ketiga.. soalnya kalo kelamaan, buat mbayar warnetnya ntar kurang, lagi.. yang kemaren aja masih ngutang..^_^.

1. Masuk dashboard, design, edit layout, pada page elemen, tambahkan gadget HTML/Javascript.

2. Masukkan kode berikut :

<div style="border: 1px solid #666666); overflow: auto; height: 250px;" margin="5px" ;>

<script style="text/javascript" src="https://sites.google.com/site/neranjikematian/list0/Myrecentspost.js"></script><script style="text/javascript">var numposts = 1000;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script><script src="http://www.ripponsbirdwing.co.cc/feeds/posts/default?orderby=published&alt=json-in-script&max-results=999&callback=showrecentposts"></script>

</div>

# pada URL yang berwarna merah, ganti dengan URL download javascript yang tadi kita upload

# pada URL yang berwarna biru, ganti dengan URL blog kita

3. Save

4. Selesai.. Test..

Naah gimana rasanya...?
Hasil keringat sendiri.. pasti bau dooonk... wahahahaaayy...

Tapi bener deeh, katanya jika segala sesuatu yang kita miliki adalah hasil kerja keras kita sendiri maka akan lebih bermakna...
(ciaa.. so' tua lu aah...! )

Uyeee... Selamat mencoba..

Update...
Setelah kita periksa, sering terjadi permasalahan saat blog melakukan koneksi ke Google site. Maka script terkadang tidak ter-eksekusi dengan baik, dan akan memperlambat loading blog.

Perbaikan...

Selain Google Site, kita dapat menggunakan Google Code untuk meng-upload script, atau kita bisa langsung mengedit HTML/Javascript dengan cara mengganti semua script dengan script ini:

Pada URL yang berwarna biru, ganti dengan URL blog yang ingin ditampilkan daftar isinya, terserah.. mau di isi URL blog kita atau URL teman kita. Jadi artinya, script ini juga dapat digunakan untuk menampilkan daftar isi blog lain looh.

5 Comments:

Bebas Merdeka said...: Uyee jga gan, thanx infonya gan
numpang copas ya?
di google site bisa upload apa aja ya?; April 7, 2011 at 3:00 AM
dhaw666 said...: thanks gan
manfaat sangat
patut dcoba neh. . . .; April 7, 2011 at 8:36 AM
om dela said...: hasemmm aku ora iso lek masalah kayak gtu... mumet dan pusing.... pengen belajar juga sih... hiks hiks... kursusin ak dong... he he he

mas usul gmana kalo setiap tutorial seperti ini dikasih screenshot nya biar tambah mudeng... maklum ni ak mubeng.. kemudian dikasih contoh hasilnya... he he he cuma usul...; April 7, 2011 at 3:56 PM
Iwan-author said...: Sorri semuanya ya.. Kita baru bisa Ongleng sekarang, jadi baru bisa update & perbaikan.
@Bebas Merdeka, silakan di copas, brada..(copas mulu, lu aah..^_^)
@dhaw666, silakan di coba.
@om_dela, usulnya mantap brada, uyee.. sebetulnya kita mau sih, bikin screenshotnya.. maklumin deh brad.. kita cuma bisa ongleng via warnet(maklum deh rakyat jelata) tapi akan kita usahakan deh..
btw contohnya sebetulnya udah ada dari kemaren, tapi karena google sites sifatnya secure conection, terkadang koneksi blog ke google site keputus jadi ga' bisa nongol.. buat ngakalinnya silakan baca update N perbaikan, Ntar kita cari hosting yang kebut deh..^_^; April 7, 2011 at 8:15 PM
Bebas Merdeka said...: Weits.. blum ditanya dah di apdet, coba google codenya kalo bza kasih tutorna skalian.yagh :); April 8, 2011 at 12:24 PM

Pages

Rippons Birdwing

Membuat Daftar Isi Pada Blog

5 Comments:

Post a Comment

Recent Posts