Tips Blog | Tutorial Blog | Belajar Blog

Download Icon Cantik dan Menarik

image Untuk mempercantik tampilan blog atau desktop pada komputer sobat, dibawah ini ada beberapa icon cantik dan menarik yang dapat sobat download secara gratis. Sobat juga bisa menggunakan pada apilkasi blog atau web, dengan kualitas gambar yang bagus icon-icon ini bisa menjadi pilihan buat mengisi beberapa bagian di komputer sobat atau paling tidak sebagai koleksi.

 

  1. Round theme icons

    image

  2. Fortune 500 Badges

    image
  3. Set of Social Icons

    image

  4. Manto Smiley Icon Set

    image

  5. Reality

    image

  6. Baggy Icon Set

    image

  7. Flavours Icon Set

    image

  8. Banking Stuff Icons

    image

  9. Practica Icons Set

    image

  10. GP Icons

    image

  11. Music Icons

    image

  12. Email Me Icons

    image

  13. Cemagraphics Icons

    image

  14. Social Media Handycons

    image

  15. Antique Icons

    image

  16. Green and Blue Icon Set

    image

Selamat mendownload dan semoga bisa menambah koleksi icon sobat.

Pasang Widget Lintas Berita di Blog

image Menanggapi pertanyaan sobat ISS pada postingan widget sharing is sexy yang menanyakan perihal seputar pemasangan widget lintas berita di blog. Kebetulan saya belum pernah membahas masalah ini, dan sebenarnya widget lintas berita ini pernah saya pasang di blog ini karena beberapa hal saya hilangkan. Seperti kita ketahui, lintas berita merupakan situs portal tempat orang mempromosikan web atau blog mereka.

 

Hampir semua blogger menggunakan fasilitas lintas berita sebagai media untuk promosi blog atau istilah kasarnya menjadi benalu di lintas berita, dengan total ribuan  halaman/pages yang terindex di google. Dengan begitu blog kita jadi ikut terkenal dan setidaknya mendapat  cipratan traffic dari lintas berita. Untuk mempermudah dalam submit berita atau artikel blog, widget lintas berita ini mungkin bisa menjadi alternatif.

 

image

 

Cara pasangnya sangat mudah, coba perhatikan langkah-langkahnya berikut ini.

 

  • Pada Edit HTML, silahkan klik Expand Template Widget.
  • Letakkan kode css berikut ini diatas kode ]]></b:skin>

     

    #lintas-berita {
    background:#ECE0F8;
    border:1px solid #cccdcd;
    margin:15px 0px 10px 0px;
    padding:10px;
    color:#000;
    font-weight:normal;
    }

    .lintaskiri {
    float:left;
    margin:0px 15px 0px 0px;
    width:380px;
    }

    .lintaskanan {
    text-align:center;
    }

  • Kemudian letakkan kode berikut setelah kode <data:post.body/> atau <p><data:post.body/></p>

     

    <div class='clearfix' id='lintas-berita'>
    <div class='lintaskiri'>
    Jika menurut sobat artikel ini bermanfaat, silahkan vote ke <strong>Lintas Berita</strong> agar artikel ini bisa di baca oleh orang lain.
    </div>
    <div class='lintaskanan'>
    <script type='text/javascript'>lb_skin = &#39;mode2&#39;; </script>
    <script src='http://www.lintasberita.com/widget_vote/lintasberita.js' type='text/javascript'/>
    <noscript>Powered by www.lintasberita.com visit <a href='http://www.lintasberita.com'>Lintas Berita</a></noscript>
    </div>
    </div>


  • Simpan Template.

 

Perhatikan kode css yang berwarna merah, kode tersebut adalah lebar untuk widget sebelah kiri (widget untuk tulisan) harap disesuaikan dengan lebar template. Jika widget lintas berita muncul pada halaman depan blog, maka tambahkan kode

 

<b:if cond='data:blog.pageType == &quot;item&quot;'>

diantara kode yang berwarna hijau dan tutup dengan kode

</b:if>

 

Semoga berhasil.

Pasang Button Social Bookmark di Blog

facebook-8Jika ingin punya blog populer, buatlah konten yang menarik. Namun apakah itu sudah cukup untuk membuat blog kita jadi populer. Tentu dengan pemasangan meta tag yang mumpuni dan keyword yang relevan akan sangat membantu kita dalam meningkatkan traffic blog. Satu cara yang juga tidak boleh kita lupakan begitu saja adalah peran situs-situs social bookmark yang saat ini menjadi alternatif lain para blogger untuk mempromosikan blog mereka.

 

Dengan mensubmit artikel-artikel kita ke situs social bookmark akan memungkinkan kita mendatangkan banyak pengunjung. Untuk melakukan itu, kita memerlukan fasilitas cepat dalam mensubmit artikel kita, salah satu contoh dengan memasang widget atau button social bookmark di blog kita. Hal ini sudah pernah saya bahas sebelumnya pada postingan membuat widget share di blog. Sama dengan yang lalu hanya saja kali ini penerapannya lebih mudah dan dengan button yang lebih besar. 

 

image

