2/4/10

Fungsi Scroll Pada Label / Kategori


Coba lihat ada sedikit perubahan wajah dari blog ini, semalam sedikit utak-atik template. Mumpung masih segar n ada waktu 30 menit nih tak arsipkan dulu yah supaya gak lupa.  Apa sih ??. Gini lho semalam saya coba Membuat Fungsi Scroll Pada Label atau Kategori dan Archives Blog, Sekarang ada scrollnya kan  jadi gak terlalu memanjang. Ngirit tempat deh ceritanya, terus juga ada nomor urutnya, kemarin gak ada hanya buton aja…. bikinnya simple tuh, mau tahu ? .. ini bukan nawarin tahu Sumedang lho.. tapi tahu Scroll.. hihi.

Yang saya lakukan pada template ini  untuk membuat Fungsi Scroll Pada Label atau Kategori , langkahnya seperti ini :

  1. Masuk dulu ke Acount Blogger atau Dashboard
  2. Pilih Layout , lalu klik Edit HTML
  3. Centang dulu tuh Expand Widget Templates
  4. Cari kode yang seperti ini  (kalau widget labelnya belum ada ya bikin dulu ) :

<b:widget id='Label1' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
  <b:if cond='data:title'>
    <h2><data:title/></h2>
  </b:if>
  <div class='widget-content'>
<div style='overflow:auto; width:ancho; height:300px;'>
   <ul>
    <b:loop values='data:labels' var='label'>
      <li>
        <b:if cond='data:blog.url == data:label.url'>
          <span expr:dir='data:blog.languageDirection'>
            <data:label.name/>
          </span>
        <b:else/>
          <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
            <data:label.name/>
          </a>
        </b:if>
        <span dir='ltr'>(<data:label.count/>)</span>
      </li>
    </b:loop>
    </ul>
    <b:include name='quickedit'/>
  </div> </div> </div>

  1. Untuk memudahkan mencarinya , pakai saja Ctrl +F , terus ketik kata apa yang dicari dikotak yang disediakan, lalu klik next. 
  2. saya cari kata Labels, karena di blognya namanya Labels, kalau nama widgetnya Kategori, ya cari Kategori. Ternyata kata labels itu banyak,  terus saja klik next sampai ketemu kode2 lain yg menyertainya. ketemu juga tuh.
  3. Kembali ke kode diatas, kalau sudah ketemu tinggal tambahkan saja kode yang warna merah itu untuk fungsi scrollnya.
  4. Angka 300px adalah tinggi kotak scroll itu, ini bisa disesuaikan.
  5. Mungkin saja diblog sobat kodenya beda,,  seperti diblog saya yang lain kodenya bukan  <div class='widget-content'> tapi :


    <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>

    gak apa asal penempatannya tepat, it’s ok.

  6. Untuk merubah buton menjadi  nomor urut , saya ganti tulisan warna biru itu <ul> menjadi <ol> dan </ul> menjadi </ol>
  7. Kalau sudah save template .
  8. Selesai.

Masih berkaitan, sebelumnya ada juga ttg membuat Fungsi Scroll Pada Komentar dan Fungsi Scroll pada Related Post  , kalau seneng kepada scroll menyecroll atau gulung menggulung..  halah.. bahasa apa ini , tapi silahkan aja di klik.

Hasil akhirnya dari tips diatas adalah seperti ini ,

image image

Selamat membuat Fungsi Scroll Pada Label atau Kategori , sedangkan untuk fungsi scroll pada Archives Blog.. tunggu posting selanjutnya .  Semoga bermanfaat.

Saung Web


  1. Thanks telah mampir, yo kita saling vote dan comment..
  2. Bila berkenan tolong bagikan dengan tombol share di atas.
  3. Gratis langganan artikel blog ini, silahkan klik Disini, atau masukan email disidebar yg telah disediakan

Sobat sedang membaca artikel Fungsi Scroll Pada Label / Kategori, bila berkenan silahkan share artikel ini dengan tombol share di atas. Bila mau COPAS untuk di blog sobat, dimohon meletakkan link aktif sebagai Sumbernya dengan copy kode di bawah ini.

Related Post:

