anda bosan dengan bentuk search engine yang dari dulu bentuknya cuma gitu gitu aja?
mau bentuk search engine lain dari pada yang lain?
eits bukan kelainan lho.mungkin banyak dari teman teman blogger yang sudah tau cara merubah bentuk search engine yang lebih professional.
nah kali ini saya akan memberi tahu cara merubah search engine lain
dari pada yang lain.
lebih simple kok tanpa harus ke menu Edit HTML
pilih Layout (bahasa inggris) kalau bahasa yang lain tidak tahu
klik Page Elemen(bahasa inggris)
nah sekarang anda tinggal pilih pilih saja yang mana search engine yang akan anda pasang
nih kodenya <form id="searchthis" action="/search" style="display:inline;" method="get"> <input onfocus="if (this.value == "Search...") {this.value = ""}" value="Search..." type="text" id="search-box" onblur="if (this.value == "") {this.value = "Search...";}" style="background: #fff; -moz-border-radius: 55px; padding-left: 10px; padding-right: 10px; border: 1px solid #CCCCCC; border: 1px solid #088A08 border: 1px solid #088A08/" size="25" name="q"/> <input id="search-btn" style="background: #fff; color:#000; -moz-border-radius: 55px; border: 1px solid #CCCCCC; border: 1px solid #088A08" value="Search" type="submit"/> </form>
nih kodenya <form id="searchthis" action="/search" style="display:inline;" method="get"> <input onfocus="if (this.value == "Search...") {this.value = ""}" value="Search..." type="text" id="search-box" onblur="if (this.value == "") {this.value = "Search...";}" style="background: #fff; -moz-border-radius: 55px; padding-left: 10px; padding-right: 10px; border: 1px solid #CCCCCC; border: 1px solid #088A08 border: 1px solid #088A08/" size="25" name="q"/> <input id="search-btn" style="background: #FFFCA4; color:#000; -moz-border-radius: 55px; border: 1px solid #CCCCCC; border: 1px solid #088A08" value="Search" type="submit"/> </form>
nih kodenya <form id="searchthis" action="/search" style="display:inline;" method="get"> <input onfocus="if (this.value == "Search...") {this.value = ""}" value="Search..." type="text" id="search-box" onblur="if (this.value == "") {this.value = "Search...";}" style="background: #B6FF43; -moz-border-radius: 55px; padding-left: 10px; padding-right: 10px; border: 1px solid #CCCCCC; border: 1px solid #088A08 border: 1px solid #088A08/" size="25" name="q"/> <input id="search-btn" style="background: #FFFCA4; color:#000; -moz-border-radius: 55px; border: 1px solid #CCCCCC; border: 1px solid #088A08" value="Search" type="submit"/> </form>
nih kodenya <form id="searchthis" action="/search" style="display:inline;" method="get"> <input onfocus="if (this.value == "Search...") {this.value = ""}" value="Search..." type="text" id="search-box" onblur="if (this.value == "") {this.value = "Search...";}" style="background: #FFFCA4; -moz-border-radius: 55px; padding-left: 10px; padding-right: 10px; border: 1px solid #CCCCCC; border: 1px solid #088A08 border: 1px solid #088A08/" size="25" name="q"/> <input id="search-btn" style="background: #fff; color:#000; -moz-border-radius: 55px; border: 1px solid #CCCCCC; border: 1px solid #088A08" value="Search" type="submit"/> </form>
nih kodenya <form id="searchthis" action="/search" style="display:inline;" method="get"> <input onfocus="if (this.value == "Search...") {this.value = ""}" value="Search..." type="text" id="search-box" onblur="if (this.value == "") {this.value = "Search...";}" style="background: #fff; -moz-border-radius: 55px; padding-left: 10px; padding-right: 10px; border: 1px solid #CCCCCC; border: 1px solid #088A08 border: 1px solid #088A08/" size="25" name="q"/> <input id="search-btn" style="margin-left: 5px; margin-right: px;margin-top: 5px;margin-bottom: px; padding-top:px" src="http://i38.tinypic.com/5dw6c2.jpg" value="Search" type="image"/> </form>
nih kodenya <form id="searchthis" action="/search" style="display:inline;" method="get"> <input onfocus="if (this.value == "Search...") {this.value = ""}" value="Search..." type="text" id="search-box" onblur="if (this.value == "") {this.value = "Search...";}" style="background: #FFFCA4; -moz-border-radius: 55px; padding-left: 10px; padding-right: 10px; border: 1px solid #CCCCCC; border: 1px solid #088A08 border: 1px solid #088A08/" size="25" name="q"/> <input id="search-btn" style="margin-left: 5px; margin-right: px;margin-top: 5px;margin-bottom: px; padding-top:px" src="http://i38.tinypic.com/5dw6c2.jpg" value="Search" type="image"/> </form>
anda bisa mengganti tulisan
form action="/search"
dengan link milik anda
contoh
form action="www.namabloganda.blogspot.com"
dah kayaknya itu aja deh..
mau ingin tanya tanya?
tulis aja di kotak komentar oke
Bagi Anda Yang Ingin Copy Paste Artikel Saya Harap Mencantumkan Sumbernya
Terima Kasih
21 Desember 2009
4 Desember 2009
Beberapa hari belakangan ini saya bingung mencari bahan untuk memposting artikel di blog ini.saya browsing kesana kemari dan menemukan menu navigasi untuk menambah cantik blog teman teman. Smooth Navigational Menu (v1.31) biar lebih merakyat saya sebut saja Menu navigasi berbayang itulah namanya karena di Menu tersebut ada bayangannya,yang saya dapat dari dynamicdrive
mau lihat contoh yang aslinya?
anda bisa
Mau bikin menu seperti itu..?
oke deh kalau mau yuk ikutin langkah langkahnya
Pertama
[1]Login dahulu di account blogger anda
Kedua
[2]klik Tata Letak
Ketiga
[3]klik Edit HTML
nah kalau sudah,coba anda cari kode
<head>
kalau sudah ketemu kodenya,copy kode di bawah ini
dan letakan persis di bawah kode <head>
<link href='http://ariistiadi.googlepages.com/ddsmoothmenu.css' rel='stylesheet' type='text/css'/>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js' type='text/javascript'/>
<script src='http://ariistiadi.googlepages.com/ddsmoothmenu.js' type='text/javascript'>
</script>
Setelah itu anda cari kode
</head>
kalau sudah ketemu kodenya
copy kode di bawah ini dan paste tepat di atas kode </head>
<script type='text/javascript'>
ddsmoothmenu.init({
mainmenuid: "smoothmenu1", //menu DIV id
orientation: 'h', //Horizontal or vertical menu: Set to "h" or "v"
classname: 'ddsmoothmenu', //class added to menu's outer DIV
//customtheme: ["#1c5a80", "#18374a"],
contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
})
ddsmoothmenu.init({
mainmenuid: "smoothmenu2", //Menu DIV id
orientation: 'v', //Horizontal or vertical menu: Set to "h" or "v"
classname: 'ddsmoothmenu-v', //class added to menu's outer DIV
//customtheme: ["#804000", "#482400"],
contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
})
</script>
setelah itu anda cari kembali kode berikut ini:
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='buat template baru (Header)' type='Header'/>
</b:section>
</div>
nah setelah itu copy kode di bawah ini
dan letakan persis di bawah kode
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='buat template baru (Header)' type='Header'/>
</b:section>
</div>
<div class='ddsmoothmenu' id='smoothmenu1'>
<ul>
<li><a href='http://www.dynamicdrive.com'>Item 1</a></li>
<li><a href='#'>Folder 0</a>
<ul>
<li><a href='#'>Sub Item 1.1</a></li>
<li><a href='#'>Sub Item 1.2</a></li>
<li><a href='#'>Sub Item 1.3</a></li>
<li><a href='#'>Sub Item 1.4</a></li>
<li><a href='#'>Sub Item 1.2</a></li>
<li><a href='#'>Sub Item 1.3</a></li>
<li><a href='#'>Sub Item 1.4</a></li>
</ul>
</li>
<li><a href='#'>Folder 1</a>
<ul>
<li><a href='#'>Sub Item 1.1</a></li>
<li><a href='#'>Sub Item 1.2</a></li>
<li><a href='#'>Sub Item 1.3</a></li>
<li><a href='#'>Sub Item 1.4</a></li>
<li><a href='#'>Sub Item 1.2</a></li>
<li><a href='#'>Sub Item 1.3</a></li>
<li><a href='#'>Sub Item 1.4</a></li>
</ul>
</li>
<li><a href='#'>Item 3</a></li>
<li><a href='#'>Folder 2</a>
<ul>
<li><a href='#'>Sub Item 2.1</a></li>
<li><a href='#'>Folder 2.1</a>
<ul>
<li><a href='#'>Sub Item 2.1.1</a></li>
<li><a href='#'>Sub Item 2.1.2</a></li>
<li><a href='#'>Folder 3.1.1</a>
<ul>
<li><a href='#'>Sub Item 3.1.1.1</a></li>
<li><a href='#'>Sub Item 3.1.1.2</a></li>
<li><a href='#'>Sub Item 3.1.1.3</a></li>
<li><a href='#'>Sub Item 3.1.1.4</a></li>
<li><a href='#'>Sub Item 3.1.1.5</a></li>
</ul>
</li>
<li><a href='#'>Sub Item 2.1.4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href='http://www.dynamicdrive.com/style/'>Item 4</a></li>
</ul>
<br style='clear: left'/>
</div>
anda bisa mengganti
alamat [http://www.dynamicdrive.com] dan [#] dengan alamat link anda sendiri
dan mengganti tulisan
-Sub Item
-Folder 0
-Folder 1
-Item 3
-Folder 2
sesuai keinginan anda masing masing
kayaknya itu saja caranya
masih blum berhasil?
tanyakan saja
Sumber:dynamicdrive
Bagi Anda Yang Ingin Copy Paste Artikel Saya Harap Mencantumkan Sumbernya
Terima Kasih
19 November 2009
Hari AIDS Sedunia yang jatuh pada tanggal 1 Desember diperingati untuk menumbuhkan kesadaran terhadap wabah AIDS di seluruh dunia yang disebabkan oleh penyebaran virus HIV. Sejak 2008, tema Hari AIDS Sedunia dipilih oleh Komite Pengarah Global Kampanye Hari AIDS Sedunia setelah melalui konsultasi yang luas dengan banyak pihak, organisasi dan lembaga-lembaga pemerintah yang terlibat dalam pencegahan dan perawatan korban HIV/AIDS.
Untuk setiap Hari AIDS Sedunia dari 2005 hingga 2010, temanya adalah “Hentikan AIDS, Jaga Janjinya”, dengan sebuah sub-tema tahunan.Tema payung ini dirancang untuk mendorong para pemimpin politik untuk memegang komitmen mereka untuk menghasilkan akses sedunia kepada pencegahan, perawatan, pemeliharaan, dan dukungan terhadap penyakit dan para korban HIV/AIDS pada tahun 2010.
Berdasarkan data Departemen Kesehatan RI, pada semester I tahun 2009, kasus HIV/AIDS di DKI Jakarta mencapai 2.810 orang dan meninggal 425 orang. Jumlah ini jauh lebih besar jika dibandingkan tahun 2008 yang hanya 439 orang. Kemudian jika dipersentasekan, maka jumlah penderita HIV/AIDS penggunaan jarum suntik secara bergantian mencapai 71 persen, karena hubungan seks bebas 23 persen, dan sisanya 6 persen karena faktor lain-lain.Bagaimana dengan wilayah Bekasi ?
Kegiatan penanggulangan HIV/AIDS tidak dapat dipisahkan dengan alat-alat pencegah masuknya virus HIV ke dalam tubuh. Seperti kondom dan jarum suntik steril, namun yang lebih penting lagi adalah hindari pasangan yang tidak sah dan pola hidup sex yang sehat. Kampanye anti AIDS harus selalu kita dengungkan untuk dapat mewujudkan eliminasi penyakit HIV/AIDS. Blogger siap menjadi DUTA AIDS dan Komunitas Blogger Bekasi menjadi benteng terdepan dalam kepedulian terhadap AIDS sekaligus membantu pemerintah dalam pemberantasan AIDS.
masih ada diantara kita yang belum tahu dan memahami apa itu AIDS?
menurut wikipedia indonesia AIDS adalah Acquired Immunodeficiency Syndrome atau Acquired Immune Deficiency Syndrome adalah sekumpulan gejala dan infeksi (atau: sindrom) yang timbul karena rusaknya sistem kekebalan tubuh manusia akibat infeksi virus HIV atau infeksi virus-virus lain yang mirip yang menyerang spesies lainnya (SIV, FIV, dan lain-lain).
HIV/AIDS itu berasal dari hubungan seksual lebih dari satu pasangan. selain itu, penyakit ini juga bisa disebabkan oleh transfusi darah, jarum suntik dll. yang menularkan penyakit ini manusia yang terkena penyakit ini,dan hingga saat ini belum ada di temukan obat penyembuh HIV/AIDS
sudah banyak saudara saudara kita yang meninggal dunia karena HIV/AIDS.HIV/AIDS itu menyerang siapa saja
yaitu REMAJA,MAHASISWA,ORANG TUA,baik PRIA maupun WANITA.
nah oleh karena itu mari kita jauhi diri kita dari virus tersebut dan hilangkan berpendapat bahwa orang yang terkena
HIV/AIDS itu orang yang harus dijauhi atau dikucilkan dari lingkungan sekitar.
malah kita harus bertindak sebaliknya yaitu kita jangan menjauhi atau mengucilkan orang yang terkena HIV/AIDS di lingkungan kita
karena orang yang terkena HIV/AIDS itu membutuhkan dukungan semangat moral dari orang orang sekitar
baik keluarga,teman,tetangga,dan masyarakat yang lainnya.
coba anda bayangkan bagaimana jika penyakit itu menular pada diri anda dan merasakan menjadi orang yang disisihkan dari lingkungan sekitar.
Dukungan anda sangat berarti bagi seseorang yang terkena HIV/AIDS,karena dukungan yang di berikan oleh orang orang sekitar membuat penderita HIV/AIDS tegar
dan memiliki semangat hidup kembali.
beberapa orang berpendapat bahwa penderita HIV/AIDS dapat bertahan hidup karena dukungan dari orang orang sekitar.
anggaplah penderita HIV/AIDS itu menjadi salah satu dari bagian kehidupan anda yang bisa menemani anda ngbrol,bercanda,dan bersenda gurau.
AIDS NO BLOGGING YES
13 November 2009
Membuat Menu Buka Tutup Horizontal atau Horizontal Accordion script
nih screenshootnya
mau lihat seperti apa bentuknya
klik DISINI
Mau bikin seperti itu?
kalau mau yuk ikutin langkah langkahnya
pertama:
Login dahulu di account blogger anda
kedua:
Pilih Tata Letak
ke tiga:
Pilih Edit HTML
untuk menghindari sesuatu yang tidak diinginkan
jangan lupa untuk membackup dulu template anda
dengan mengklik Download Template Lengkap
oke selanjutnya
coba anda cari kode <head>
nah kalau sudah ketemu kodenya
copy kode di bawah ini
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://ariistiadi.googlepages.com/haccordion.js' type='text/javascript'>
</script>
dan letakan persis di bawah kode
<head>
selanjutnya oba anda cari lagi kode ]]></b:skin>
nah sekarang anda mau pilih menu yang seperti apa?
Demo 1[yang ada gambarnya]
Demo 2[tidak ada gambarnya]
kalau anda memilih demo 1
copy kode di bawah ini
/*CSS for example Accordion #hc1*/
dan letakan persis di atas kode]]></b:skin>
#hc1 li{
margin:0 3px 0 0; /*Spacing between each LI container*/
}
#hc1 li .hpanel{
padding: 5px; /*Padding inside each content*/
background: lightblue;
}
Apabila anda memilih Demo 2
copy kode di bawah ini
/*CSS for example Accordion #hc2*/
#hc2 li{
margin:0 0 0 0; /*Spacing between each LI container*/
border: 12px solid black;
}
#hc2 li .hpanel{
padding: 5px; /*Padding inside each content*/
background: #E2E9FF;
cursor: hand;
cursor: pointer;
}
dan letakan persis di atas kode]]></b:skin>
dan tambahkan pula kode di bawah ini
.haccordion{
dan letakan persis di atas kode]]></b:skin>
padding: 0;
}
.haccordion ul{
margin: 0;
padding: 0;
list-style: none;
overflow: hidden; /*leave as is*/
}
.haccordion li{
margin: 0;
padding: 0;
display: block; /*leave as is*/
width: 100%; /*For users with JS disabled: Width of each content*/
height: 200px; /*For users with JS disabled: Height of each content*/
overflow: hidden; /*leave as is*/
float: left; /*leave as is*/
}
.haccordion li .hpanel{
width: 100%; /*For users with JS disabled: Width of each content*/
height: 200px; /*For users with JS disabled: Height of each content*/
}
anda bisa memodifikasi kode tersebut sesuai dengan keinginan anda
setelah itu anda cari kode </head>
nah kalau sudah ketemu
copy kode di bawah ini
<script type='text/javascript'>
haccordion.setup({
accordionid: 'hc1', //
paneldimensions: {peekw:'50px', fullw:'400px', h:'158px'},
selectedli: [0, true], //[selectedli_index, persiststate_bool]
collapsecurrent: false //
})
haccordion.setup({
accordionid: 'hc2', //
paneldimensions: {peekw:'30px', fullw:'450px', h:'150px'},
selectedli: [-1, true], //[selectedli_index, persiststate_bool]
collapsecurrent: true //
})
</script>
dah letakan persis di bawah kode </head>
setelah itu SIMPAN TEMPLATE/SAVE TEMPLATE
Selanjutnya kita menuju
1.Elemen Halaman
2.Klik Tambah Gedget
3.Klik HTML/Javascript
kalau sudah
bagi anda yang memilih Demo 1
copy dan masukan kode di bawah ini
<div id="hc1" class="haccordion">
<ul>
<li>
<div class="hpanel">
<img style="float: left; padding-right: 8px; width: 200px; height: 148px;" src="http://img502.imageshack.us/img502/746/thailand.jpg" />The Andaman Sea is regarded as Thailand's most precious natural resource as it hosts the most popular and luxurious resorts in Asia.
</div>
</li>
<li>
<div class="hpanel">
<img style="float: left; padding-right: 8px; width: 200px; height: 148px;" src="http://img264.imageshack.us/img264/7199/japan.jpg" />Japan is a constitutional monarchy where the power of the Emperor is very limited.
</div>
</li>
<li>
<div class="hpanel">
<img style="float: left; padding-right: 8px; width: 200px; height: 148px;" src="http://img101.imageshack.us/img101/516/mayai.jpg" />Malaysia is a South Asian country rich in natural resources in areas such as agriculture, forestry and minerals.
</div>
</li>
<li>
<div class="hpanel">
<img style="float: left; padding-right: 8px; width: 200px; height: 148px;" src="http://img194.imageshack.us/img194/9553/camam.jpg" />Agriculture has long been the most important sector of the Cambodian economy.
</div>
</li>
<li>
<div class="hpanel">
<img style="float: left; padding-right: 8px; width: 200px; height: 148px;" src="http://img408.imageshack.us/img408/5751/langkawi.jpg" />Langkawi is particularly known for its beaches which are among the best in Malaysia.
</div>
</li>
</ul>
</div>
<p style="clear: left;"></p></span></a><a href="javascript:haccordion.expandli('hc1',%200)">Expand 1 Panel</a> | <a href="javascript:haccordion.expandli('hc1',%201)">Expand 2nd Panel</a> | <a href="javascript:haccordion.expandli('hc1',%202)">Expand 3rd Panel</a> | <a href="javascript:haccordion.expandli('hc1',%203)">Expand 4th Panel</a> | <a href="javascript:haccordion.expandli('hc1',%204)">Expand 5th Panel</a><p></p>
klik SAVE/SIMPAN
Anda bisa mengganti gambar ,link, atau tulisan yang di atas sesuai dengan keinginan anda
untuk anda yang memilih Demo 2
copy dan masukan kode di bawah ini
<div id="hc2" class="haccordion">
<ul>
<li style="border-right-width: 0pt;">
<div style="padding: 10px; width: 250px;" class="hpanel">
This accordion content has a custom full width of 250px. Note where the two inline CSS are added within the markup.
</div>
</li>
<li style="border-right-width: 0pt;">
<div style="padding: 10px; width: 180px;" class="hpanel">
This accordion content has a custom full width of 180px. Note where the two inline CSS are added within the markup.
</div>
</li>
<li style="border-right-width: 0pt;">
<div style="padding: 10px; width: 350px;" class="hpanel">
This accordion content has a custom full width of 350px. Note where the two inline CSS are added within the markup.
</div>
</li>
<li>
<div style="padding: 10px; width: 550px;" class="hpanel">
This accordion content has a custom full width of 550px. Note where the two inline CSS are added within the markup.
</div>
</li>
</ul>
</div>
klik SAVE/SIMPAN
Anda bisa mengganti gambar ,link, atau tulisan yang di atas sesuai dengan keinginan anda
dah seperti itu aja caranya
mudah bukan...?
bila belum berhasil tanyakan saja
Sumber:dynamicdrive
Bagi Anda Yang Ingin Copy Paste Artikel Saya Harap Mencantumkan Sumbernya
Terima Kasih
4 November 2009
sudah lama sekali saya menantikan adanya blogger bekasi dan semua itu sudah terjawab
yang bertepat pada hari Sabtu tanggal 17 oktober 2009
yang acara tersebut di gelar di Teras Gloria Jean's Coffees Bekasi Cyber Park (B.C.P).
Komunitas Blogger Bekasi sudah di resmikan langsung oleh
Bapak Walikota Bekasi, Bpk. H. Mochtar Muhamad
acara tersebut yang bertemakan Launcing BeBlog sebagai bukti bahwa telah di bukanya komunitas komunitas pengguna blog Bekasi.
saat ini dunia internet adalah bagian yang tidak dapat terpisahkan lagi dari masyarakat dunia.
bloggerbekasi [dot] com adalah salah satu media komunikasi antara masyarakat kota Bekasi
bloggerbekasi [dot] com sama halnya seperti situs jaringan sosial seperti facebook,friendster,twiter,technoratih,dan lain lain.
yang dimana sebagai media mencari teman,mempererat tali silahturahmi,menambah persatuan dan kesatuan antar bangsa dan negara.
selain itu bisa kita manfaatkan sebagai media mencari informasi seputar kota Bekasi, bertukara informasi.
dengan adanya BeBlog ini memberikan semangat pengguna blog dan kepada para pemuda pemudi untuk berkreatifitas, menuangkan ide ide,inspirasinya kedalam sebuah blog
kenapa harus menggunakan SEO kenapa tidak secara langsung saja?
dengan adanya SEARCH ENGINE atau MESIN PENCARI bagi pengguna blog yang telah memiliki page rank atau peringkat blog yang cukup bagus
akan memudahkan untuk mempromosikan kota Bekasi.
SEO juga bisa di gunakan sebagai salah satu media promosi yang sangat efektif,hanya menuliskan sebuah kata kunci keyword
maka akan terdekteksi se-nusantara bahkan seluruh dunia
alasan umum kenapa mempromosikan kota bekasi dengan menggunakan SEO yaitu
1.Menghemat Waktu
2.Menghemat Tenaga
3.Mengurangi Anggaran Pengeluaran Kota Bekasi
4.Agar Lebih Cepat Terkenalnya Kota Bekasi
5.Efisien
oleh karena itu dengan adanya SEO mari kita promosikan kota bekasi ini menjadi kota metropolitan dan kota sektor industri yang terbaikApakah dampak mempromosikan dari SEO ?
Dampaknya adalah kota Bekasi semakin terkenal oleh masyarakat lokal dan internasional.
hal ini pula tak luput oleh para pengguna blog
yang telah membantu mempopulerkan kota Bekasi.
karena tahun demi tahun perkembangan dunia semakin cepat dan semakin semakin ketat pula persaingan di era globalisasi
11 Oktober 2009
Sudah beberapa minggu ini saya tidak menambah postingan di blogger
karena beberapa hal yang menghalangi saya menambah postingan
seperti ini
yang saya pakai di blog saya
ada teman blogger yang bertanya "bagaimana membuat kotak komentar jadi 2 kolom dengan nomor komentator"
sebenarnya saya mendapatkan cara membuat 2 kolom kotak komentar
dari blognya kang jaloe
tetapi karena ada beberapa kodenya yang tidak cocok dengan beberapa template
oleh karena itu sebelumnya saya minta izin untuk mengeditnya
Mau gak tuh pasang Kolom komentar Yang kayak gitu?
kalo Mau yuk ikuti langkah langkahnya
pertama:
Login dahulu di account blogger anda
kedua:
Pilih Tata Letak
ke tiga:
Pilih Edit HTML
untuk menghindari sesuatu yang tidak diinginkan
jangan lupa untuk membackup dulu template anda
dengan mengklik Download Template Lengkap
nah sebelum memulainya
kasih tanda ceklist di kotak yang sebelah kiri Expand Template Widget
coba anda cari kode di bawah ini
/* Comment */
atau
/* Comment
-------------------------------------------------- */
kalau sudah ketemu ganti semua kode kodenya dengan kode di bawah ini
/* Comments
----------------------------------------------- */
#comments h4 {margin:1em 10px; padding:10px; font-weight: normal;
line-height: 1.4em; text-transform:lowercase; letter-spacing:.2em;
color: #ccc;
}
#comments-block {margin:.5em 0 1em; line-height:1.6em;
padding:10px;
}
#comments-block .comment-author {display:block; width:90px;
height:110px;
margin:0; text-align:center; padding:5px 0 0; line-height:1.4em;
font-size:13px; text-transform:capitalize;
}
#comments-block .mount-author {
display:block; overflow:hidden; max-height: 16px;
text-align:center;
}
#comments-block .comment-body {
background:#fff ; border-top:3px double #ccc; margin:20;
border-right:1px dotted #ccc;border-left:1px dotted #ccc;
padding:10px 5px 0 10px;
}
#comments-block .comment-footer {
background:#EDFDC0 ; border-right:1px dotted #ccc;
border-left:1px dotted #ccc;border-bottom:3px double #ccc;
margin-bottom:5px; padding:5px 5px 5px 10px; line-height: 1.4em;
text-transform:normal; font-size:10px; letter-spacing:.1em;
}
#comments-block .comment-body-author p {
background:#C0E6FD ; border-top:3px double #ccc;
margin:0; padding:10px 5px 0 10px;
}
#comments-block .comment-footer-author {
background:#EDFDC0 ;border-bottom:1px solid #ccc;
margin-bottom:5px;padding:5px 5px 5px 10px;
line-height: 1.4em; text-transform:normal;
font-size:10px; letter-spacing:.1em;
}
#comments-block .comment-body p {
margin:0;
}
.comment-form { background:#ffff;
}
.deleted-comment {
font-style:italic; color:gray;
}
.numberingcomments{
margin-top:5px;
font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
font-size: 20px; font-weight: normal;
}
#blog-pager-newer-link {
float: $startSide;
}
#blog-pager-older-link {
float: $endSide;
}
#blog-pager {
text-align: center;
}
.feed-links {
clear: both;
line-height: 2.5em;
}
selanjutnya coba anda cari kode di bawah ini:
<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>
kalau sudah ketemu,hapus kode yang di atas
kemudian ganti dengan kode berikut ini
<dl id='comments-block'>
<script type='text/javascript'>var CommentsCounter=0;</script>
<b:loop values='data:post.comments' var='comment'> <div style='width: 10%; float: left;'><div class='' expr:id='data:comment.id'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<div class='mount-author'> <a expr:name='"comment-" + data:comment.id'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if></div>
<div class='commentphoto' style='margin-top:.5em;'/><span class='numberingcomments'>
<a expr:href='"#comment-" + data:comment.id' title='Comment Link'>
<script type='text/javascript'>
CommentsCounter=CommentsCounter+1;
document.write(CommentsCounter)
</script>
</a>
</span>
</dt></div></div>
<div style='width: 80%; float: right;'>
<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-author'>
<p><data:comment.body/></p>
</dd>
<dd class='comment-footer-author'>
<span class='comment-timestamp'>
<a expr:href='"#comment-" + data:comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
<b:else/>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='"#comment-" + data:comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd></b:if></div>
<div style='clear: both;'/>
</b:loop>
</dl>
setelah itu SIMPAN TEMPLATE/SAVE TEMPLATE
nah sekarang kolom komentar anda menjadi 2
dah kayaknya itu saja caranya
silahkan di coba dan di peragakan
kalau belum berhail tanyakan saja
29 September 2009
sudah lama saya menginginkan
bagaimana cara pasang Flash intro atau intro blog di blogger..
ternyata sudah di jawab oleh kang jaloe
nah kali ini saya akan menerangkan secara detail bagaimana cara membuat flash intro di blogger
mau pasang flash intro di blog kamu??
mau?
mau?
mau?
sebelum memulai ke EDIT HTML
kita harus memiliki file flashnya
kalau tidak mau repot repot bikin file flashnya...
tema teman bisa melihat lihat atau memilih milih file flashnya
bisa mengunjungin di sini wyomingwebdesign
atau kalau anda ingin berkreatifitas sendiri
bisa mendownload software ALEO FLASH BANNER
dah ketemu file flash yang cocok buat kamu?
nah kalau sudah sekarang kita upload file flash tersebut
di sini saya menggunakan hosting dari fileave
klik link di bawah ini bagi yang mau daftar
FILEAVE
kalau sudah selesai mendaftar di FILEAVE
selanjutnya kita mengupload file flash yang baru kita download atau baru anda buat
lalu anda login dulu di account FILEAVE
nah kalau sudah klik Files
setelah itu pilih Upload files
klik telusuri lalu cari file flash
kalau sudah klik UPLOAD
nah setelah file sudah di UPLOAD
kita kembali lagi ke FILES
setelah itu klik kanan mouse pilih copy link flash intronya
atau bagi yang menggunakan mozilla versi bahasa indonesia
seperti ini contohnya
simpan di notepad dahulu
selanjutnya
1-Login dahulu di account blogger anda
2-Pilih Tata Letak
3-Pilih Edit HTML
untuk menghindari sesuatu yang tidak di inginkan
nah sebelum memulainya
jangan lupa untuk membackup dulu template anda
di klik dulu Download Template Lengkap
kasih tanda ceklist di kotak yang sebelah kiri Expand Template Widget
coba anda cari kode berikut:
<body>
kalau sudah ketemu
Copy kode di bawah ini dan letakan tepat di bawah <body>
<div id='flashintro'>
<div align='center'> <p style='padding:10px;'> <object height='600' width='800'> <param name='movie' value='MYFLASH.swf'/> <embed height='600' src='Url Flash' width='800'> </embed> </object> </p><p style='padding-top:5px;font-size:18px;font-weight:bold;color:#fff;'><a expr:href='data:blog.homepageUrl + "search/label/?max-results=4"'>skip intro</a></p> </div>
</div>
Catatan : Ganti url flash dengan alamat / url flash yang anda simpan di notepad tadi
jangan lupa sesuaikan juga nilai height dan width dengan ukuran flash anda.
Selanjutnya cari tag <b:includable id='main'> - atau bisa dengan ID yang lai
NB:berhubungan tag <b:includable id='main'> ada banyak
kode tersebut bisa anda letakan di ID header wraper
seperti ini contoh kodenya
<div id='header-wrapper'>
<div id='head-inner'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='catatan pelajaran sekolah (Header)' type='Header'>
<b:includable id='title'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<data:title/>
<b:else/>
<a expr:href='data:blog.homepageUrl'><data:title/></a>
</b:if>
</b:includable>
<b:includable id='description'>
<div class='descriptionwrapper'>
<p class='description'><span><data:description/></span></p>
</div>
</b:includable>
<b:includable id='main'>
nah kalau sudah ketemu
copy kode di bawah ini dan letakan persis di bawah kode <b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style>
body {
background-color: #000000;
background-image: none;
}
#flashintro {
text-align:center;
margin:auto;
padding:auto;
}
#outer-wrapper{display:none;}
</style>
<b:else/>
<style>#flashintro{display:none;}</style>
</b:if>
kemudian Save Template
Catatan :
anda bisa mengganti
background-color: #000000;
background-image: none;
sesuai yang anda inginkan
untuk menghilangkan intro flash di dalam halaman Page Elemens , cari tag ]]></b:skin> , dan sebelum tag tersebut di atasnya masukan kode ini.
body#layout #flashintro {display:none;}
Pengaturan Untuk Halaman Depan ( tab Home )
Selanjutnya jika teman mempunyai tab menu/ navigasi maka halaman depan-nya yang biasa di wakili dengan menu Home/depan/beranda mesti di atur ke halaman search/label/?max-results=4 atau 5/6 dst yakni;
<a expr:href='data:blog.homepageUrl + "search/label/?max-results=4"'> Home </a>
Begitu juga untuk link Home di Page Navigation nya ( yang ada di bawah Older - Home - Newer ), untuk Home nya atur dengan link di atas.
dah itu saja caranya
mudah bukan...?
masih bingung atau belum berhasil
tanyakan saja
SUMBER:CATALOG TUTORIAL
Bagi Anda Yang Ingin Copy Paste Artikel Saya
Harap Mencantumkan Sumbernya
Terima Kasih
27 September 2009
Bikin widget DD Drop Down Panel bahasa indonesianya kalo tidak salah DD panel geser bawah
lagi jelajahin dynamicdrive,terus ketemu widget ini.
kayaknya bagus buat di blog
widget memiliki multi guna
mau lihat contohnya
klik >DI SINI
bisa buat tempat profil,banner teman anda,link teman anda dll
ya sudah saya posting biar teman teman kalau mau coba
dah lihat belum?
mau punya widget seperti itu?
oke ikuti langkah langkahnya
pertama:
Login dahulu di account blogger anda
kedua:
Pilih Tata Letak
ke tiga:
Pilih Edit HTML
bagi yang navbarnya belum di hilangkan harus di hilangkan dahulu
ini kodenya:
#navbar-iframe {
display: none !important;
}
dan letakan di bawah kode
/* Use this with templates/template-twocol.html */
kemudian anda cari kode:
<head>
kalau sudah ketemu kode tersebut
copy kode berwarna biru di bawah ini dan di letakan persis di atas kode <head>
<link href='http://ariistiadi.googlepages.com/dddropdownpanel.css' rel='stylesheet' type='text/css'/>
<script src='http://ariistiadi.googlepages.com/dddropdownpanel.js' type='text/javascript'>
</script>
ini screen shoot nya
setelah itu anda cari kode
<body>
kalau sudah ketemu
copy kode berwarna merah di bawah ini dan letakan persis di bawah kode <body>
<div id="mypanel" class="ddpanel">
<div id="mypanelcontent" class="ddpanelcontent">
<p style="padding:10px">
<img src="http://i36.tinypic.com/kak1t0.jpg" class="closepanel" style="float:left; width:200px; height:172px; margin:0 10px 10px 0" />The Milky Way is a barred spiral galaxy that is part of the Local Group of galaxies. Although the Milky Way is one of billions of galaxies in the observable universe,[4] its special significance to humanity is that it is the home galaxy of our Solar System. The plane of the Milky Way galaxy is visible from Earth as a band of light in the night sky, and it is the appearance of this band of light which has inspired the name for our galaxy. It is extremely difficult to define the age at which the Milky Way formed, but the age of the oldest star in the Galaxy yet discovered, HE 1523-0901, is estimated to be about 13.2 billion years, nearly as old as the Universe itself. -Source: <a href="http://en.wikipedia.org/wiki/Milky_way" style="color:white">Wikipedia</a>.
</p>
<br style="clear: left" />
<p>Note: Click on any link or the Milky Way Image auto closes the panel.</p>
</div>
<div id="mypaneltab" class="ddpaneltab">
<a href="#"><span>Toggle</span></a>
</div>
</div>
ini screen shoot nya
lalu klik SIMPAN TEMPLATE
NB:
anda bisa mengganti
TEKS dan URL gambar di bawah ini sesuai yang anda inginkan
<img src="http://i36.tinypic.com/kak1t0.jpg" class="closepanel" style="float:left; width:200px; height:172px; margin:0 10px 10px 0" />The Milky Way is a barred spiral galaxy that is part of the Local Group of galaxies. Although the Milky Way is one of billions of galaxies in the observable universe,[4] its special significance to humanity is that it is the home galaxy of our Solar System. The plane of the Milky Way galaxy is visible from Earth as a band of light in the night sky, and it is the appearance of this band of light which has inspired the name for our galaxy. It is extremely difficult to define the age at which the Milky Way formed, but the age of the oldest star in the Galaxy yet discovered, HE 1523-0901, is estimated to be about 13.2 billion years, nearly as old as the Universe itself. -Source: <a href="http://en.wikipedia.org/wiki/Milky_way" style="color:white">Wikipedia</a>.
</p>
<p>Note: Click on any link or the Milky Way Image auto closes the panel.</p>
hem...
itu aja caranya
masih bingung juga?....tanyakan saja....
mudah bukan
Sumber:dynamicdrive
19 September 2009
Sejalan dengan berlalunya Ramadhan tahun ini
mari kita tingkatkat tali silahturahmi antar sesama blog
nah oleh karena itu
untuk meluruskan tujuan itu
mari kita sama sama untuk menjalin tali silahturahmi
dengan bertukar link antar sesama blogger
tersedia 16 banner yang kosong hanya cuma cuma(alias GRATIS)
bagi anda yang menginginkan banner anda berada di blog
persyaratannya:
banner tidak unsur komersial&bisnis(contohnya:PTC)
tidak ada unsur porno
memasang link atau banner saya
ukuran banner 125 x 125
bagaimana kalo space nya sudah penuh?
jangan berkecil hati
nah karena untuk menjalin tali silahturahmi
saya akan menambahkan anda di bloglist saya
berminat?
silahkan kirimkan URL blog anda
berserta URL gambar anda
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
Sejalan dengan berlalunya Ramadhan tahun ini
Kemenangan akan kita gapai
Selamat Hari Raya Idul Fitri
Taqobalallahu minna wa minkum
Mohon maaf lahir dan bathin
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
18 September 2009
Kemarin ada teman yang mampir ke blog saya
ada yang berkomentar "gimana sih cara buat Emoticon kayak gini? koq bagus sih"
nah oleh karena itusaya akan menjawab pertanyaan sobat blogger
mungkin teman teman mau coba?
Mau Emoticon yang Lucu Lucu ini ada di kotak Komentar anda?
Emoticonnya Beda dari yang lainnya lho?
mau lihat Contoh Emoticon yang lucu lucunya?
nih screen shootnya
mau lihat yang gambar geraknya?
ada tuh di kotak komentar saya
Mau gak tuh pasang Emoticon Yang kayak gitu?
kalo Mau yuk ikuti langkah langkahnya
pertama:
Login dahulu di account blogger anda
kedua:
Pilih Tata Letak
ke tiga:
Pilih Edit HTML
untuk menghindari sesuatu yang tidak di inginkan
jangan lupa untuk membackup dulu template anda
di klik dulu Download Template Lengkap
biar engga kelamaan
nah sebelum memulainya
kasih tanda ceklist di kotak yang sebelah kiri Expand Template Widget
coba anda cari kode HTML berikut ini
<p class='comment-footer'>
WARNING!!
AWAS KODE INI ADA 2 LHO,JADI JANGAN SAMPAI SALAH TEMPAT
ini Kode lengkapnya
<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>
</b:if>
copy kode yang berwarna biru di bawah ini dan letakan di bawah kode
<p class='comment-footer'>
<b><img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/white-dog-blue-nose-emoticons-3.gif'/>
:f
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/white-dog-blue-nose-emoticons-1.gif'/>
:D
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/white-dog-blue-nose-emoticons-6.gif'/>
:-D
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/white-dog-blue-nose-emoticons-2.gif'/>
:)
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-41.gif'/>
;;)
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/white-dog-blue-nose-emoticons-5.gif'/>
:!
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-teddy-bear-in-cold-emoticons.gif'/>
:$
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-61.gif'/>
x(
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-81.gif'/>
:?
</b>
<b>
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-110.gif'/>
:@
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-71.gif'/>
:~
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-171.gif'/>
:|
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-51.gif'/>
:))
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-21.gif'/>
:(
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-181.gif'/>
:((
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-131.gif'/>
:o </b>
masih bingung cara nempatin kodenya?
nih saya kasih contoh penempatannya
<p class="'comment-footer'">
<b><img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/white-dog-blue-nose-emoticons-3.gif'/>
:f
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/white-dog-blue-nose-emoticons-1.gif'/>
:D
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/white-dog-blue-nose-emoticons-6.gif'/>
:-D
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/white-dog-blue-nose-emoticons-2.gif'/>
:)
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-41.gif'/>
;;)
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/white-dog-blue-nose-emoticons-5.gif'/>
:!
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-teddy-bear-in-cold-emoticons.gif'/>
:$
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-61.gif'/>
x(
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-81.gif'/>
:?
</b>
<b>
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-110.gif'/>
:@
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-71.gif'/>
:~
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-171.gif'/>
:|
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-51.gif'/>
:))
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-21.gif'/>
:(
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-181.gif'/>
:((
<img border='0' src='http://i242.photobucket.com/albums/ff196/rodadepan/cute-white-kitten-head-emoticon-131.gif'/>
:o </b>
<b:if cond="'data:post.embedCommentForm'">
<b:include data="'post'" name="'comment-form'/">
<b:else>
<b:if cond="'data:post.allowComments'">
<a href="http://www.blogger.com/%27data:post.addCommentUrl%27" onclick="'data:post.addCommentOnclick'"><data:postcommentmsg></data:postcommentmsg></a>
</b:if>
</b:else>
</b:include></b:if></p>
nah kalau sudah,coba nada cari kode di bawha ini
</body>
dah ketemu belum?
kalau sudah copy kode di bawah ini
dan letakan persis di atas kode
</body>
<script src='http://ariistiadi.googlepages.com/ucingaja.js' type='text/javascript'/>
dah sekarang anda klik SIMPAN TEMPLATE
NB:ADA BEBERAPA TEMPLATE YANG YAANG TIDAK KOMPATIBLE
DENGAN EMOTICON YANG SAYA BUAT
SEHINGGA EMOTICONNYA TIDAK BISA MUNCUL
dah kayaknya itu aja
belum berhasil...? tanyakan saja
17 September 2009
jQuery Image Magnify atau anama lainnya auto image zoom in dan auto image zoom out
kalo bahasa indonesianya otomatis memperbesar foto dan otomatis memperkecil foto
mau lihat contohnya
klik DISINI
bagi yang mau coba silahkan ikuti langkah langkahnya
pertama:
masuk dulu di account blogger anda
kedua:
pilih Tata Letak
ketiga:
Pilih Edit HTML
coba cari kode di bawah ini
<head>
kalau sudah ketemu copy kode yang berwarna merah.
letakan kode yang berwarna merah persis di bawah kode
<head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://ariistiadi.googlepages.com/jquery.magnifier.js' type='text/javascript'>
/***********************************************
* jQuery Image Magnify- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
</script>
bingung cara nempatinnya
nih saya kasih contoh penempatan kodenya
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://ariistiadi.googlepages.com/jquery.magnifier.js' type='text/javascript'>
/***********************************************
* jQuery Image Magnify- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
</script>
masih bingung juga?
nih screen shootnya
klik Simpan Template
nah selanjutnya kita pindah ke Elemen Halaman
klik Tambah Gadget
kalau dah di klik
pilih HTML/JavaScript
setelah itu copy kode di bawah ini
<img style="width:200px; height:150px" src="http://ariistiadi.googlepages.com/Clipart-Cartoon-Design-04.gif" class="magnify"/>
<img border="0" src="http://ariistiadi.googlepages.com/Web_2_0_RSS_Icon_by_datamouse.gif" class="magnify"/>
silahkan ganti :
link http://ariistiadi.googlepages.com/Web_2_0_RSS_Icon_by_datamouse.gif dan http://ariistiadi.googlepages.com/Clipart-Cartoon-Design-04.gif gambar milik saya dengan link gambar milik anda
jangan lupa setiap anda ingin menambah gambarnya kode
" class="magnify"
contohnya:
<img src="gambaranda" class="magnify" border="0" />
jangan lupa klik SIMPAN
udah itu aja caranya
mudah bukan...?
belum berhasil juga..? tanyakan saja oke
sumber:
www.dynamicdrive.com
14 September 2009
bikin Accordion menu alias menu yang bisa kebuka dan ketutup secara otomatis
banyak dari teman teman yang menanyai gimana sih
bikin menu yang bisa kebuka dan ketutp secara otomatis
contohnya yang saya pakai di sidebar saya
karena banyak yang bertanya gimana cara membuatnya
oke deh saya akan kasih tutorialnya
pertama
Login dulu di Account blogger anda
kedua
pilih Tata Letak
ketiga
klik Edit HTML
cari tag HTML di bawah ini:
<head>
kalau sudah copy kode yang berwarna merah
dan paste di atas kode
<head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://ariistiadi.googlepages.com/ddaccordion1.js' type='text/javascript'>
</script>
kalo masih bingung
seperti ini contoh penempatannya
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://ariistiadi.googlepages.com/ddaccordion1.js' type='text/javascript'>
</script>
<head>
masih bingung juga?
nih saya kasih screen shootnya
terus coba cari kode yang berwarna hijau
</head>
kalo sudah ketemu
copy kode kode yang berwarna biru dan paste di bawah kode yang berwarna hijau
</head>
<script type='text/javascript'>
ddaccordion.init({
headerclass: "headerbar", //Shared CSS class name of headers group
contentclass: "submenu", //Shared CSS class name of contents group
revealtype: "mouseover", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
defaultexpanded: [0], //index of content(s) open by default [index1, index2, etc] [] denotes no content
onemustopen: true, //Specify whether at least one header should be open always (so never all headers closed)
animatedefault: false, //Should contents open by default be animated into view?
persiststate: true, //persist state of opened contents within browser session?
toggleclass: ["", "selected"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
togglehtml: ["", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
animatespeed: "normal", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
//do nothing
},
onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
//do nothing
}
})
</script>
nih screen shootnya
kalo sudah kita ke tahap selanjutnya
coba anda cari kode di bawah ini
]]></b:skin>
kalo sudah,copy kode kode di bawah ini persis di atas kode
]]></b:skin>
.urbangreymenu{width:100%}
.urbangreymenu .headerbar{font:bold 13px Verdana; color:white; background:#606060 url(http://i242.photobucket.com/albums/ff196/rodadepan/arrowstop.gif) no-repeat 8px 6px; margin-bottom:0; text-transform:uppercase; padding:7px 0 7px 31px}
.urbangreymenu .headerbar a{text-decoration:none; color:white; display:block}
.urbangreymenu ul{list-style-type:none; margin:0; padding:0; margin-bottom:0}
.urbangreymenu ul li{padding-bottom:2px}
.urbangreymenu ul li a{font:normal 12px Arial; color:black; background:#E9E9E9; display:block; padding:5px 0; line-height:17px; padding-left:20px; text-decoration:none}
.urbangreymenu ul li a:visited{color:black}
.urbangreymenu ul li a:hover{color:white; background:black}
nih screen shootnya
dah belum?
kalo sudah klik SIMPAN TEMPLATE
selanjutnya kita klik ELEMEN HALAMAN
kalau sudah di ELEMEN HALAMAN
klik Tambah Gadget
kalau dah di klik
pilih HTML/JavaScript
setelah itu copy kode di bawah ini
<div class="urbangreymenu">
<h3 class="headerbar"><a href="http://www.catatan-belajarku.blogspot.com">Catatan</a></h3>
<ul class="submenu">
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
</ul>
<h3 class="headerbar"><a href="http://www.catatan-belajarku.blogspot.com">Catatan</a></h3>
<ul class="submenu">
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
</ul>
<h3 class="headerbar"><a href="http://www.catatan-belajarku.blogspot.com">Catatan</a></h3>
<ul class="submenu">
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
<li><a href="http://www.catatan-belajarku.blogspot.com">catatan</a></li>
</ul>
</div>
jangan lupa klik SIMPAN
anda bisa mengganti link <a href="http://www.catatan-belajarku.blogspot.com">catatan</a>
dengan link milik anda sendiri
kalau anda ingin melihat lihat menu yang lain anda bisa
mengunjungi Dynamic Drive
Sumber: www.dynamicdrive.com
NB:belum berhasil? tanyakan saja
30 Agustus 2009
Tahukah anda bahwa Flash disk Nexus itu bisa di partisi?
saya sebenarnya juga baru tahu bahwa flash disk Nexus itu bisa di partisi
malahan bisa di kasih password juga
hebat nih yang bikin flash disk nexus
tau aja gimana caranya menangkal maling atau pencuri data yang ada di flash disk kita
ini dah saya coba di flash disk yang bentuknya seperti ini
kalo bentuk yang lain saya engga tau bisa apa tidak? kayaknya sih bisa asal satu produk
sebenernya saya dapat flash disk itu engga beli alias dapet dari warnet ,hehe
biasanya setiap kita membeli flash disk ada drivernya
dan apabila tidak ada drivernya( atau menemukan flash disk di warnet) anda bisa mendownload di bawah ini
dah di download belum?
kalo sudah yuk kita mulai sekarang biar engga kelamaan
pertama:
ekstract dahulu file tersebut
kedua:
buka folder driver flash disk nexus terus buka lagi folder tools
ketiga:
buka program UFDUtility
nah kalo sudah di buka maka akan muncul tampilan seperti ini
lalu klik partition manager
kalo sudah di klik akan muncul tampilan seperti ini
nah kalo kita ingin membuat partisi anda tinggal menggeser anak panah kursornya ke atas
di bawah ini contohnya
apabila anda ingin menginginkan kapasitas yang berbeda,anda tinggal menggeser saja ke atas atau kebawah
saya terangkan yang saya beri nomor
1.(Public Area) kapasitas ukuran untuk area umum atau semua orang bisa mengakses
2.(Security area) kapasitas ukuran untuk area khusus atau hanya kita saja yang bisa mengkases
3.(input new password) kolom untuk memberi password pada security area
4.(confirm password) kolom untuk memasukan kembali password security area
5.(volume label)kolom untuk memasukan nama drive khusus isikan saja UMUM(Public Area)
6.(volume label)kolom untuk memasukan nama drive khusus isikan saja KHUSUS(SEcurity Area)
7.(Hint)kata kata untuk kita memudahkan mengingat password
nah kalo sudah di isi semua lalu klik START untuk memulai membuat partisi
sebelum mengklik START anda harus membackup dulu data anda
nah kalo sudah menjadi 2 partisi
akan muncul drive UMUM
nah untuk membuat drive KHUSUSnya anda klik menu Security Manager
nah kalo sudah di klik Security Manager akan muncul tampilan seperti ini
apabila anda ingin keluar dari drive KHUSUS anda harus LOGOUT dahulu
caranya:
klik Security Manager
lalu klik LOGOUT
NB:Supaya Folder anda lebih ama lagi dari tangan tangan jahil atau maling data anda bisa klik di bawah ini
apabila belum berhasil atau pertanyaan,saran silahkan di tulis di kotak komentar
dah itu aja caranya....
mudah bukan....?