silahkan buat dollar anda di indoptc sekarang juga

Showing posts with label tutorial blog. Show all posts
Showing posts with label tutorial blog. Show all posts

Friday, February 13, 2009

Membuat Label/Tag Clouds

Nahhh pada kali ini saya akan menulis artikel yang biasanya digunakan di wordpress dan technorati yaitu Tag Clouds.. jika anda belum mengerti tentang Tag Clouds saya akan menerangkan sedikit pengertianya..Tags Clouds adalah sebuah Label yang hurufnya tidak rata maka dari itu dinamakn Tags Clouds yang artinya Tag adalah Label dan Clouds adalah awan jadi rengkumanya adalah Label yang seperti awan atau tidak rata.. Nah jika Tags yang hurufnya berbentuk rata biasanya itu adalah tags yang populer di blog anda jika kecil itu kurang populer... jadi pengertianya adalah semakin besar hurufnya maka menandakan kepopuleran dari Tags tersebut... makanya anda membuat tags dengan kata-kata yang sering digunakan dan tepat dengan isi tagsnya tul gakk

Nah jika Anda belum tau Tags Clouds Saya akan memberikan contohnya niii dibawahhh



komputer
, Blogging, Bisnis Online
laptop, Widget Blog, Yahoo, Google,
blogeer, wordpress, SEO
trik-tips Blog
Pernak-pernik Blog
,
other


Nah contoh diatas adalah tampilan Label yang telah dimodifikasi menjadi Tags Clouds... Semakin besar hurufnya maka semakin populer categorinya

Gimanna anda pengen buat gakk kalau pengen nihh dibawah aku ajari caranya..

  1. Log in Ke Blogger Lalu masuk Menu Layout kemudian Edit HTML

  2. Kemudian Taruh Code dibawah diatas Code ]]></b:skin>

    /* Label Cloud Styles
    ----------------------------------------------- */
    #labelCloud {text-align:center;font-family:arial,sans-serif;}
    #labelCloud .label-cloud li{display:inline;background-image:none !important;padding:0 5px;margin:0;vertical-align:baseline !important;border:0 !important;}
    #labelCloud ul{list-style-type:none;margin:0 auto;padding:0;}
    #labelCloud a img{border:0;display:inline;margin:0 0 0 3px;padding:0}
    #labelCloud a{text-decoration:none}
    #labelCloud a:hover{text-decoration:underline}
    #labelCloud li a{}
    #labelCloud .label-cloud {}
    #labelCloud .label-count {padding-left:0.2em;font-size:9px;color:#000}
    #labelCloud .label-cloud li:before{content:"" !important}


  3. Lalu juga taruh Code Dibawah tepat dibawah Code <head>

    <script type='text/javascript'>
    // Label Cloud User Variables
    var cloudMin = 1;
    var maxFontSize = 20;
    var maxColor = [0,0,255];
    var minFontSize = 10;
    var minColor = [0,0,0];
    var lcShowCount = false;
    </script>



  4. Lalu Scroll Kebawah coba cari Code seperti ini <b:widget id='Label1' locked='false' title='Labels' type='Label'/>
  5. Lalu Ganti code diatas dengan Code dibawah Ini

    <b:widget id='Label1' locked='false' title='Label Cloud' type='Label'>
    <b:includable id='main'>
    <b:if cond='data:title'>
    <h2><data:title/></h2>
    </b:if>

    <div class='widget-content'>
    <div id='labelCloud'/>
    <script type='text/javascript'>

    // Don't change anything past this point -----------------
    // Cloud function s() ripped from del.icio.us
    function s(a,b,i,x){
    if(a&gt;b){
    var m=(a-b)/Math.log(x),v=a-Math.floor(Math.log(i)*m)
    }
    else{
    var m=(b-a)/Math.log(x),v=Math.floor(Math.log(i)*m+a)
    }
    return v
    }


    var c=[];
    var labelCount = new Array();
    var ts = new Object;
    <b:loop values='data:labels' var='label'>
    var theName = &quot;<data:label.name/>&quot;;
    ts[theName] = <data:label.count/>;
    </b:loop>

    for (t in ts){
    if (!labelCount[ts[t]]){
    labelCount[ts[t]] = new Array(ts[t])
    }
    }
    var ta=cloudMin-1;
    tz = labelCount.length - cloudMin;
    lc2 = document.getElementById('labelCloud');
    ul = document.createElement('ul');
    ul.className = 'label-cloud';
    for(var t in ts){
    if(ts[t] &lt; cloudMin){
    continue;
    }
    for (var i=0;3 &gt; i;i++) {
    c[i]=s(minColor[i],maxColor[i],ts[t]-ta,tz)
    }
    var fs = s(minFontSize,maxFontSize,ts[t]-ta,tz);
    li = document.createElement('li');
    li.style.fontSize = fs+'px';
    li.style.lineHeight = '1';
    a = document.createElement('a');
    a.title = ts[t]+' Posts in '+t;
    a.style.color = 'rgb('+c[0]+','+c[1]+','+c[2]+')';
    a.href = '/search/label/'+encodeURIComponent(t);
    if (lcShowCount){
    span = document.createElement('span');
    span.innerHTML = '('+ts[t]+') ';
    span.className = 'label-count';
    a.appendChild(document.createTextNode(t));
    li.appendChild(a);
    li.appendChild(span);
    }
    else {
    a.appendChild(document.createTextNode(t));
    li.appendChild(a);
    }
    ul.appendChild(li);
    abnk = document.createTextNode(' ');
    ul.appendChild(abnk);
    }
    lc2.appendChild(ul);
    </script>

    <noscript>
    <ul>
    <b:loop values='data:labels' var='label'>
    <li>
    <b:if cond='data:blog.url == data:label.url'>
    <data:label.name/>
    <b:else/>
    <a expr:href='data:label.url'><data:label.name/></a>
    </b:if>
    (<data:label.count/>)
    </li>
    </b:loop>
    </ul>
    </noscript>
    <b:include name='quickedit'/>
    </div>

    </b:includable>
    </b:widget>

  6. Selesai Deh kemudian Save
