Background
Daftar isi yang akan kita buat sekarang ini akan menggunakan efek jquery accordion, jika sebelumnya pernah kita bahas mengenai cara membuat daftar isi kang farhan, dengan efek jquery akan menampilkan efek dan bentuk yang lebih menarik. Script jquery accordion ini dibuat oleh teman netterku dalam dunia blog saudara Hendriono (http://modification-blog.blogspot.com). Untuk melihat bagaimana bentuk tampilan dan efek yang dihasilkan dari jquery accordion, kawan bisa meng-klik link demo dibawah ini :


Bagaimana menurut kawan? tertarik untuk membuatnya dalam blog kawan? jika tertarik kawan bisa mengikuti caranya seperti dibawah ini :
  • Masuk Design - Edit HTML
  • Jika diperlukan, kawan membuat backup template terlebih dahulu dengan cara men-Download Full Template untuk menghindari segala kesalahan.
  •  Selanjutnya cari kode ]]></b:skin> dan letakan kode css dibawah ini diatas kode ]]></b:skin> 
 
#dafis-acc {
font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
}
.dafis-label {
background: rgb(125,126,125);
background: -moz-linear-gradient(top, rgba(125,126,125,1) 0%, rgba(14,14,14,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,1)), color-stop(100%,rgba(14,14,14,1)));
background: -webkit-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%);
background: -o-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%);
background: -ms-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%);
background: linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 );
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
color: #A1A1A1;
text-transform:uppercase;
font-weight: bold;
line-height: 2em;
margin: 1px 3px;
cursor: pointer;
outline: medium none;
overflow: hidden;
padding: 2px 10px;
text-decoration: none;
text-align: center;
}
.dafis-label:hover {
color: #F2F2F2;
}
.dafis-daf ol {
margin: 0 0 0 30px !important;
padding: 0 !important;
}
.dafis-daf ol li {
background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0)));
background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: -o-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: -ms-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 );
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
line-height: 1.3em;
margin: 1px 3px !important;
text-align: left;
white-space: nowrap;
}
.dafis-daf ol li a {
color: #333333 !important;
display: block;
padding-top:5px;
padding-left: 10px;
text-decoration: none !important;
}
.dafis-daf ol li a:hover {
color:f2f2f2;
padding-left: 5px;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
  • Kemudian cari kode </head> dan letakan kode dibawah ini diatas kode </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
 Penting!!! periksa dalam tag head template kawan, jika sudah ada script jquery tersebut diatas, kawan tidak perlu menambahkan script jquery tersebut (cukup satu saja script jquery) dimaksudkan untuk menghidari konflik script, karena script yang dibuat berdasar perintah javascript termasuk jquery sebagai turunan javascript, rentan terjadi bentrok antar script.
  • Save template kawan.
Script dibawah ini adalah untuk menampilkan daftar isi, kalian bisa meletakan pada postingan, widget atau bisa memanfaat halaman sebagai media untuk menampilkannya.
  • Copy paste script dibawah ini pada postingan atau post page (halaman) dalam mode editor Edit HTML
 <script type="text/javascript" src="http://situseo.googlecode.com/files/Table-of-Content.js"></script>
<script src="http://iq-dua3.blogspot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script>
Keterangan : ganti url blog yang berwarna merah dengan url blog kawan.


^_^ semoga bermanfaat ^_^
 
Selamat pagi kawan, Kali ini saya akan posting tutorial blog yang mungkin kawan butuhkan, langsung saja. kali ini membuat macam-macam kotak dalam postingan, biasanya ini dibutuhkan/dipergunakan untuk kode HTML, kata yang penting juga banyak yang lainnya, oke dech mungkin kawan sudah mengerti jadi. Langsung saja, Cekidot>

Berikut langkah-langkah untuk bikin macam-macam tampilan kotak dalam postingan :

1. Kode untuk Solid Border

<div style="border: 2px #FF0000solid; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>

Maka hasilnya seperti ini :


Isi dengan tulisan kawan disini

2. Kode untuk Ridge Border

<div style="border: 2px #FF0000 ridge; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>

Maka hasilnya seperti ini :

Isi dengan tulisan kawan disini

3. Kode untuk Groove Border

<div style="border: 2px #FF0000 ridge; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>

Maka hasilnya seperti ini :

Isi dengan tulisan kawan disini

4. Kode untuk Inset Border

<div style="border: 2px #FF0000 inset; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div> 

Maka hasilnya seperti ini :

Isi dengan tulisan kawan disini

5. Kode untuk Outset Border

<div style="border: 2px #FF0000 outset; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div> 

Maka hasilnya seperti ini :

Isi dengan tulisan kawan disini

6. Kode untuk Double Border

<div style="border: 2px #FF0000 double; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>

Maka hasilnya seperti ini :

Isi dengan tulisan kawan disini

7. Kode untuk Dotted Border

<div style="border: 2px #FF0000 dotted; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>

Maka hasilnya seperti ini :

Isi dengan tulisan kawan disini

8. Kode untuk Dashed Border

<div style="border: 2px #FF0000 solid; padding: 10px; background-color: #FFCC00; overflow: auto; height: 50px; width: 300px; text-align: left;"> Isi dengan tulisan kawan disini </div>

Maka hasilnya seperti ini :

Isi dengan tulisan kawan disini

9. Kode untuk Dashed Border

<div style="border: 2px #FF0000 dashed; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini </div>

Maka hasilnya seperti ini :

Isi dengan tulisan kawan disini

10. Kode untuk Border dengan scroll, lebar dan tinggi

<div style="border: 2px #FF0000 solid; padding: 10px; background-color: #FFCC00; overflow: auto; height: 50px; width: 300px; text-align: left;"> Isi dengan tulisan kawan disini </div>

Maka hasilnya seperti ini :

Isi dengan tulisan kawan disini


Keterangan :
1. Tulisan berwarna pink : silahkan ganti dengan kode HTML yang anda inginkan.
2. Tulisan yang berwarna biru : ganti dengan kode warna menurut selera anda. Untuk mengganti kode warna silahkan kawan lihat di postingan saya mengenai Kode warna
3. Perlu diketahui : Dalam penulisan kode HTML yang ingin kawan tampilkan pada postingan harus pada posisi HTML bukan Compose.
Selamat pagi kawan ^_^. kali ini saya akan posting tutorial Facebook. Langsung saja, Cekidot>
Lagi iseng-iseng buka facebook liat bahasa ko banyak banget, dicoba dech yang baru eh tau tau ko jadi alay gini ya hehehe. ga ada salahnya kan memberi tahu ke kawan semua.

Untuk caranya.
1. Kawan log-in dahulu ke facebook
2. Paling bawah pada beranda ada bahasa (kawan klik)
3. Pilih leet speak
4. Dan liat hasilnya hehehehe ^_^

Note: Kawan tapi sayangnya masih Beta ni, Mungkin Masih dalam Tahap percobaan ^_^, Tapi tidak ada salahnya mencoba kan ^_^
Kali ini Afika versi 2 ni.. Langsung saja>


 ^_^ Semoga Kawan Terhibur ^_^
Kali ini saya akan posting software buat kawan semua.
Softwarenya yaitu Photo MakeUp Editor. Dari namanya kawan sudah bisa menyimpulkan apa kegunaan dari software ini bukan.
Yups software ini berguna untuk memberi make up pada wajah, juga bisa menghilangkan jerawat, memperhalus wajah, memutihkan gigi, dan masih banyak lagi.
langsung saja, Cekidot>

ScreenShot>>


Sebelum>>
 Sesudah>>
Gimana tertarik-kah, silahkan kawan download. Maaf editingnya jeulek hehehe tidak bisa editing saya mohon dimaklum saja ^_^
Password: iq-dua3
 Size: 3 Mb

^_^ Semoga Bermanfaat ^_^
Bagaimana Cara pasang meta tag di postingan? Apa fungsi meta tag? Apa gunanya meta tag? Mungkin ada yang bertanya seperti itu. Ok lah langsung saja, meta tag tersebut sangat berguna untuk mengoptimalkan atau optimasi onpage, kenapa bisa seperti itu? Karena dengan memasang meta tag di setiap postingan, kita akan memiliki meta deskripsi yang berbeda antara satu postingan dengan postingan yang lain. Dengan memasang meta tag di setiap postingan secara otomatis maka meta deskripsi dan keyword pada setiap postingan akan tergenerate secara otomatis. Ini menjadi solusi bagi kamu yang mengalami duplikasi meta deskripsi.
Jadi gimana cara pasang meta tag deskripsi dan keyword setiap postingan secara otomatis? Berikut ini cara pasang nya:
- Pertama silahkan kamu login ke blogger terlebih dahulu, kemudian menuju ke Design lalu Edit HTML. Setelah itu cari kode di bawah ini:
<title><data:blog.pageTitle/></title>
Untuk mempermudah mencarinya gunakan Ctrl + F
- Setelah kamu dapatkan tersebut, silahkan kamu hapus lalu ganti dengan kode berikut:
<b:if cond='data:blog.url == &quot;http://ALAMATBLOGSOBAT.blogspot.com/&quot;'>
<title><data:blog.pageTitle/></title>
<meta name='DESCRIPTION' content='ISI DENGAN DESKRIPSI UNTUK HOMEPAGE BLOG KAWAN'/>
<meta name='KEYWORDS' content='ISI DENGAN KATA KUNCI UNTUK HOMEPAGE'/> </b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<title><data:blog.pageName/> - <data:blog.title/></title>
<meta expr:content='data:blog.pageName + ", " + data:blog.title + ", " + data:blog.pageName' name='Description'/>
<meta expr:content='data:blog.pageName + ", " + data:blog.title + ", " + data:blog.pageName' name='Keywords'/>
</b:if>
- Setelah selesai silahkan kamu Save
Selamat mencoba dan semoga bermanfaat...
Ketika saya hendak meninggalkan pesan di kotak komentar blog saya koq tidak bisa, masalahnya ruang untuk memasukkan Word Verification-nya tidak ada, contohnya seperti gambar di bawah ini:


Dalam hati saya terbersit rasa keinginan untuk memecahkan masalah tersebut, ya hitung-hitung bila suatu saat saya memodifikasi kotak komentar dan mengalami masalah seperti itu lagi, sekarang saya sudah tau cara memperbaikinya.

Nah di bawah ini adalah Cara Memperbaiki Tampilan Form Komentar Yang Bermasalah, silahkan ikuti langkah-langkahnya dengan benar, sebagai berikut:
  1. Login ke Blogspot => klik Rancangan/Design => pilih Edit HTML, kasih centang pada kotak Expand Template Widget dan gunakan tombol Find (Ctrl + F) untuk memudahkan pencarian kode;
  2. Sebelumnya Download Template Lengkap dulu untuk jaga-jaga jika terjadi kegagalan, lalu cari kode tag di bawah ini:
    <iframe allowtransparency='true' class='blogger-iframe-colorize' frameborder='0' height='275' id='comment-editor' scrolling='no' src='' width='100%'/>
  3. Perbaiki atribut scrolling pada tag tersebut, karena disinilah akar permasalahannya. Ada dua cara untuk memperbaikinya, silahkan pilih salah satu saja yaitu:
    1. Hapus atribut scrolling='no' pada tag tersebut; atau:
    2. Ganti atribut itu menjadi scrolling='auto', ini bertujuan untuk menampilkan scrollbar di samping form komentar bila form komentar melebihi area yang tersedia.
  4. Setelah dilakukan perubahan, Save Template.
Tampilan form komentar Anda nantinya akan dilengkapi dengan scrollbar seperti pada gambar di bawah ini:
Kawan juga boleh (tapi tidak harus) mengubah value atribut height menjadi 410px. Tujuannya untuk mempertinggi area form komentar sesuai dengan yang ada pada template standar Blogger.
Demikianlah tutorial tentang Cara Memperbaiki Tampilan Form Komentar Yang Bermasalah ini, semoga bermanfaat.

= = = = = = = => Selamat Mencoba, Semoga Sukses!!! <= = = = = = = =
Duh kawan-kawan maaf ni baru ol lagi. Saya sibuk ngurusin tugas akhir. maaf ya jadi jarang ol sayanya.. ^_^
baru buka tau tau datang pesan dari cacicu (ade), richa dan riris, bahwa saya mendapatkan award. hahahaha padahal baru aja dibuka ini blog saya. Langsung saja>

Award #10 dari Cacicu




Award #11 dari Richa

Award #12 dari Riris


Bagi kawan semua yang ingin mendapatkan Award seperti saya, kawan kunjungi saja blog yang ada di atas ini. Rajinlah berkomentar, memberi masukan. insyaalloh akan dapat award seperti saya ini. ^_^

Khusus Award Cacicu, kawan coba dech klik kata yang ada di dalam award misalnya kata "AWARD","SAHABAT","CACICU"
Dan lihat kejutannya hehhe ^_^ mantap kawan awardnya. bikinan adequ (cacicu) gitu :p hehehe Piss


Selamat malam kawan semua, kali ini saya ingin posting Game pertama saya. Gamenya yaitu,
Zhu Zhu Pets, sudah tidak asing lagi kan di telinga kawan semua, singkatnya game ini sama percis dengan Hamster Ball. Tetapi yang ini lebih lengkap Fiturnya dari mulai arena, carakter dan banyak yang lainnya. jadi tunggu apalagi, Langsung saja, Cekidot>
ScreenShot>>



Pawword:
Size: 15 Mb

^_^ Semoga Bermanfaat ^_^

Bagi kawan yang kesulitan mendownload di blog saya saya beri info bagaimana cara mendownload.
Bagi kawan yang ingin mendownload kawan klik saja gambar Download yang berwarna biru (animasi bergerak). 
Kemudian kawan klik SKIP yang berada di pojok kanan atas. 
Selanjutnya kawan masukan password sesuai dengan password yang dicantumkan pada software/games yang kawan ingin download. sampai sini pasti kawan mengerti. ^_^ selamat mencoba kawan ^_^
Selamat malam kawa semua, baru buka blog tau tau ada informasi dari sahabat qu Catatan Mahasiswa kawanya Ada award kk, silahkan diambil ya wah spontan langsung saya menuju blognya, kirain cuman satu ternyata langsung Tiga kawan. mantap kan. makasih ya Catatan mahasiswa ^_^

Award #7 dari Catatan mahasiswa (awalnya dari Pasar Herbal yang dicipratkan oleh catatan mahasiswa kepada saya)

Award #8 dari Catatan mahasiswa (awalnya dari Trouble Maker yang dicipratkan oleh catatan mahasiswa kepada saya)

Award #8 dari Catatan mahasiswa (awalnya dari Tautan Informasi yang dicipratkan oleh catatan mahasiswa kepada saya)

Untuk Sahabat-qu Catatan mahasiswa saya ucapkan terimakash atas award yang sudah kawan berikan kepada saya, saya akan rawa award ini, dan semoga dengan ini hubungan kekerabatan kta semakin akrab ^_^









Pemenang
Pertama




Pemenang
Kedua 


Saling Sharing
Award
 Pemenang
Ketiga

 Pemenang
Keempat

5 Blog Yang Aktif Update Posting
di hitung dari tanggal 20 Februari 2012
 Selamat Untuk 5 Blog Pemenang, Semoga blog kalian bisa tambah "best" dimasa yang akan datang.. Sahabatmu SAN SAN
  Pemenang
Kelima