Memasang Fitur Chat di Blog

Cbox merupakan fasilitas buku tamu yang bisa kita pasang di blog kita. fungsinya yaitu sebagai media penampung jejak coretan- coretan sapa maupun saran yang biasanya dipasang di bagian sidebar sebuah blog. Cbox sangat membantu dalam proses blogwalking, karena dengan fasilitas ini kita dapat mengetahui link pengunjung blog kita yang mengisi buku tamu kita [jika mereka mencamtumkan url websitenya], sehingga kita bisa saling berkunjung kembali / kunjungan balik. kalau pada postingan sebelumnya kita telah membahas cara memasang shoutbox di blog. Cbox memiliki fungsi yang sama seperti halnya Shoutbox. Akan tetapi perbedaan mendasarnya mungkin pada tampilannya dan juga untuk memperoleh Cbox ini kita harus Register / Daftar terlebih dahulu.Cara Daftar CBOX disini. Tetapi semua mudah dan cepat dan FREE alias gratis 100%. Selain itu Cbox juga dapat di kustomisasi dengan memberikan beberapa smile tambahan.

Pasang Cbox di blog blogspot:

• Login ke akun cbox sobat, kalau belum DAFTAR DISINI
• Klik Publish
  
  
  
  
  
• Lalu Copy  kode-kode yang telah tersedia
• Lalu Login ke akun blogger sobat
• Pada halaman Dashboard, Pilih Tata Letak
• Klik Add Gadget - HMTL/Javascript
• Lalu pastekan kode cbox tadi
• langkah berikutnya adalah mungkin penyesuaian lebar dan tinggi cbox agar sesuai dengan tempatnya.
• Kalau sudah,klik Simpan

Membuat Buku Tamu Tersembunyi

Kalau sobat ga tau lagi mau taruh buku tamu di mana, buat aja buku tamu yang tersembunyi. dan kalau diklik akan langsung terlihat.

Contohnya kamu bisa lihat di blog saya yang lain (sekalian promosiin he he), dan klik tab yang berwarna hijau tersebut. Dan buku tamu itu akan bergerak keluar, sehingga yang tadinya tidak kelihatan akan jadi terlihat.

Nah ga perlu panjang lebar lagi mari kita lihat cara membuatnya:

caranya :

1. Masuk ke account Blogger kamu, pilih "Layout" kemudian "Page Elements",
2. Klik "Add a Gadget" (yang mana aja oke), kemudian pilih "HTML/JavaScript",
3. Copy-paste kode di bawah ini:

Ni codenya:

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()">   </div>

<div class="gbcontent">

<!-- Paste kode buku tamu sobat di sini -->

<br/>
<center><a href="http://www.adjiebrotot.co.cc/2010/10/membuat-buku-tamu-tersembunyi.html"><button style="width:300px; background:#345487; color:#FFFFFF">Get This Widget Here!</button></a>
</center>

<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

</div>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>
 

4. Pada kode di atas, Tulisan yang berwarna merah di atas ganti dengan kode buku tamu yang kamu dapatkan dari situsnya,

5. Kamu juga bisa atur posisinya. Ubah aja nilai atribut top-nya. Kalau mau lebih ke atas dikit, ubah jadi 30px atau 20px, terserah kamu. 

6. Selamat mencoba!

Terima Kasih Atas Kunjungan Anda..!

Menambahkan Sumber Otomatis di setiap artikel yang di copas

Kali ini saya bakal bahas caranya Menambahkan Sumber Otomatis di setiap artikel yang di copas oleh pembaca anda. terkadang mereka malas menyertakan sumber walaupun hanya tinggal copas linknya saja, namun alangkah baiknya jika kita membuat auto sumber untuk mereka, jika mereka blog yang tau diri, gak mungkin di hapus. so gimana caranya? nih saya ajarkan artikel ini 100% asli adjie brotot

1. Masuk ke website tynt.com
2. Jika sudah, klik tombol "get started" seperti di bawah ini

3. Lalu lakukan Registrasi seperti yang di suruh. Domain di isi alamat blog kamu, lalu yang lainnya dapat di sesuaikan.

4. Lalu kamu akan sampai ke halaman Your Script, Link Prefix bisa di isikan apa saja misalkan sumber :, dikutip dari :, source :, dll.
dan Link Suffix di pilih URL. langsung Get Your Script

5. Taruh kode itu di bawah kode <head>
6. Jadi dehhh sekarang artikelmu gak bisa lagi di bajak!

Website Yang Menyediakan Emoticon

