Showing posts with label Belajar Blogger. Show all posts
Showing posts with label Belajar Blogger. Show all posts

Thursday, March 10, 2011

MEMBUAT BLOGROLL UNTUK ARSIP BLOG

Seperti biasa kita harus meng_Edit HTML Blog Kita.

mula-mula pergi design > page element > expand widget template.



untuk new post.

1- cari kod bawah ni. tekan ctrl + F



<a class = 'blog-pager-newer-link' expr: href = 'data: newerPageUrl'

expr: id = 'data: widget.instanceId + "_blog-pager-newer-link"'

expr: title = 'data: newerPageTitle'> <data:newerPageTitle/> </ a>





 2- tukar tulisan hijau dengan kod bawah ni.

    <img src='http://i695.photobucket.com/albums/vv317/elbalcondejaime/left.png'/>



untuk home,

1- cari kod,



<a class='home-link' expr:href='data:blog.homepageUrl'> <data:homeMsg/> </ a>

<b:else/>

<b:if cond='data:newerPageUrl'>

<a class='home-link' expr:href='data:blog.homepageUrl'> <data:homeMsg/> </ a>

</ b: if>



2- paste kod bawah ni dekat tulisan hijau



   <img src='http://i829.photobucket.com/albums/zz220/Xforce-7/Home-Green-icon.jpg'/>



untuk older page,

1- cari kod ni,



<a class = 'blog-pager-older-link' expr: href = 'data: olderPageUrl'

expr: id = 'data: widget.instanceId + "_blog-pager-older-link"'

expr: title = 'data: olderPageTitle'> <data:olderPageTitle/> </ a>



2- ganti tulisan hijau dengan kod di bawah



    <img src='http://i695.photobucket.com/albums/vv317/elbalcondejaime/right.png'/>



pastu save. kalau nak preview dulu.

Tambahan:

Code gambar bisa kamu ganti dengan yang lain,

kalau kode di atas tu tak ada cuba cari kod ni,

newerPageUrl, homepageUrl dan olderpageUrl.

paste kod gambar dekat bawah kod die.

Link Berkelip Warna-Warni

Perhatikan semua link yang terdapat di dalam blog saya, coba sobat sorot dan lihat hasilnya.
Tampak link yang disorot akan berkelip warna-warni seperti pelangi, hehe.



Sobat bisa menggunakan jasa penyedia script gratisan yang ada di Internet yaitu dengan menggunakan jasa
http://www.dynamicdrive.com, filenya bernama rainbow dalam format java script yang bisa sobat download secara gratis.



Atau jika ingin menggunakan hasil download dari saya juga tidak apa-apa, monggo mas..sama gratisnya.

Berikut beberapa langkah untuk membuat link berkelip warna-warni.


^^Langkah Pertama :

  1. Download file script rainbow, klik disini untuk mendownload.

  2. Kemudian extract file tersebut dari format zip menjadi file java.




  3. Kemudian upload file tersebut ke GoogleCode.

  4. Simpan alamat url yang terdapat diatas address bar. Contohnya seperti ini :

http://miscah.googlecode.com/files/rainbow.js 
  1. Setelah itu ubahlah alamat url tadi menjadi seperti ini :



<script src='http://miscah.googlecode.com/files/rainbow.js'/ >


^^Langkah Kedua :
  1. Login Ke Blogger Menggunakan ID sobat

  2. Klik "Tata Letak"

  3. Klik "Edit HTML"

  4. Cari kode seperti ini : </head>

  5. Kemudian copy paste kode tadi dibawah kode </head>

  6. Seperti ini hasilnya :

</head><script src='http://miscah.googlecode.com/files/rainbow.js'/>
  1. Setelah itu "Simpan Template"



Selamat Mencoba !

Membuat Menu Dengan Fungsi Scroll

Bagi blogger pemula seperti saya, membuat menu dengan fungsi scroll ini awalnya saya pikir susah, padahal jika kita mengerti bahasa pemrograman, membuat menu seperti ini sangatlah mudah. Untuk penghematan tempat jika sobat mempunyai daftar menu yang sangat panjang, menu dengan fungsi scroll ini bisa menjadi solusi yang tepat selain menggunakan marquee atau text berjalan.


Dan pembuatan menu ini tidak menggunakan kode HTML yang banyak dan ribet, yup hanya sedikit kode HTML, sobat sudah bisa membuat menunya. Menu ini bisa juga sobat menfaatkan dalam menempatkan blogroll yang panjang atau daftar menu postingan yang sobat miliki.




Untuk membuat menunya sobat hanya membutuhkan kode HTML seperti ini :


<div style="overflow:auto;width:320px;height:250px;padding:10px;border:1px solid #eee"> 



ISI MENU 