65 comments:

  1. wah PERTAMAX nih ... he he

    terima kasih atas tutorial Membuat Fungsi Scroll Pada Label atau Kategori dan Archives Blog ini, saya jadi tambah ngerti, perlu diterapkan pada blog saya...

    ReplyDelete
  2. (maaf) izin mengamankan PERTAMA dulu. Boleh kan?!

    Emang kita harus mengirit. Termasuk ngirik di sidebar.

    ReplyDelete
  3. hihihihihi..... punya saya juga sudah tak pasangi kayak gitu Mas.....

    ReplyDelete
  4. terima kasih mas,,akan saya laksanakan

    ReplyDelete
  5. @ ericjogja : Silahkan bos
    @ alam endah : yups amankan deh.. jangan lupa bawa pentungan
    @ kang sugeng : lha wong saya niru dari situ haha..
    @ hendro : yups.. laksanakan.. haha

    ReplyDelete
  6. Duh punyaku malah belum digituin nih.. belum sempat

    ReplyDelete
  7. Assalamu'alaikum, saya ingin membuat yang seperti ini, tapi blog saya blog gratisan, bisa nggak ya..? saya gaptek (Dewi Yana)

    ReplyDelete
  8. salam sobat
    iya menarik dan menghemat ruangan blog ya,,kalau pakai scroll label ini mas,,
    tapi saya karena labelnya sedikit ,jadi ngga pakai,,,
    nanti saya pingin coba bikin scroll untuk komentar mengikuti cara mas di artikel scroll komentar .
    trims mas ilmunya.

    ReplyDelete
  9. hehe..gpp mas..udah mampir aja udah sweneng,,hehe
    kabar bandung yg dingin baik2 saja...^_^
    thx lo mas sharingnya,byk yg aQ ikutin nie dr tips blognya mas,,xiexie

    ReplyDelete
  10. yang untuk persi spoiler ada gak ya buat label dan arsip atau follower

    Thanks infonya

    ReplyDelete
  11. Kayaknya widget ini belum ada di widget saya.
    makasih banyak sobat.

    ReplyDelete
  12. Oh yah...
    kalau mau hilagin angka dibelakangnya, gimana sobat?

    ReplyDelete
  13. thank buat infonya, udah di coba dan berhasil.

    ReplyDelete
  14. cantiknya tampilannya bikin blog tambah apik layoutnya

    ReplyDelete
  15. semangat terus.... biar makin pinter... nggak kayak aku yang begini2 aja... hehehehhe... selama ada adikku, aku rasa aku aman... biar dia ja yg pinter ngutak ngatik... hehehhee

    ReplyDelete
  16. Wah Langsung ke TKP dulu
    Trima kasih Infonya, salam kenal

    ReplyDelete
  17. ya bagus tuh untuk memperindah tampilan blog...

    ReplyDelete
  18. mantapss om belum tahu apa aku cuma nulis aja blognya aja dikerja ayah

    ReplyDelete
  19. thx atas tutorialnya y...
    sangat bermamfaat buat saya newbie
    klo sempat kunjungi blog saya n kasih pencerahan y

    ReplyDelete
  20. aku mau pasang di blogku tapi komentnya beuu masih dikit jadi percuma

    ReplyDelete
  21. @ Semua Sobat : wah banyak yg belum di jawab nih.. 2 hari gak ngoprek. hehe.. makasih aja ya..

    ReplyDelete
  22. tutorialnya aku simpan dulu.aku copy di komputer.buat arsip boleh ya kawan..

    ReplyDelete
  23. ini yang bikin puyeng.....terkadang template q punya kode yang ndak sama bang......aq mau buat buka tutup komentar tapi template ga sama dengan tutorial yang aq dapet.....jadi belum kesampaian sampe sekarang....

    ReplyDelete
  24. @ soewoeng : Sama kok sob..
    @ tomo : boleh aja sob... saenake dew
    @ dirgham : sama2 sob..
    @ Aditya's blog sphere : duk kaciaaan deh
    @ aulia : emang nice sob wikiki
    @ Kurnia septa : sama2 sob. irit banget koment nya .. ta bales yoo

    ReplyDelete
  25. thanks sob berhasil percobaaknnya...semoga ilmu manfaat ini diberi bonus oleh Allah...

    ReplyDelete
  26. wow lumayan neh bwt ngirit lapak blog saya yg kepanjangan hehe..

    ReplyDelete
  27. biasanya sih agar space blognya hemat

    ReplyDelete
  28. makasih banyak ni bos buat pengetahuan nya..
    boleh lihat-lihat mas ke blog baru saya, yang lama di banned..

    ReplyDelete
  29. hasil experimen nya berhasil mas..

    ReplyDelete
  30. keren bro.......patut dicontoh sama blogger amatiran kaya saya

    ReplyDelete
  31. Adverse Credit Remortgages|Conference Calling Companies|Endowment Policy Sales

    ReplyDelete
  32. Austin Texas Dui Lawyers|Boston Dui Lawyers|Consolidating Private Student Loans

    ReplyDelete
  33. Conference Calling Companies|Home Mortgages For Bad Credit|Car Insurance Texas

    ReplyDelete
  34. Instant Car Insurance Quote|New Jersey Auto Insurance|Personal|Injury Lawyer Chicago

    ReplyDelete
  35. Insurance Auto|New York Mesothelioma Lawyers|Car Free Insurance Online Quote

    ReplyDelete
  36. Pennsylvania Mesothelioma Lawyers|Consolidation Student Loan|Structured Settlement Buyers

    ReplyDelete
  37. Secured Loans|Mesothelioma Attorney San Diego|Sell Structured Insurance Settlements

    ReplyDelete
  38. Naruto 546|Naruto Manga 547|Naruto Shippuden Manga 548|Naruto 549 Manga|Naruto 550 Spoiler

    ReplyDelete
  39. Naruto 546|Naruto Manga 547|Naruto Shippuden Manga 548|Naruto 549 Manga|Naruto 550 Spoiler

    ReplyDelete
  40. Naruto 546|Naruto Manga 547|Naruto Shippuden Manga 548|Naruto 549 Manga|Naruto 550 Spoiler

    ReplyDelete
  41. Alhamdulillah berhasil dipraktekkan sahabat..
    Terima kasih

    ReplyDelete
  42. @Saung Web: Minta ijin COPAS juga bos....

    Thanks ilmunya ya...

    ReplyDelete
  43. wiihh keren ni kang.....
    jd pengen dipasang di website ane...
    hehe

    ReplyDelete
  44. Appreciate the recommendation. Will try it out.

    Feel free to surf to my blog post :: how to get a boy to like you

    ReplyDelete
  45. Good day! This is my 1st comment here so I just wanted
    to give a quick shout out and tell you I truly
    enjoy reading through your posts. Can you suggest any other blogs/websites/forums that cover the same topics?
    Thank you!

    my website - pulling away in a relationship

    ReplyDelete
  46. Amazing things here. I'm very happy to peer your post. Thank you so much and I am taking a look ahead to touch you. Will you kindly drop me a mail?

    my blog post; airbnb

    ReplyDelete
  47. I've read several just right stuff here. Certainly worth bookmarking for revisiting. I wonder how much attempt you place to create the sort of fantastic informative site.

    Feel free to surf to my web-site: magic flight launch box

    ReplyDelete
  48. Heya i'm for the first time here. I came across this board and I find It truly useful & it helped me out a lot. I hope to give something back and help others like you helped me.

    Also visit my blog post; gold ira

    ReplyDelete
  49. I've been exploring for a bit for any high-quality articles or weblog posts on this kind of house . Exploring in Yahoo I ultimately stumbled upon this web site. Reading this information So i am happy to express that I've an incredibly
    just right uncanny feeling I discovered just what I needed.
    I such a lot undoubtedly will make certain to do not fail to remember this site and provides it a look regularly.


    My web site; getting your ex girlfriend back

    ReplyDelete

Bagi sobat-sobat silahkan comment disini, Insya Allah saya comment balik di blog anda. Trims atas kerjasamanya

Langganan Artikel

Artikel Gtais : :

Enter your email address:

Delivered by FeedBurner

Total Kunjungan

 

Copyright 2008 All Rights Reserved Revolution Two Church theme !, Converted into Blogger Template by Bloganol dot com ! Modified by Saung Web ! , On Blogger