Jika kamu Faham tentang CSS kamu bisa mengotak-atik tampilanya sendiri...

Nahh gimana gampang thoo dengan Tags Clouds kan kita bisa mengetahui Tags mana yang paling populer iya kannn..... kalau begitu sekian dulu yahhh
Masih Ada lanjutnya...

Cara Posting Code HTML

Pasti Anda bingung pada waktu posting Code HTML di blog Anda, pasti yang muncul bukan codenya melainkan hasil dari code HTML-nya, nah untuk yang ingin menulis tentang tutorial blog pasti code HTML banyak diposting, Nah untuk para penulis yang belum tau caranya posting code HTML nih saya kasih caranya.

Caranya cukup mudah, Encode saja code HTML di situs dibawah ini
langsung ke TKP

Nah caranya cukup mudah tinggal taruh code HTML yang ingin di posting lalu klik tombol "Encode", Nah hasil dari Encode itu yang Anda posting di Blog Anda.

Semoga berhasil


Masih Ada lanjutnya...

Menghapus Tulisan "Subscribe To : Post (atom)" Pada Blog



Kemarin aku sempet kesel nih ngeliat tulisan dibawahnih soalnya cukup mengganggu jadi gw putusin untuk ngilangin aja tuh tulisan habis kayaknya kagak ada gunanya sih. Kalo ada yang berminat nih tutorialnya semoga berguna. Ok kita langsung ke TKP untuk menghapus tulisan "Subscribe to: Posts (Atom)" , caranya seperti berikut :

1. Log in ke blogger

2. Klik Layouts> di menu dashboard

3. Klik "Edit HTML"

4. Beri tanda centang pada "Expand Widget Template".

5. Silakan Back up template anda dengan cara klik "Download full template".

6. Cari kode di bawah ini:

-------------------------------------------
<div class='feed-links'>

<data:feedLinksMsg/>

<b:loop values='data:links' var='f'>

<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>

</b:loop>

</div>

----------------------------------------
7. Hapus seluruh kode di atas dan "Simpan Template"
Masih Ada lanjutnya...

 

Followers

Blogroll

mengapa dpr kita bisa bicra seperti itu ya, berkata bangsat saat rapat kayak orang yang gak tau tata krama dan etika saj .!!!!!!!!