</div>




Keterangan :
  • width --> lebar menu

  • height --> tinggi menu

  • padding --> jarak antar tulisan dengan garis pinggir

  • border --> ketebalan garis pinggir



Tinggal sobat kreasikan sendiri sesuai dengan blog sobat.



Contoh kode HTML untuk menu yang saya punya :


<div style="overflow:auto;width:310px;height:200px;padding:10px;border:1px solid #eee">



1.<a href="http://miscah.blogspot.com/2009/04/panduan-membuat-blog.html"> Panduan Membuat Blog</a> 



2.<a href="http://miscah.blogspot.com/2009/04/mengganti-template-blogspot.html"> Mengganti Template Blogspot</a> 



3.<a href="http://miscah.blogspot.com/2009/04/cara-membuat-label-kategori.html"> Cara Membuat Label</a>



4.<a href="http://miscah.blogspot.com/2009/04/untuk-membuat-tampilan-tulisan-atau.html"> Upload Gambar ke Dalam Postingan</a>



5.<a href="http://miscah.blogspot.com/2009/04/cara-pasang-banner-di-blog.html"> Cara Pasang Banner</a>



6.<a href="http://miscah.blogspot.com/2009/04/tutorial-membuat-text-area.html"> Tutorial Membuat Text Area</a>



7.<a href="http://miscah.blogspot.com/2009/04/membuat-favicon.html"> Tips Membuat Favicon</a> 



8.<a href="http://miscah.blogspot.com/2009/04/trik-membuat-read-more.html"> Trik Membuat Read More</a>



9.<a href="http://miscah.blogspot.com/2009/04/cara-pasang-search-engine-di-blog.html"> Cara Pasang Search Engine</a>



10.<a href="http://miscah.blogspot.com/2009/04/menyimpan-file-di-geocitiesyahoocom.html"> Menyimpan File di Yahoo! Geocities</a>



11.<a href="http://miscah.blogspot.com/2009/04/kode-html-tampil-di-postingan.html"> Kode HTML Tampil di Postingan</a>



12.<a href="http://miscah.blogspot.com/2009/04/cara-pasang-meta-tag.html"> Cara Pasang Meta Tag</a>



13.<a href="http://miscah.blogspot.com/2009/04/daftarkan-blog-ke-search-engine.html"> Daftarkan Blog ke Search Engine</a>



14.<a href="http://miscah.blogspot.com/2009/04/alexa-rank.html"> Alexa Rank</a>



15.<a href="http://miscah.blogspot.com/2009/04/tips-membuat-efek-marquee.html"> Tips Membuat Efek Marquee</a>



16.<a href="http://miscah.blogspot.com/2009/05/pasang-kode-tukaran-link.html"> Pasang Kode Tukaran Link</a>



17.<a href="http://miscah.blogspot.com/2009/05/backlink.html"> Backlink</a>



18.<a href="http://miscah.blogspot.com/2009/05/yahoo-messenger-emoticons.html"> Yahoo Emoticons</a>



19.<a href="http://miscah.blogspot.com/2009/04/link-berkelip-warna-warni.html"> Link Berkelip Warna-Warni</a>



20.<a href="http://miscah.blogspot.com/2009/05/tips-membuat-menu-dropdown.html"> Membuat Menu Dropdown</a>



</div>




Hasilnya :




Sedikit keterangan tentang elemen diatas :
  • overflow:auto adalah kode untuk penggulung halaman apabila isi dari halaman tersebut sudah melampaui batas tinggi atau lebar yang telah di tentukan.

  • width:310px adalah lebar bidang yang di inginkan, dalam hal ini adalah sebesar 310 pixel, nilai ini tentunya di sesuaikan dengan keinginan atau di sesuaikan dengan lebar sidebar yang ada. namun, agar selalu sesuai dengan sidebar maka sebaiknya memakai nilai 100% (width:100%).

  • height:200px adalah tinggi bidang yang di inginkan, nilai ini bisa di ubah sesuai keinginan, misal jadi 300px.

  • padding:10px adalah jarak agar tulisan yang ada dalam halaman tersebut tidak menabrak dinding halaman, nilai ini tentu saja bisa di ubah sesuai keinginan. misal : padding:5px.

  • border:1px solid #eee adalah garis pada pembatas setiap sisinya, #eee untuk kode warna abu-abu.



Selamat Mencoba !! 

Membuat Tab View Menu Tanpa Edit HTML

Sebelumnya saya sudah pernah membahas tentang cara membuat tab view menu (menu dengan tab), namun dalam pembuatan tab view menunya kita harus mengedit HTML template. 


Mungkin banyak sobat blogger yang takut gagal sehingga bisa merusak template, padahal tidak mungkin rusak jika sebelum melakukan pengeditan sudah membackup template terlebih dahulu. Hot