Ini adalah beberapa website yang menyediakan emoticon untuk Cbox kamu atau Shoutmix kamu :

1.  www.myem0.com
2. www.smileyvault.com 
3. www.addemoticons.com 
4. www.freesmileys.org
5. www.laymark.org 

itulah beberapa  website yang saya ketahui
Sudah segitu saja yang bisa saya sampaikan.....

Membuat Arsip Blog Mempunyai Fungsi Scroll

Nih trik sebenernya di ajarin sama temenku Radit sekarang saya mau Repost lagi dengan script yang sedikit di edit-edit ala adjie brotot. Ok Langsung aja di mulai.

1. Login Ke Blog anda (kalau blog saya berarti anda hacker)
2. Pencet Klik Rancangan >> Edit HTML >> Expand Template Widget
3. Cari Kode Seperti ini

<b:widget id='BlogArchive2' locked='false' title='Nama_Widget_Anda' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>

Nama_Widget_Anda diganti dengan judul widget Arsip Blog anda

4. Lalu Tambahkan Kode ini di bawah <div class='widget-content'>

<div style='overflow:auto; width:auto; height:250px;'>

250px bisa di sesuaikan dengan kebutuhan

5. sekarang tengok sedikit ke bawah, cari kode seperti ini

<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
<b:include name='quickedit'/>

6. sekarang tambahkan sebuah kode </div> di atas <b:include name='quickedit'/>
7. Maka Hasilnya akan seperti ini :

<b:widget id='BlogArchive2' locked='false' title='Arsip Blog Ini' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div style='overflow:auto; width:auto; height:250px;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
<b:if cond='data:style == &quot;HIERARCHY&quot;'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == &quot;FLAT&quot;'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
</div>
<b:include name='quickedit'/>

8. Save, lalu selesai deh!

Menambahkan Emoticon di Cbox

 akhirnya aku dapet sebuah ide baru, yaitu Cara Menambah Emoticon di Cbox caranya cukup mudah.. cukup beberapa klik tak sesulit Membuat Komentar Facebook caranya begini.. langsung saja ke TKP...


Langkah 1. Carilah Situs yang menyediakan Emoticon Gallery
Pertama kalian cari situs yang menyediakan emoticon, yang bisa kalian pilih. contohnya untuk emoticon kaskus bisa di lihat disini http://www.kaskus.us/misc.php?do=getsmilies&editorid=vB_Editor_001


Langkah 2. Login Ke Cbox
 Lalu Login Ke Cbox anda dan Modifikasi Emoticon dengan cara Klik Options lalu Smile

>

Langkah 3. Delete Semua Emoticon Default
Delete semua emoticon yang sudah ada, sampai pada gambarnya bertanda X

Langkah 4. Ganti Code
Kemudian ganti kode (Code) dengan beberapa kode yang biasa digunakan, contoh bisa lihat di bawah ini:

:), :D, =)), sobat, blogwalking/jalan-jalan, berkunjung, baca-baca, award, ok, :P, cool
Selanjutnya bisa teman-teman modifikasi sendiri, jika lupa kodenya bisa teman-teman lihat Yahoo Messenger Smile Icons. Untuk lebih jelasnya bisa lihat pict di bawah ini (klik gambar untuk memperbesar),

                          Save dehhh.... Selesai....

 

Cursor Bertabur Bintang

Cursor yang bertabur bintang adalah salah satu cara untuk mempercantik tampilan blog.karena saat cursor di geser kursor tersebut akan mengeluarkan bintang-bintang. Contohnya Bisa kalian lihat disini.

Setelah melihat Contohnya Tertarik tidak sobat untuk membuatnya ?jika tertarik silakan ikuti tutorial Cara Membuat Cursor Bertabur Bintang di bawah ini untuk Membuat Cursor Bertabur Bintang.


1.Login ke blogger.

2.Klik Tatat Letak.

3.Klik Tambah Gadget.

4.Pilih HTML/javascript.



5.Letakkan HTML di bagian paling atas..

6.Pilih lalu Copy dan paste kode di bawah ini ke dalah kotak HTML/javascript tadi .

Bintang biru

<script src="http://denisahlan.netau.net/bintang.biru.js" type="text/javascript"></script>

Bintang hijau

<script src="http://denisahlan.netau.net/bintang.hijau.js" type="text/javascript"></script>

Bintang merah

<script src="http://denisahlan.netau.net/bintang.hijau.js" type="text/javascript"></script>

Bintang putih