Untuk memasangnya sangat mudah, silahkan ikuti langkah-langkahnya berikut ini.

  • Login to blogger.
  • Tuju Tata Letak.
  • Klik Edit HTML �>> Expand Template Widget .
  • Copy dan paste kode dibawah ini setelah kode <data:post.body/>

     

    <div style='clear:both; '>
    <div style='width:60px; float:left;'>
    <script type='text/javascript'>
    digg_url = &#39;<data:post.url/>&#39;;
    </script>
    <script src='http://digg.com/tools/diggthis.js' type='text/javascript'/>
    </div>
    <div style='width:60px; float:left;'>
    <script badgetype='square' src='http://d.yimg.com/ds/badge2.js' type='text/javascript'><data:post.url/></script>
    </div>
    <div style='width:65px; float:left;'>
    <a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Stumble' src='http://lh4.ggpht.com/_7Y9pl24WpQY/S9xSmUeCjGI/AAAAAAAADpY/PwTpE9ERS0U/stumble_thumb%5B1%5D.gif' style='padding:0;margin:0;border:none;'/></a>
    </div>
    <div style='width:65px; float:left;'>
    <a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Delicious' src='http://lh3.ggpht.com/_7Y9pl24WpQY/S9xSe2evJhI/AAAAAAAADpI/u2d3FXmIcCQ/delicious_thumb%5B1%5D.gif' style='padding:0;margin:0;border:none;'/></a>
    </div>
    <div style='width:65px; float:left;'>
    <a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url' rel='nofollow' target='_blank'><img alt='Technorati' src='http://lh5.ggpht.com/_7Y9pl24WpQY/S9xSo_MlhMI/AAAAAAAADpg/iFnP2vmL_D4/technorati_thumb%5B1%5D.gif' style='padding:0;margin:0;border:none;'/></a>
    </div>
    <div style='width:65px; float:left;'>
    <a expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url' rel='nofollow' target='_blank'><img alt='Twitter' src='http://lh4.ggpht.com/_7Y9pl24WpQY/S9xSb_SokmI/AAAAAAAADpA/7BuK9F8-_NY/twitter_thumb%5B1%5D.gif' style='padding:0;margin:0;border:none;'/></a>
    </div>
    <div style='width:65px; float:left;'>
    <a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Facebook' src='http://lh5.ggpht.com/_7Y9pl24WpQY/S9xSi2qVdTI/AAAAAAAADpQ/mZXQ8JqJlnI/facebook_thumb%5B1%5D.gif' style='padding:0;margin:0;border:none;'/></a>
    </div>
    <div style='width:65px; float:left;'> <a expr:href='&quot;http://www.reddit.com/submit?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Reddit' src='http://lh6.ggpht.com/_7Y9pl24WpQY/S9xStOwxCcI/AAAAAAAADpo/2U6vbGMS6GM/Reddit-icon_thumb%5B16%5D.png' style='padding:0;margin:0;border:none;'/></a>
    </div>
    </div>

  • Simpan Template.

 

Semoga berhasil dan banyak mendatangkan pengunjung. Nerd

Memasang Comment Count Di Blog

1274007132_bubble_48 Tutorial memasang comment count memang sudah sering kita jumpai di berbagai tutorial blog, namun tidak ada salahnya kita bahas sama-sama. Kemarin lusa ada sobat blogger yang menanyakan tentang hal ini lewat facebook, dan kebetulan saya belum pernah menulis tutorial ini. Comment count atau comment bubble atau lebih mudahnya adalah kotak kecil yang berisi jumlah komentar dalam setiap postingan. Biasanya comment count pada umumnya terletak dibagian kanan atas postingan. Berikut tutorial singkatnya.

 

  • Masuk ke Tata Letak.
  • Klik tab Edit HTML.
  • Jangan lupa untuk membackup template terlebih dahulu sebelum melakukan pengeditan.
  • Klik radio radio button Expand Template Widget.
  • Kemudian letakkan kode css berikut ini diatas kode ]]></b:skin>

    .comment-count {
    background:url(http://lh6.ggpht.com/_7Y9pl24WpQY/S_AGNIqF3nI/AAAAAAAAD4A/3onsvK0-jmA/1274007079_speech_bubble_48_thumb%5B3%5D.png) no-repeat;
    float: right;
    font-family: maiandra gd, arial;
    font-size: 10px;
    text-align: center;
    width: 28px;
    height: 28px;
    margin-top: -5px;
    margin-right: 2px;
    padding-top: 5px;
    }

  • Setelah itu kode yang ditambahkan adalah seperti dibawah :

    <b:includable id='post' var='post'>
    <div class='post hentry uncustomized-post-template'>
    <a expr:name='data:post.id'/>
    <b:if cond='data:post.title'>
    <h3 class='post-title entry-title'>

    <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <span class='comment-count'>
    <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <b:if cond='data:post.allowComments'><a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a></b:if>
    </b:if>
    </span>
    </b:if>

    <b:if cond='data:post.link'>
    <a expr:href='data:post.link'><data:post.title/></a>
    <b:else/>
    <b:if cond='data:post.url'>
    <a expr:href='data:post.url'><data:post.title/></a>
    <b:else/>
    <data:post.title/>
    </b:if>
    </b:if>
    </h3>
    </b:if>

  • Kode yang berwarna merah adalah kode yang harus sobat sisipkan.
  • Simpan Template.

 

Yang harus diperhatikan adalah margin-top:-5px dan padding-top:5px, karena itulah yang akan menentukan letak tinggi rendahnya widget comment count ini. Silahkan diatur sesuai template sobat, karena setiap template mempunyai karakter yang berbeda-beda.

 

Semoga berhasil.

 

JooGoo Green Template

JooGoo Green Blogger Template
JooGoo Green Blogger Template adalah sebuah template blogger yang menggunakan style personal atau dengan kata lain template yang dibuat untuk keperluan pribadi. Karena dari bentuknya, template ini sedikit mengarah ke bentuk daun dan model buku diatasnya, sehingga memang cocok untuk blog pribadi. Template ini memiliki 2 kolom dan sidebar disisi kanan.

Silahkan sobat lihat saja langsung di demo templatenya, semoga tertarik dan bisa menggunakannya dengan mudah karena template ini tidak mempunyai setingan khusus.