Setelah berekksperimen, akhirnya saya coba dengan meletakkan kode script-nya langsung di gadget, ternyata berhasil. Dengan menyatukan semua kode yang ada, pembuatan menu tab view tidak perlu lagi susah payah mengedit HTML
template. Jika sobat sudah pernah membaca postingan saya yang dulu, sobat tinggal menyatukan semua kodenya dan letakkan di gadget, belum tau urutan kodenya?



Baiklah, sekarang login ke blogger, kemudian pada Elemen Halaman sobat klik Tambah Gadget, lalu pilih yang HTML/Javascript. Setelah itu tambahkan kode script menu tab view-nya seperti dibawah ini :

<style type="text/css">

div.TabView div.Tabs

{height: 30px;overflow: hidden}

div.TabView div.Tabs a {float:left; display:block; width: 98px; /* Lebar Menu Utama Atas */

text-align:center ; height: 30px; /* Tinggi Menu Utama Atas */

padding-top:8px; vertical-align:middle; border:1px solid #BDBDBD; /* Warna border Menu Atas */

border-bottom-width:0; text-decoration: none; font-family: "Verdana", Serif; /* Font Menu Utama Atas */

font-weight:bold; color:#000; /* Warna Font Menu Utama Atas */ -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px}

div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active {background-color: #E6E6E6; /* Warna background Menu Utama Atas */ }

div.TabView div.Pages {clear:both; border:1px solid #BDBDBD; /* Warna border Kotak Utama */ overflow:hidden; background-color:#E6E6E6; /* Warna background Kotak Utama */ }

div.TabView div.Pages div.Page {height:100%; padding:0px; overflow:hidden}

div.TabView div.Pages div.Page div.Pad {padding: 5px 5px}

</style>

<script type='text/javascript'>

//<![CDATA[

function tabview_aux(TabViewId, id)

{

  var TabView = document.getElementById(TabViewId);

  // ----- Tabs -----

  var Tabs = TabView.firstChild;

  while (Tabs.className != "Tabs" ) Tabs = Tabs.nextSibling;

  var Tab = Tabs.firstChild;

  var i   = 0;

  do

  {

    if (Tab.tagName == "A")

    {

      i++;

      Tab.href      = "javascript:tabview_switch('"+TabViewId+"', "+i+");";

      Tab.className = (i == id) ? "Active" : "";

      Tab.blur();

    }

  }

  while (Tab = Tab.nextSibling);

  // ----- Pages -----

  var Pages = TabView.firstChild;

  while (Pages.className != 'Pages') Pages = Pages.nextSibling;

  var Page = Pages.firstChild;

  var i    = 0;

  do

  {

    if (Page.className == 'Page')

    {

      i++;

      if (Pages.offsetHeight) Page.style.height = (Pages.offsetHeight-2)+"px";

      Page.style.overflow = "auto";

      Page.style.display  = (i == id) ? 'block' : 'none';

    }

  }

  while (Page = Page.nextSibling);

}

// ----- Functions -------------------------------------------------------------

function tabview_switch(TabViewId, id) { tabview_aux(TabViewId, id); }

function tabview_initialize(TabViewId) { tabview_aux(TabViewId,  1); }

//]]>

</script>

<form action="tabview.html" method="get">

<div id="TabView" class="TabView">

<div style="width: 300px;" class="Tabs">

<a>Judul 1</a>

<a>Judul 2</a>

<a>Judul 3</a>

</div>

<div style="width:300px; height:250px; " class="Pages">

<div class="Page">

<div class="Pad">

Isi menu tab view 1

</div>

</div>

<div class="Page">

<div class="Pad">

Isi menu tab view 2

</div>

</div>

<div class="Page">

<div class="Pad">

Isi menu tab view 3

</div>

</div>

</div>

</div>

</form>

<script type="text/javascript">

tabview_initialize('TabView');

</script>


Untuk lebar menu, font, dan tinggi menu, sobat sesuaikan saja dengan lebar sidebar sobat.

Semoga bermanfaat !

Cara Membuat Efek Zoom Pada Gambar

Pada dasarnya membuat efek zoom pada gambar cukup banyak manfaatnya, selain menghemat tempat, sekaligus mempercantik tampilan blog kita. Ada kalanya dimana kita mempunyai gambar yang sangat besar dan harus di tampilkan dalam ukuran yang besar, wah tempatnya ga cukup nih mas, itu bisa menjadi kendala dalam optimasi gambar yang hendak ditampilkan. Sementara sobat tidak ingin gambar tersebut berlalu begitu saja tanpa sentuhan pengunjung sedikitpun.


Tutorial membuat efek zoom pada gambar ini sangat mudah, cukup menambahkan kode css pada template dan sedikit mengedit kode gambar yang sobat miliki. Ga usah panjang lebar ya, langsung praktek aja. Sip, sekarang silahkan siapkan komputer sobat dulu, plus kopi dan rokok sebagai pelengkap.

  1. Silahkan login ke Blogger terlebih dahulu.

  1. Kemudian klik Tata Letak.

  1. Tuju halaman Edit HTML.

  1. Letakkan kode css berikut ini, tepat diatas / sebelum kode ]]></b:skin>

/* Zoom Efek */
.thumbnail{position:relative;z-index:0}
.thumbnail:hover{background-color:transparent;z-index:50}
.thumbnail span{position:absolute;left:-1000px;visibility:hidden;color: black;text-decoration: none}
.thumbnail span img{border-width:0;padding:2px}
.thumbnail:hover span {visibility: visible;top: 0;left: 60px}
  1. Jangan lupa Simpan Template.

Kode HTMl untuk Gambar adalah sebagai berikut ::


<a href="http://s643.photobucket.com/albums/uu155/miskahiper/?action=view&current=vaio-zoom-1.jpg" target="_blank"><img src="http://i643.photobucket.com/albums/uu155/miskahiper/vaio-zoom-1.jpg" border="0" alt="Photobucket"></a>


Kemudian hapus tulisan yang berwarna hijau, tambahkan dengan tulisan yang berwarna merah, sehingga menjadi seperti berikut :


<a class="thumbnail" href="#thumb"><img src="http://i643.photobucket.com/albums/uu155/miskahiper/vaio-zoom-1.jpg" border="0" alt="Photobucket"><span><img src="http://i643.photobucket.com/albums/uu155/miskahiper/vaio-zoom-1.jpg" width="380px" height="300px";/></span></a>


Sedangkan kode HTMl untuk text adalah sebagai berikut :


<a class="thumbnail" href="#thumb">Contoh Gambar<span><img src=http://i643.photobucket.com/albums/uu155/miskahiper/vaio-zoom-1.jpg /></span></a>


Ukuran besarnya gambar yang akan di zoom silahkan sobat atur sesuai keinginan, silahkan ganti angka yang berkelip yang berwarna merah dengan ukuran yang sobat inginkan saat di zoom, sesuaikan juga dengan ukuran asli gambar agar gambar yang di zoom tidak pecah atau kabur. Oke sob, selamat mencoba ya, semoga berhasil !

Cara Praktis Membuat Scroll pada Widget Sidebar

Jika sudah banyak memasang widget, maka tampilan sidebar bisa terlihat penuh sesak dan berjerjer terlalu panjang ke bawah. Padahal kita ingin semua widget tersebut dilihat oleh pengunjung. Tapi umumnya mereka enggan menscroll halaman terlalu jauh ke bawah, sehingga beberapa widget jelas akan luput dari perhatiannya. Beberapa widget yang cendrung berjejer ke bawah misalnya adalah: arsip blog, label, statistic pengunjung, shout box dan lain-lain.
Nah, salah satu cara yang praktis untuk mengatasi hal ini adalah dengan membuat scroll di samping widget tersebut, yaitu semacam tombol yang bisa ditarik-tarik ke atas dan ke bawah untuk menampilkan isinya secara bergantian. Dengan menggunakan scroll ini, sekaligus kita bisa menghemat ruang pada sidebar. Jika anda belum tau cara membuatnya, anda bisa ikuti beberapa langkah praktis berikut.


1. Masuklah ke halaman Dasbor blog anda lalu klik Rancangan.


2. Kemudian kliklah Edit pada widget yang akan anda beri scroll (meskipun semua widget tersebut nantinya bisa diberi scroll).
3. Sisipkanlah kode di bawah ini ke dalamnya. Yang berwarna biru letakkan di bagian awal dan yang berwarna merah di bagian akhir.



<div style="overflow:auto; width:100%px; height:200px; padding:10px; border:1px solid #999999;"> 



</div>



4. Sebagai tambahan: gantilah angka 200 untuk tinggi kotak scroll yang anda ingikan. Kemudian angka 10 untuk jarak isinya dari kiri dan atas. Lalu angka 1 untuk merubah ukuran garis pinggir kotaknya dan angka 999999 untuk merubah kode warnanya.



5. Contoh cara penyisipannya akan tampak seperti ini:
<div style="overflow:auto; width:100%px; height:200px; padding:10px; border:1px solid #999999;"> 
<center><script type="text/javascript" src="http://feedjit.com/serve/?vv=364&amp;dd=&amp;wid=cbf569f27c6e7ffb&amp;pid=0&amp;proid=0&amp;bc=EDF0F3&amp;tc=1F3055&amp;brd1=EDF0F3&amp;lnk=1F3055&amp;hc=1F3055&amp;ww=170"></script><noscript><a href="http://feedjit.com/">Feedjit Live Blog Stats</a></noscript></center>
</div>


6. Jika sudah jangan lupa klik SIMPAN dan tunggulah hingga proses selesai.
7. Sekarang lihatlah hasilnya dengan mengklik Lihat Blog.

Cara Membuat Scroll Pada Blog Archive (Arsip Blog) Blogspot

Jika sobat membaca tiga tulisan sebelumnya, yakni: Membuat Scroll Pada Bloglist, Membuat Scroll Pada Linklist, dan Membuat Scroll Pada Label, pasti dapat menyimpulkan bahwa cara untuk membuat scroll pada gadget blogger/blogspot adalah sama, yaitu dengan cara menambahkan perintah overflow pada kode <div class='widget-content'>. Demikian juga jika kita membuat scroll pada blog archieve ini.



Blog archieve atau arsip blog yang mengunakan pilihan hierarki biasanya akan memanjang tak beraturan, sesuai dengan jumlah artikel yang kita publish tiap bulannya (bisa juga mingguan, tergantung pilihan kita). Tentu saja ini akan sedikit mengganggu penampilan blog kamu karena panjang sidebar menjadi tidak menentu. Untuk itulah perlu dibuatkan scroll agar panjangnya tetap sesuai aturan yang kita buat.



Untuk membuat scroll pada blog archieve ini tidak jauh beda dengan membuat scroll pada gadget blogger/blogspot yang lain, yaitu sebagai berikut:





• Dari halaman dasbor, klik Tata Letak - Edit HTML.

• Beri tanda centrang pada Expand Template Widget.

• Kemudian cari kode type='BlogArchive' (gunakan Control F atau F3).

• Perhatikan kode yang ada di bawahnya, seperti ini:





<b:includable id='main'>

<b:if cond='data:title'>

<h2><data:title/></h2>

</b:if>

<div class='widget-content'>

<div id='ArchiveList'>



• Tambahkan perintah style='overflow:auto; height:200px' pada kode yang berwarna biru, sehingga menjadi seperti ini:



<b:includable id='main'>

<b:if cond='data:title'>

<h2><data:title/></h2>

</b:if>

<div class='widget-content' style='overflow:auto; height:200px'>

<div id='ArchiveList'>



• Atur ukuran tinggi (height)-nya sesuai kebutuhan.

• Simpan hasil editing ini dan ucapkan Alhamdulillah.....



Ok, segitu aja sob. Semoga tidak bosen dengan bahasan yang itu-itu melulu, hehehe...

Selamat mencoba...

Cara Membuat Spoiler

Spoiler sendiri fungsinya adalah untuk memperkecil postingan, kode script atau tulisan agar tidak makan tempat. Sebenarnya sobat juga bisa menggunakan menu dengan fungsi scroll atau bisa juga dengan menggunakan text area untuk menghemat tempat dalam penulisan kode script atau gambar.



Spoiler ini bisa sobat letakkan di postingan, mungkin sobat gunakan untuk meletakkan kode script yang panjang. Atau bisa juga meletakkan di sidebar, header atau footer blog.



Contoh Spolier :

Spoiler:


Letakkan kode script, HTML dan teks anda disini









Untuk membuat spoiler, silahkan sobat copy kode script nya dibawah ini :



<div style="margin: 5px 20px 20px;">

<div class="smallfont" style="margin-bottom: 2px;"><b>Spoiler</b>: <input value="Open" style="margin: 0px; padding: 0px; width: 50px; font-size: 11px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Close'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Open'; }" type="button">

</div>

<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">

<div style="display: none;">



Letakkan kode script, HTML dan teks anda disini



<br>

</div>

</div>

</div>





Keterangan :

1. Untuk tulisan Open dan Close bisa sobat ganti sesuai keinginan.

2. Width : 55px untuk lebar spoiler.

3. Font-size: 11px untuk besar tulisan pada kotak spoiler.

4. Tulisan Spoiler adalah judul, silahkan ganti sesuai keinginan sobat.

Selamat mencoba !

Tuesday, February 22, 2011

Ganti Tampilan Mouse/Pointer Di Halaman Blog

Ganti Tampilan Mouse/Pointer Di Halaman Blog 

Caranya:

1. Masuk account Blogger.

2. Dashboard/dasbor

3. Layout/tataletak trus pilih EDIT HTML



penting, jangan lupa mencentang "Expand template widget"

ma Download template Lengkap, buat Backup-nya.







4. Trus cari kode berikut body {

cari pakai contrl F

Kalau sudah ketemu, kalian Copy kode dibawah ini :



cursor: url("http://i221.photobucket.com/albums/dd141/ryntoz/love.gif"), default;



5. Paste kan persis dibawah kode : body { tadi



Url yang tersedia tu Url untuk cursor pada halaman blog ini, kalo mw yang beda bisa di cari di photobucket.com pakai kata kunci cursor SELESAI dech.....





Pasang Google Translate di Blog

Kali ini aku akan posting cara pasang Google translate di blog. Widget asli dari google tampilanya tidak semenarik widget ini ... Widget Google translate kali ini hasil kreasi sang master Blogger kita yaitu Kang Rohman... Widget yang akan terpasang dalam bentuk bendera2 yang sangat menarik dan jika mouse anda arahkan ke gambar-gambar bendera yang ada akan terlihat sedikit efek blur sebagai pemanis.
Contoh sreenshotnya:








langkah2 untuk membuatnya adalah :

1. Login to Blogger kemudian pilih "Layout"

2. Klik pada "Page Element" trus pilih "Add a Gadget --> HTML/Javascript" (Tempatnya terserah kamu).

3. Copy Paste Script Berikut:


-----------------------------------------------------------------------------

<style>



.google_translate img {

filter:alpha(opacity=100);

-moz-opacity: 1.0;

opacity: 1.0;

border:0;

}

.google_translate:hover img {

filter:alpha(opacity=30);

-moz-opacity: 0.30;

opacity: 0.30;

border:0;

}

.google_translatextra:hover img {

filter:alpha(opacity=0.30);

-moz-opacity: 0.30;

opacity: 0.30;

border:0;

}



</style>



<div>



<a class="google_translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGd_RIeMna0C83eeTs8oTGnuECXznkN7-0dBySSzTIRGfshoomH0Ki3cWLiMjtzw9OVsxU2oW-29CVH1o9YgHCZQ6Tf0oIsfYbEAspex3UrOAfVjTbWY2j55O7zdC96IXb_SqOwYsMsCM/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>

<a class="google_translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxCK0USwM0dXtceDSdj5VxuPDN12GQew72FpIHRwP_f5ULfIbqqZR1UWnB4emvEkLNnJxc4dJAOUPDYZv2Md_hZloxTtJbDa7rb-Z1oNutXyKtVvmUYhQB2TuVEZCsGFd29wYn2SJUdww/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>

<a class="google_translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheAVe8Yuv4PwPYMHNAiiOr9fCqhO5OkEMmi81L8bomg-9r8nlo1-NchfqRtydpiLcoyNXQ7fA_JHIbUKPxE5BjN15ZBP-vD_KZ19ARGC6j6s0Ne5VLRYX9YxxwUyWjFlPmU4en94cCVYw5/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>

<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNcHLqOwjByBDuslGuQWycd1Mh7-Ekk-j9_U8K6wFLFgrqZs91gLrjGzp9x_lCmr8dbjVVWYv8KsOI_cnGWeS280sUudKyjwQWluP_C53WOTR67L9j-nIcPQPCPAMKAbAdj9ApeZzOX4j4/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>

<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7q0mM0HzzdggkiwcTFSOHJd8xAHUttVjrUiZFnX08Ci9K38tRjt-Z97eRiZY-SD9Z0uI4LcCAMrX_Ql4piQhLrzQmGbD5I8kH-PyKXFrkAOPoRrKhsP2vuGkB3bUtBHUIs6zekk2fjlY/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>

<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhH1Vacktl7A96ocBcWmhZr9oGWUy1vTAXKxOCq-rw1IJkSRp-JbqlZ0NrdpjFbzMknVaUwoSpplKDT47HAoH-4zuBFu-25D_wawr2gi9UGIXR3MwCnWjXQ57TpDcVMVoGKb4j0S7uqx2E/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>

<br /><br />

<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigIOv2St_KQ2WRbVxmkjQHj7hLgHkbjZxv-L9ytFVgNuisWQrQsY0hc0pwq4GjS9jks6cYsyLYDb_2miqpyHDXxfnp5ETdwvBKnkVz5mo4wwKyL8olU0YMQrXK_p77zqZBVT7DjyQAkDc/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>

<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvAIwJRr7zIXOnbFVd_JsW-upxM0wy8sA_pYr7-Ua0WvpetIOF5D32eW43LWhN9k1uj3zpXHQOcU5e7ms8de7q7jCe6pYTKpv81FL8J6TrPN2sTxeVp5f8LgofOtyuTVl6E2iJBM_BVIk/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>

<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8BiClNmAV_g0027rTA4jqfrCZcIxLdRxASlWC9qGW5DkQFtreZd3CMZH2DSwu8HS7B_TVzcj8iqOs0IefkS28fgvrGZgJXK_fHE4lAZsJb0ZV0CrmPDvy18na0tyQTzcW54Em-5cGBdsp/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>

<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFScWqW9M135U6mlVLW_XqwizRFTdf5XlwGzE0TmttT7ogB_7OHK5FF55ggw2u25DEmMSQ0Do9bA0RIbOEobJA_SRDaZw-EE6zjgPZv4epzDkTvtT6lcwehiOca28GmWMeLRpv3RRluww/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>



<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjDSXVxVsIywQRiaAHphvTVDaFN8GAan4kmxvEtZCDY8jMKOLduhQ4HZyZcsV3rmFUOtIsJAW3NzrqLBqtNDpjsr9-2yGBF1GoDfegP6CNzuhcMv3iy_mNnBCcmDXDtYFLl6SnLTx4OMQ/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>

<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVz60VjcU2fJQwAdkMrO4Wysy0Ktm-EpB5mQtXneaVCnfYWSUwzXs0_elE1D9hEstdZyUC1UWkyzAkLk_dPqW_Y5YsG6qP-DnwvivSHqJKoQiCwrcLJv8dIWgw30haQ5G06Pr115RoeYA/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>

</div> <div style="font-size:10px;margin:8px 0px 3px 0px">



by : <a href=http://www.blogspottutorial.com/>BTF</a>

</div>


----------------------------------------------------------------------------------

4. Klik tombol Simpan dan lihat hasilnya ...

Macam Macam Jam Digital Buat Blog

Macam Macam Jam Digital Buat Blog!

Caranya : 1. Masuk ke Dasbor

2. Pilih Tata Letak

3. Tambah Gadget / Add as Target

4. Pilih HTML/Java Script



Ni kode beserta contoh jamnya

Aple Jam



Code

<embed src=http://fc08.deviantart.com/fs49/f/2009/196/a/7/appledigitalclock_by_blogclocks.swf quality=high pluginspage=http://www.macromedia.com/go/getflashplayer type=application/x-shockwave-flash width=120 height=140 wmode=transparent></embed>





Jam Spongebob



Code  

<embed src=http://fc01.deviantart.com/fs45/f/2009/139/2/6/Spongebob_Clock_by_blogclocks.swf quality=high pluginspage=http://www.macromedia.com/go/getflashplayer type=application/x-shockwave-flash width=150 height=127 wmode=transparent></embed> 



Jam One Piece 



Code

<embed pluginspage="http://www.macromedia.com/go/getflashplayer" src="http://fc05.deviantart.com/fs47/f/2009/169/4/1/One_Piece_Flash_Clock_by_sd0711.swf" type="" wmode="transparent" height="150" width="150"></embed>



Jam Naruto



Code

<embed pluginspage="http://www.macromedia.com/go/getflashplayer" src="http://fc03.deviantart.com/fs30/f/2008/139/2/b/Naruto_turns_to_sasuke_clock_by_sd0711.swf" type="" wmode="transparent" height="250" width="180"></embed>



Jam Sasuke



Code

<embed pluginspage="http://www.macromedia.com/go/getflashplayer" src="http://fc02.deviantart.com/fs29/f/2008/139/9/0/Naruto_Sasuke_Flash_Clock_by_sd0711.swf" type="" wmode="transparent" height="220" width="180"></embed>

Monday, February 21, 2011

Cara melihat pengunjung blog atau web dengan detail

Setelah lama saya mempelajari dan mencoba berbagai feature tentang bagaimana cara melihat pengunjung blog, akhirnya pilihanku jatuh ke feature yang satu ini, karena selain 100% free, fasilitas dengan simulasi menggunakan flash yang di berikan oleh web tersebut cukup lengkap dan detail karena kita bisa melihat pengunjung tersebut berdasarkan Negara, IP, Browsing yang di gunakan, Jumlah pengunjung tiap hari, keyword, dan masih banyak yang lainnya.


Dari sini kita bisa jadi lebih tahu dan merefisi blog kita, karena juga ditunjukkan juga berapa menit pengunjung tersebut singgah di blog kita dan apakah pengunjung tersebut menutup blog kita sebelum loadingnya selesai.


Cara daftarnya pun juga sangat mudah, hanya dengan memasukkan bio data kita. jika sudah jadi anggota langsung daftar blog kita, pilih tampilan yang sekiranya cocok dengan blog kita, jika sudah ambil scrip nya, beres deh.
Dan jika pengunjung kita sudah 100 misalnya, trus baru mendaftar ke web tersebut kita juga bisa set visitor & page view nya dengan nilai 100 atau menurut keinginan kita.




Menu TRAFFIC
Feature ini dipergunakan untuk melihat berapa jumlah pengunjung berdasarkan jam, hari, bulan dan 60 hari terakhir.


Summary
Jika anda pilih menu ini akan muncul dua gambar di bawah ini:
untuk melihat jumlah pengunjung berdasarkan hari dihitung mulai dari 30 hari terakhir.
di bawah ini untuk melihat jumlah pengunjung per 1 jam, dihitung mulai dari 1 hari.


Menu REFEREED
Feature ini digunakan untuk melihat pengunjung yang masuk ke blog kita dari web lain, seperti google,yahoo, shoutmix, blog atau web orang lain.
From website
menu ini di pergunakan untuk melihat jumlah pengunjung terbanyak berdasarkan referred url, terdapat pilih show reffered page, semisal pengunjung anda dari shoutmix maka akan terlihat idnya, dan masih ada banyak lagi, nanti silahkan anda coba sendiri. 3 gambar di bawah ini adalah contoh gambarnya.


Searching engine trend


Menu VISITOR
Feature ini digunakan untuk melihat banyak pengunjung kita menggunakan Operating System, software browsing yang digunakan, languages, screen resolution, Negara, Kota,dll.


Menu LAST 20.000menu ini di pergunakan untuk melihat pengunjung berdasarkan IP, reffered, pages, geolocities anda tinggal memilih dengan menekan pada tab yang telah disediakan oleh web tersebut. di bawah ini adalah contoh gambarnya.
Cukup ini aja dulu penjelasan dari saya untuk lebih jelasnya langsung daftarkan blog Anda ke web tersebut di alamat histat


posting ini saya buat atas rasa terimakasih saya, karena sangat membantu untuk lebih meningkatkan dan memperbaiki blog saya, sekian dan terima kasih, selamat mencoba.

Wednesday, February 16, 2011

Cara Mengetahui Ranking dan Harga Blog

Mungkin tulisan yang mengulas ini sudah banyak dan sering sekali muncul atau mungkin ini sudah usang karena bayak sekali yang telah mengulas ini sejak dulu.
Tapi bagi rekan2 yang masih awam (seperti saya), mungkin ini perlu di angkat kembali agar yang seperti saya atau yang masih awam dalam dunia Blog sangat berarti.


Yang jelas memiliki blog merupakan kepuasan tersendiri bagi si pemiliknya. Karena dengan memiliki blog kita dapat saling berbagi informasi dan inspirasi kepada dunia. Terlebih jika blog kita dapat memperoleh penghargaan dengan menempati ranking terbaik atau setidaknya masuk 10 besar dalam jagad dunia maya. 
Bahkan kalau blog kita ada yang menghargai tinggi (dengan dollar) semakin PD aja kita ngegarap blog kesayangan kita.


Tapi berbicara bagaimana cara mengetahui ranking blog serta harga blog kita?
Ya, jika rekan2 yang masih awam dan ingin mengetahui bagaimana sih caranya?? Baiklah ikuti langkah ini:


Mengetahui Ranking Blog :

1. Rekan2 dapat mengunjungi http://www.rankwidget.com/ pada browser anda atau bisa langsung klik di sini

2. Setelah anda masuk, ketikkanlah nama URL blog anda pada kotak “Type the URL of your website/blog and click “Get Rank”

3. Pilihlah salah satu jenis ranking dari Google Page Rank, Alexa Traffic Rank, Technorati Blog Rank, atau yahoo! Search InLink

4. Setelah dipilih salah satunya, klik kotak “Get Rank”

5. Dan hasilnya akan kelihatan kan



Itu cara untuk mengetahui Ranking Blog kita, terus bagaimana caranya untuk mengetahui berapa sih kira-kira harga Blog kita itu??


Untuk mengetahui Harga Blog :

1. Rekan-rekan dapat mengunjungi http://www.business-opportunities.biz/projects/how-much-is-your-blog-worth/ pada browser anda atau langsung klik di sini

2. Setelah anda masuk, ketikkan nama URL blog anda. Contoh: http://nama bloganda.blogspot.com pada kotak kosong yang telah tersedia.

3. Klik kotak “Submit.”

4. Dan hasilnya akan kelihatan kan.



Itulah sekelumit bagaimana cara kita untuk mengetahui Ranking Blog serta Harga Blog kita.

Mudah-mudahan berguna ada manfaatnya. Amin!





Show this rank on your website / blog

Choose an icon below, copy-paste the code into your page HTML. To support our operation, you agree that we place pop-under ads behind your site by using this. The pop frequency is once per month.

RankWidget.com


 

RankWidget.com


 

RankWidget.com








 

RankWidget.com


   

RankWidget.com


   

RankWidget.com


   



   

RankWidget.com


   

RankWidget.com


   

RankWidget.com


 



RankWidget.com