<script src="http://denisahlan.netau.net/bintang.putih.js" type="text/javascript"></script>

Bintang ungu

<script src="http://denisahlan.netau.net/bintang.ungu.js" type="text/javascript"></script>

Mengganti Cursor di Blog

klik Rancangan.. Lalu Tambah Gadget Terus Add HTML/Javascript

Langsung aja cari gambar yg cocok buat cursor kamu.. di google juga ada
masukin code ini..

<style type="text/css">

body {cursor:url("Alamat Cursor"),default}

</style></span>

kalo kesusahan pake aja kursor teman saya.. rosyid

<style type="text/css">

body {cursor:url("http://baykun.byethost15.com/cursorbiru.ico"),default}

</style></span>

nih contoh cursor lainya:

kode:http://www.freediskspace.com/images/cursor.gif

kode:http://sunnyneo.com/pointers/kassegatcursor.gif

kode:http://img210.imageshack.us/img210/7206/curseruj8.gif

kode:http://img107.imageshack.us/img107/128/curser1ge2.gif

kode:http://216.57.120.68/sms//teachers/sbuzzell/images/cursor.gif

kode:http://www.ouachita.lib.la.us/images/cursors.gif

kode:http://divinegiggle.com/images/fairy_cursor.gif

dah gitu doang gampang kan?

Cara Mengganti Favicon Blogger

Cara mengganti favicon di blogger. Favicon adalah icon/gambar yang terletak pada address bar dari suatu web browser. Setiap situs atau blog biasanya memiliki favicon.

Pada blogspot, favicon yang dibuat berupa logo blogger berwarna orange. Favicon ini tidak bisa diganti begitu saja melalui setting/pengaturannya. Lalu bagaimana jika anda ingin mengganti/merubah favicon ini?

Sebenarnya cara mengganti favicon blogger ini cukup mudah. Anda bisa menggantinya melalui pengeditan layout. Berikut tutorialnya.

1. Masuk ke akun blogger anda.
2. Pilih menu Layout (Tata Letak) » Edit HTML.
3. Cari kode di bawah ini.
   
   
   
   <b:include data='blog' name='all-head-content'/>
   
   
4. Copy-paste kode berikut di bawah kode tadi.
   
   
   
   <link href='url-gambar' rel='shortcut icon'/>
   Ganti tulisan berwarna merah dengan url gambar yang akan dijadikan favicon.
   
   
5. Simpan template.

Cara Auto Hide Navigation Bar Blogger

Kali ini aku mau posting yg mungkin berguna bagi sobat-sobat semua... Kalo Seandainya gak berguna juga gak papa... (cuma iseng).. awalnya googling dan akhirnya nemu di kolom tutorial juga... (cape deh..) but dont worry aku jelasin caranya


Caranya Gampang..
1. Login Ke Blogger
2. Klik Rancangan > Edit HTML
3. Cari Kode Body { abis itu masukkan kode ini di atasnya..

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)} #navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100,FinishedOpacity=100)}

Menampilkan Status Yahoo Messenger Di Blogmu

Dalam trik kali ini kita akan coba membahas tentang "Bagaimana Caranya Menampilkan Status Offline/Online Yahoo Messenger". Trus fungsinya apa nih? gini, kalo ada misalnya ada penandanya seperti itu kan nanti pengunjung blogmu akan bisa langsung berinteraksi langsung denganmu, nha kalo gitu kan nanti pengunjung blogmu jadi tambah sayang ma kamu :p
Ok Langsung aja, Contohnya akan seperti ini, jika status kamu offline maka gambarnya akan seperti ini :



terus jika kamu online maka iconnya akan berubah seperti ini:



Cara buatnya sangat gampang kamu tinggal copy script berikut ini trus kamu pasang di sidebar kamu, udah tahu kan cara pasanganya, itu lho seperti kalo km masang "page element", Masuk ke "Page Element" trus "Add a Gadget --> HTML/Javascript".

Cara buatnya sangat gampang kamu tinggal copy script berikut ini trus kamu pasang di sidebar kamu, udah tahu kan cara pasanganya, itu lho seperti kalo km masang "page element", Masuk ke "Page Element" trus "Add a Gadget --> HTML/Javascript".

<a href="ymsgr:sendIM?paijo"> <img src="http://opi.yahoo.com/online?u=paijo&amp;m=g&amp;t=2&amp;l=us"/>
</a>

Ganti text yang berwarna merah  dengan id YM kamu.
Perhatikan angka "2", itu bisa kamu ganti dengan angka yang lain (1-6) dan hasilnya gambar yang ditampilkan akan berbeda-beda.

Memasang Translator di Blog

Memasang widget translator atau "Penerjemah" pada blog banyak sekali gunanya. Translator ini berguna apabila ada pengunjung dari negara lain yang secara sengaja maupun tidak yang melihat blog kita dan tidak tahu bahasa kita maka mereka bisa menggunakan widget ini untuk menterjemahkannya kedalam bahasa yang mereka inginkan (tentunya yang sudah ada di widget ini). Widget ini sudah support untuk bahasa Indonesia. Dan kalo kamu mau, translator ini bisa juga untuk menterjemahkan tugas dari sekolah/kampus secara mudah. Dan hasilnya bisa lebih bagus daripada software transtool lho. Gimana? mau membuatnya? caranya mudah lho. Gini nih...

1. Login ke Blogger trus pilih menu "Layout" atau "Tata Letak"
2. Kemudian klik pada "Add Gadget" atau "tambah gadget=".
3. Lalu pilih HTML/Javascript"
4. Kemudian masukkan script berikut ini kedalamnya.

<script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/translatemypage.xml&up_source_language=id&w=160&h=60&title=&border=&output=js"></script>

Membuat Pesan Pembuka & Penutup

Hallo teman-teman blogger, mohon maaf blog ini sempat mati suri akibat dari kesibukan saya yang tidak bisa saya tinggalkan. Pada kesempatan ini saya juga akan mengevaluasi komentar teman-teman dan Insya Allah saya akan datang berkunjung juga, disamping mempererat tali silaturahmi sekaligus saling memberikan Backlink agar blog-blog kita tetap hidup.

Pada postingan kali ini saya akan memberikan trik untuk membuat pesan pembuka dan penutup pada blog kita. Artinya, apabila ada pengunjung yang masuk dan keluar dari blog kita, maka akan terbuka sebuah pesan yang isinya misalnya “Selamat datang di blog saya, jangan lupa komentarnya ya..”



Langsung saja, kita ke TKP.

- Masuk ke akun Blogger anda,
- Layout-Edit HTML
- Pada bagian atas cari kode dan masukan script berikut ini dibawahnya ;

<script type='text/javascript'>
alert("Selamat datang di blog saya, jangan lupa komentarnya ya..")
</script>

Sedangkan untuk ucapan selamat tinggal apabila pengunjung akan keluar dari blog kita adalah ;

Letakkan script dibawah ini tepat dibawah kode atau tepat dibawah kode ‘selamat datang’ yang dipasang pertama tadi.

<script type='text/javascript'>
// goodbye alert
function goodbye(){
alert(&#39;Terima kasih ataas kunjungannya, salam blogger.. &#39;);
}
parent.window.onunload=goodbye;
</script>

Teks ucapan tersebut dapat sobat ganti sesuai dengan selera sobat, ok selamat mencoba dan Salam Blogger Indonesia.

Daftar Isi (Accordion) Untuk Blogger

Biasanya kita memiliki begitu banyak posting di blog kita dan jika kita menggunakan TOC itu akan sangat panjang. Jika kita memiliki TOC yang sangat panjang, itu membuat pengunjung sulit untuk membaca posting kita. Untuk membuatnya sangat mudah. saya modifikasi dari script sebelumnya untuk gaya Blogger baru dan saya menggunakan Accordion.

Fitur dari script ini:

1. Efek Accordion
2. Efek Show and Hide
3. CSS 3
4. Otomatis menambahkan jquery
5. Warna yang berbeda untuk setiap konten
6. Gaya yang berbeda untuk Open and Close
7. Mengurutkan Judul Otomatis
8. Menambahkan Teks New! untuk 10 entry terbaru

Cara menggunakannya sangat mudah :

1. Buka Design » Page Elements.
2. Klik Add a Gadget.
   
   
3. Pilih gadget HTML/JavaScript.
   
4. Isi judul gadget.
5. Copy-paste script di bawah ini ke dalam gadget tadi.

<link href="http://abu-farhan.com/script/acctoc/acc-toc.css" media="screen" rel="stylesheet" type="text/css"></link> <script src="http://abu-farhan.com/script/acctoc/daftarisiv2-pack.js"></script> <script src="http://www.oblo.web.id/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script> <script type="text/javascript"> var accToc=true; </script> <script src="http://abu-farhan.com/script/acctoc/accordion-pack.js" type="text/javascript"></script>

Ganti www.oblo.web.id Dengan nama Blog Anda