Tutorial

Sabtu, 28 Juli 2012

Cara Membuat Menu Dropdown Pada Blogger

Seperti biasa, langkah pertama yang wajib dilakukan adalah login ke blogger.

1. Klik menu / tulisan Template

2. Klik menu Edit HTML

3. Klik tulisan / menu Lanjutkan
4. Beri centang pada Expand Template Widget

Kode Yang Harus Di Cari / Temukan

Cari kode :

<div class='main-outer'> atau <div id='main-wrapper'> atau <div id='main'>

Setelah kode tersebut sudah ditemukan silakan pasang kode berikut tepat di atasnya

Hasilnya seperti ini :

Catatan:

Silakan ganti tanda PAGAR (#) dengan link/url yang kamu mau, boleh link posting atau link Label (Kategori)
Sub Menu dan Sub adalah sub menu dari menu (Menu + Sub Menu dan Menu + Sub), silakan ganti nama masing-masing menu sesuai selera.

Hal-hal yang mungkin akan ditanyakan :

1. Kode yang harus dicari tidak ada di blog saya ?

Solusinya, silakan pasang kode menu horizontak tersebut di tempat yang kira-kira pas dengan yang kamu mau, kemudian klik Preview (Pratinjau). Jika masih belum pas silakan pindahkan kode tersebut kemudian Pratinjau lagi. Lakukan sampai menunya sudah berada ditempat yang kamu mau.

2. Bagaimana cara memasukkan beberapa artikel dalam 1 menu ?

Agar bisa menampilakan beberapa artikel dalam 1 menu maka kamu harus pasang Link Label pada menu tersebut, caranya sama, yaitu dengan cara mengganti tanda pagar (#) dengan link label yang ada di blog teman.

Update 25 Juni 2012
Jika susah pasang menu horizontal nya pada bagian Edit HTML silakan pasang pada Gadget/Widget (dibawah header), caranya:

Klik Tata Letak
Klik Tambah Gadget/Add Gadget
Pilih Gadget Html/JavaScript
Simpan/Save
Selesai

Untuk mengubah lebar menu horizontal nya silakan cari kode:

#cat-nav {background:#156994;margin:0 15px;padding:0;height:35px;}

Kemudian tambahkan kode (width:900px) di atrara { dan }, sehingga menjadi seperti ini

#cat-nav {background:#156994;width:900px;margin:0 15px;padding:0;height:35px;}

Ingat, angka 900px hanya sebagai contoh saja, silakan rubah angka 900 dengan ukuran lebar yang kamu inginkan (yang sesuai dengan template kamu)

Untuk mengedit tampilan yang lainnya seperti warna, font, dsb. Silakan dicoba edit sendiri CSS nya ya, yang saya maksud CSS itu adalah kode yang ada di antara <style> dan </style>.

. Bagaimana cara menambahkan menu ?Untuk menambahkan menu pada kode menu horizontal di atas silakan tambahkan kode berikut

<li><a href='#'>Menu</a></li>

Pasang kode di atas sebelum kode

</ul>
</div>

Maka kodenya jadi seperti ini

<li><a href='#'>Menu</a></li>
</ul>
</div>

Dengan menambahkan kode di atas itu artinya kamu sudah menambahkan 1 menu, jika ingin menambahkan dua menu maka silakan masukkan kode tambahan tersebut 2 x

<li><a href='#'>Menu</a></li>
<li><a href='#'>Menu</a></li>
</ul>
</div>

Untuk menambahkan menu yang ada sub menu nya maka silakan tambahkan kode berikut

<ul id='sub-custom-nav'>
<li><a href='#'>Sub 1</a></li>
<li><a href='#'>Sub 2</a></li>
<li><a href='#'>Sub 3</a></li>
<li><a href='#'>Sub 4</a></li>
<li><a href='#'>Sub 5</a></li>
<li><a href='#'>Sub 6</a></li>
</ul>
</li>

Caranya sama dengan cara menambahkan menu
Bagaimana cara menambahkan sub menu saja?
untuk menambkan sub menu saja caranya hampir sama dengan cara menambahkan menu, silakan sisipkan kode

<li><a href='#'>Sub Menu</a></li>

Sebelum kode

</ul>
</li>

Sehingga jadinya seperti ini

<ul id='sub-custom-nav'>
<li><a href='#'>Sub 1</a></li>
<li><a href='#'>Sub 2</a></li>
<li><a href='#'>Sub 3</a></li>
<li><a href='#'>Sub 4</a></li>
<li><a href='#'>Sub 5</a></li>
<li><a href='#'>Sub 6</a></li>
<li><a href='#'>Sub Menu</a></li>
</ul>
</li>
</ul>

Nah itulah cara menambahkan menu dan sub menu, selamat mencoba.

Semoga bermanfaat.

Read More ->>

Rabu, 25 Juli 2012

Cara Membuat "Read More" Otomatis Pada Blogger

Oke gak perlu berlama-lama lagi saya langsung aja ke tutorial.

Sebelumnya silahkan sobat download dulu templatenya biar kalo terjadi kesalahan bisa langsung dikembalikan ke template sebelumnya.

PERTAMA, silakan masuk ke acount blogger anda kemudian pilih Edit Html, jangan lupa memberikan tanda ceklis pada bacaan "Expand Widget Template" atau lihat gambar di bawah ini :

cari kode </head> kemudian masukkan script di bawah ini persis dibawah kode tersebut.
<script type='text/javascript'> var thumbnail_mode = "no-float" ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/>

KEDUA, cari kode html berikut ini :
<data:post.body/> atau <p><data:post.body/></p>
ganti kode tersebut dengan kode di bawah ini :

<b:if cond='data:blog.pageType != "item"'>

</script>

<a expr:href='data:post.url'>»»  READMORE...</a></span>

</b:if>

<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

Keterangan : tulisan yang berwarna merah adalah yang bisa anda ganti.
==> Summary noimg 430 = tinggi artikel terpenggal tanpa image
==> Summar img 430 = tinggi artikel terpenggal dengan image
==> Readmore bisa anda ganti dengan Baca Selengkapnya, full read dll...

KETIGA, klik save template

Selanjutnya anda bisa melakukan postingan dan lihat hasilnya, Readmore atau baca selengkapnya akan secara otomatis terpasang setelah anda publish postingannya.

Selamat mencoba......... Semoga bermanfaat........

Read More ->>

Cara Membuat Scroll Bar Pada Blog Archive

Hai sobat bloggger posting kali ini saya beri judul cara membuat scroll pada arsip di blog. Untuk membuatnya silahkan ikuti langkah-langkah berikut :

• Masuk ke blogger
• Klik Tata Letak
• Klik Elemen Halaman
• Tambahkan sebuah elemen halaman=> Tambah elemen Arsip Blog
• Tapi Anda harus pilih gaya Hierarki

Pada Menu Diatas Itu belum terdapat fungsi scroll, untuk membuatnya memiliki fungsi scroll ikuti langkah-langkahnya lagi !
• Setelah itu, klik Edit Html
• Beri tanda centang pada tulisan Expand Widget Template
• Lalu Anda cari kode seperti ini <div id='ArchiveList'>
letakan kde yang berwarna merah dan hijau seperti di bawah ini

<b:widget id='BlogArchive2' locked='false' title='Arsip Blog' 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:ancho; height:100px;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + "_ArchiveList"'>
<b:if cond='data:style == "HIERARCHY"'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == "FLAT"'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == "MENU"'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div></div>

Kode warna merah dan hijau adalah kode yang ditambahkan kedalam script tersebut
Kode warna hijau yang dicetak tebal adalah tinggi dari elemen tadi, silahkan kawan ganti agar sesuai dengan blog kawan.....

Selamat mencoba....... Semoga bermanfaat......

Read More ->>

Selasa, 24 Juli 2012

Cara Memasang Tanda Tangan Pada Blogger

DI BLOG (BLOGGER), kita dapat membubuhkan tanda tangan (signature) sebagai sebagai identitas penulis blog (blog author). Dengan adanya tanda tangan ini, posting-posting blog terasa lebih khusus, karena memiliki tanda tangan sang penulis blog yg unik. Sobat Blogger bisa membuat dan memasangnya di blog Blogger dengan mudah. Kehadiran online signature maker memberikan kemudahan untuk membuat tampilan tanda tangan tersebut. Selain untuk digunakan di email, gambar tanda tangan ini bisa digunakan pula di blog sebagai blog author signature.

Cara Membuat Gambar Tanda Tangan Secara Online

Untuk membuat tanda tangan dengan online tool, saya memilih menggunakan MyLiveSignature, sehingga tutorial ini akan mengetengahkan langkah-langkah membuat signature dengan online tool tersebut.

1. Masuk ke mylivesignature.com.

2. Ada beberapa opsi disana, jika ingin membuat tanda tangan tanpa register, klik "Proceed". Jika ingin daftar, klik "register"

3. Setelah klik proceed, anda akan masuk ke halaman opsi jenis signature yang akan dibuat. Ada 4 cara membuat signature: dengan wizard, dengan menulis sendiri di screen tool, upload gambar yang di-scan, atau menggunakan font. sendiri. Saya sarankan untuk membuat dengan wizard (pilih opsi pertama), karena cara itu lebih mudah.

4. Tuliskan nama anda atau nama yg ingin dibuat sebagai tanda tangan. Klik 'next step'.

5. Langkah selanjutnya adalah memilih jenis font tanda tangan. Ada banyak jenis font dan langsung bisa dilihat melalui preview. Pilih font yang diinginkan dengan klik opsi di sebelah preview. Setelah itu 'klik next'.

6. Pilih warna tanda tangan dan background. Sesuaikan background dengan background halaman blog, atau pilih/centang "transparent".

7. Setelah gambar jadi, anda akan dibawa ke halaman hasil akhir gambar. Di halaman tersebut terdapat gambar tanda tangan/signature dan di bwahnya tertera ID dari tanda tangan tersebut. SImpan ID jika dibutuhkan kembali di kemudian hari. Untuk menyimpan gambar, klik kanan, lalu pilih 'save as' atau 'save image as'

Cara Memasang Tanda Tangan di Bawah Posting Blog

1. Pastikan terlebih dahulu gambar tandatangan tadi telah di upload. Kemudian simpan direct url dari gambar tersebut.

2. Untuk menampilkan gambar di bawah posting kita bisa menggunakan dua cara:

a. Dengan memasukkan html gambar di fitur blogger untuk menyisipkan widget di posting:

Dari Setting > Formatting > Lihat ke bagian kosong di sebelah kanan Post template di bagian bawah halaman.
Isikan script image ke dalamnya:
< img border="0" src="urlgambartandatangan.jpg" />
Ganti urlgambartandatangan.jpg dengan url gambar tandatangan sobat.

Kelemahan dari cara ini adalah susunan struktur pada badan post kadang-kadang bisa kacau, dan membutuhkan waktu load yang lebih lama

b. Dengan memasukkan gambar di bagian template HTML melalui Edit HTML Blogger:

Melalui Edit HTML, sobat dapat memasukkan script secara lebih leluasa dan juga dapat menambahkan aturan-aturan tertentu agar struktur tampilan lebih sempurna.

- Di beberapa tutorial, saya melihat script yang dimasukkan hanya dalam bentuk HTML gambar seperti ini:

< img border="0" src="urlgambartandatangan.jpg" />

Namun, jika hanya dengan HTML gambar, struktur gambar menjadi tidak independen karena dia mengikuti aturan (div) pada tulisan di atasnya (tulisan posting di bagian akhir/bawah). Sehingga kadang-kadang gambar betubrukan dengan tulisan atau bergeser.

- Untuk membuat gambar berstruktur independen maka tambahkan struktur sendiri pada tag gambar:

<div>< img border='0' src='urlgambartandatangan.jpg' /></div>

Dengan cara ini, gambar dapat berada di baris selanjutnya di bawah tulisan posting.

- Agar gambar bisa diatur posisinya, akhirnya gunakan aturan berikut:

<div style='padding:5px;float:right'>< img border="0" src='urlgambartandatangan.jpg' /></div>

- right akan menampilkan gambar di sisi kanan, ganti dengan left jika ingin gambar berada di sebelah kiri.Ganti urlgambartandatangan.jpg dengan url gambar tandatangan yg telah di-upload.

- Setelah selesai mengedit script, masuk ke dahsboard > design > Edit HTML.

- Jangan lupa centang "Expand Widget Templates"

- Cari <data:post.body/>

- Letakkan kode yang telah diedit tadi tepat di BAWAH-nya.

- Save Template.

Note: Jika blog telah menggunakan fitur auto readmore, ada lebih dari satu <data:post.body/>, letakkan kode tanda tangan di bawah <data:post.body/> yg kedua.

Read More ->>

Cara Membuat Menu Horizontal Pada Blogger

Seperti biasa, langkah pertama yang wajib dilakukan adalah login ke blogger.

1. Klik menu / tulisan Template

2. Klik menu Edit HTML

3. Klik tulisan / menu Lanjutkan
4. Beri centang pada Expand Template Widget

Kode Yang Harus Di Cari / Temukan

Cari kode :

<div class='main-outer'> atau <div id='main-wrapper'> atau <div id='main'>

Bila Sulit Untuk Menuemukan Kode tersebutKlik CTRL+F
Setelah kode tersebut sudah ditemukan silakan pasang kode berikut tepat di atasnya

Hasilnya seperti ini :

Catatan:

Silakan ganti tanda PAGAR (#) dengan link/url yang kamu mau, boleh link posting atau link Label (Kategori)
Sub Menu dan Sub adalah sub menu dari menu (Menu + Sub Menu dan Menu + Sub), silakan ganti nama masing-masing menu sesuai selera.

Hal-hal yang mungkin akan ditanyakan :

1. Kode yang harus dicari tidak ada di blog saya ?

Solusinya, silakan pasang kode menu horizontak tersebut di tempat yang kira-kira pas dengan yang kamu mau, kemudian klik Preview (Pratinjau). Jika masih belum pas silakan pindahkan kode tersebut kemudian Pratinjau lagi. Lakukan sampai menunya sudah berada ditempat yang kamu mau.

2. Bagaimana cara memasukkan beberapa artikel dalam 1 menu ?

Agar bisa menampilakan beberapa artikel dalam 1 menu maka kamu harus pasang Link Label pada menu tersebut, caranya sama, yaitu dengan cara mengganti tanda pagar (#) dengan link label yang ada di blog teman.

Update 25 Juni 2012
Jika susah pasang menu horizontal nya pada bagian Edit HTML silakan pasang pada Gadget/Widget (dibawah header), caranya:

Klik Tata Letak
Klik Tambah Gadget/Add Gadget
Pilih Gadget Html/JavaScript
Simpan/Save
Selesai

Untuk mengubah lebar menu horizontal nya silakan cari kode:

#cat-nav {background:#156994;margin:0 15px;padding:0;height:35px;}

Kemudian tambahkan kode (width:900px) di atrara { dan }, sehingga menjadi seperti ini

#cat-nav {background:#156994;width:900px;margin:0 15px;padding:0;height:35px;}

Ingat, angka 900px hanya sebagai contoh saja, silakan rubah angka 900 dengan ukuran lebar yang kamu inginkan (yang sesuai dengan template kamu)

Untuk mengedit tampilan yang lainnya seperti warna, font, dsb. Silakan dicoba edit sendiri CSS nya ya, yang saya maksud CSS itu adalah kode yang ada di antara <style> dan </style>.

. Bagaimana cara menambahkan menu ?Untuk menambahkan menu pada kode menu horizontal di atas silakan tambahkan kode berikut

<li><a href='#'>Menu</a></li>

Pasang kode di atas sebelum kode

</ul>
</div>

Maka kodenya jadi seperti ini

<li><a href='#'>Menu</a></li>
</ul>
</div>

Dengan menambahkan kode di atas itu artinya kamu sudah menambahkan 1 menu, jika ingin menambahkan dua menu maka silakan masukkan kode tambahan tersebut 2 x

<li><a href='#'>Menu</a></li>
<li><a href='#'>Menu</a></li>
</ul>
</div>

Untuk menambahkan menu yang ada sub menu nya maka silakan tambahkan kode berikut

<ul id='sub-custom-nav'>
<li><a href='#'>Sub 1</a></li>
<li><a href='#'>Sub 2</a></li>
<li><a href='#'>Sub 3</a></li>
<li><a href='#'>Sub 4</a></li>
<li><a href='#'>Sub 5</a></li>
<li><a href='#'>Sub 6</a></li>
</ul>
</li>

Caranya sama dengan cara menambahkan menu
Bagaimana cara menambahkan sub menu saja?
untuk menambkan sub menu saja caranya hampir sama dengan cara menambahkan menu, silakan sisipkan kode

<li><a href='#'>Sub Menu</a></li>

Sebelum kode

</ul>
</li>

Sehingga jadinya seperti ini

<ul id='sub-custom-nav'>
<li><a href='#'>Sub 1</a></li>
<li><a href='#'>Sub 2</a></li>
<li><a href='#'>Sub 3</a></li>
<li><a href='#'>Sub 4</a></li>
<li><a href='#'>Sub 5</a></li>
<li><a href='#'>Sub 6</a></li>
<li><a href='#'>Sub Menu</a></li>
</ul>
</li>
</ul>

Nah itulah cara menambahkan menu dan sub menu, selamat mencoba.

Semoga bermanfaat.

Read More ->>

Cara memasang kamera CCTV pada blogger

Nah kali ini saya akan membagikan trik yg keren sekali yaitu kamera CCTV di blog, langsung saja kita ke topek pembahasan, widget ini sebetulnya hanya hiasan untuk mempercantik blog kita, mungkin saja para copaser akan takut karena gerak geriknya diawasi lewat kamera CCTV kwkwkwkwkwkwkwk, jadinya aman postingan kamu :D

Memasang Kamera CCTV diBlog

DEMO KLIK DISINI

1.Login Ke akun blog kalian.

2.Klik tata letak

3.Add Gadget/Tambah Gadget

4.Pilih HTML

5.Lalu Tambahkan Kode ini di dalamnya

Mudahkan ?

Sumber : http://onlyx-45.blogspot.com

Read More ->>

Cara Mengubah Warna Scroll Pada Blogger

Ternyata scroll pada halaman blogger sobat bisa di ganti lho . . .^^
Kalo sobat bosen ama tampilan scroll standart maka sobat bisa merubahnya sesuai selera sobat!. Jika sobat menerpakan tutorial kali ini di blogger sobat maka secara otomatis semua halaman ataupun widget yang menggunakan fungsi scroll akan secara otomatis berubah tampilannya.
Udahlah gak usah lama-lama lagi lansung kita bahas aja dah caranya, oh iya kalo sobat masih belu paham maksudanya sobat bisa liahat gambar di bawah ini :

Dah paham kan? mari sekarang kita bahas caranya :

1. Masuk ke akun blogger sobat.

2. Pada Dasbor klick Rancangan ➨ Edit HTML ➨ CentangExpand Template Widget.

4. Selanjutnya sobat cari kode ]]><b:skin&gt; Jika kesulitan mencarinya coba tekan CTRL+F

5. Jika sudah ketemu sekarang letakkan kode berikut di atas kode tadi.

; text-align: left;">::-webkit-scrollbar {
height:12px;
width: 12px;
background: #ee0000;
}
::-webkit-scrollbar-thumb {
background-color: #000fff;
-moz-border-radius: 10px;
border-radius: 10px;
}

6. Klick Pertinjauan, bila sudah muncul baru klick simpan template.

Keterangan :
Warna merah adalah kode warna background scroll sobat dapar menggantinya.
Warna biru adalah kode warna scrollya sobat juga dapat menggantinya.
Untuk melihat kode warna silahkan klik disini.
Scroll ini biasanya hanya muncul pada browser google chrome, jika pada browser lainnya saya belum Pernah mencoba.

Read More ->>

Cara Menghilangkan Tulisan Diberdayan Oleh Blogger

Mungkin itulah kata kunci yang anda cari di google selama ini. Memang sudah banyak blog Indonesia yang menuliskan tutorialnya, tetapi daripada blog ini sepi tidak ada artikel terbarunya mending saya tulis saja artikel ini. Sebenarnya tulisan diberdayakan oleh blogger ini ada pada template bawaan blogger saja yang kebanyakan, tetapi ternyata ada juga template yang bisa kita download dengan gratis di internet yang mempunyai tulisan ini seperti template yang saya pakai sekarang adalah salah satu contoh template bukan bawaan blogger tetapi mempunyai tulisan yang sama dengan template bawaan blogger yaitu "diberdayakan oleh blogger". Daripada banyak ngebacot mending langsung saja:

Login ke akun blogger anda
Masuk ke Opsi Lainnya/More Options
Klik Template
Kemudian klik Edit Template
Pilih Lanjutkan/Proceed
Centang Expand Template Widget
Cari kode ]]></b:skin> dengan menekan tombol CTRL + F agar memudahkan pencarian
Kemudian pastekan kode berikut tepat diatas kode ]]></b:skin> tadi

#Attribution1 {

height:0px;

visibility:hidden;

display:none

}

Klik Simpan/Save Template
Lihat hasilnya, tulisan diberdayakan oleh blogger pada template blog anda sudah tidak ada lagi

Read More ->>

Cara Membuat Tulisan Berkedip Pada Blogger

Blogging memang adalah sebuah hoby yang mengharuskan penghobinya terus belajar dan belajar. Dengan belajar tanpa putus asa walau banyak menuai gagal itulah mungkin salah satu resep dimana blog yang dikelolanya supaya menuai sukses. Salah satu yang ingin seorang blogger belajari pastinya adalah Cara Membuat Tulisan | Kata | Link Berkedip di Blog / Posting Blog Dengan Mudah. Walau ini sepertinya hal yang sangat sepele tentunya harus dipelajari juga agar kita benar-benar mahir dalam teknik HTML.

Cara membuat tulisan berkedip inipun tidaklah sulit, anda tinggal menambahkan kode <blink>..</blink> saja pada tulisan / link yang ingin diedit. Contoh: misalnya anda ingin mengedipkan tulisan Pasang Iklan, maka anda tinggal menulisnya seperti ini: <blink>Pasang Iklan</blink> di HTMLnya. Lihatlah tulisan yang ditebalkan itu, sudah paham? Jika anda sudah selesai maka hasilnya akan seperti ini Pasang Iklan.

Read More ->>

Cara Memasang Widget Animasi Hamster

Halo sobat blogger Indonesia. Sudah hampir 2/3 hari blog ini tidak ada artikel terbaru nih, dari pada sepi kaya kuburan mending saya kasih aja tutorial cara memasang/menambah widget animasi hamster mengikuti arah mouse. Sebenarnya gimana sih kegunaannya? Simpel saja, kegunaan dari satu widget ini adalah sebagai sarana penghilang GALAU aja buat visitor di blogmu. Kan tidak semua visitor/pengunjung di blog itu sedang senang atau happy ketika membuka blog kamu? Ya nggak?.

untuk anda yang memang suka dengan animasi mengikuti arah mouse ini sebenarnya anda dapat langsung memasang widget ini pada blog anda, dan pada kesempatan kali ini Jin Botol's Blog akan menjelaskan kepada anda cara memasang animasi mengikuti mouse tersebut khusus di blogger. Animasi-animasi beregerak mengikuti mouse ini memanglah sangat cocok untuk anda yang gemar menghias blog dengan berbagai atribut.

Daripada ngebacot mulu mending langsung aja yukk kita masuk kepada pokok pikiran yaitu cara memasangnya di blogger:

Masuk ke akun bloggermu.
Klik 'Opsi Lainnya' atau 'More Options'
Pilih 'Tata Letak' atau 'Layout'
Kemudian klik lagi yaitu di 'tambah gadget' atau 'a gadget'
Pilih widget HTML/JavaScript
Masukkan kode berikut

<a href="http://zootodays.blogspot.com/2012/06/cara-pasang-widget-animasi-hamster.html" target="_blank" title="Click here to get more"></a><object type="application/x-shockwave-flash" style="outline:none;" data="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/hamster.swf?" width="300" height="225"><param name="movie" value="http://hosting.gmodules.com/ig/gadgets/file/112581010116074801021/hamster.swf?"></param><param name="AllowScriptAccess" value="always"></param><param name="wmode" value="opaque"></param></object><a href="http://zootodays.blogspot.com/2012/06/cara-pasang-widget-animasi-hamster.html" target="_blank" title="mau pelihara hamster kaya gini di blogmu?"></a>

Kemudian yang terakhir klik 'simpan' atau 'save'
Dan lihat pada blog anda apa yang akan terjadi?

Note : Jangan lupa untuk dikasih makan itu hamsternya, karena ditakutkan jika tidak diberi makan akan mati. :D

Read More ->>

Cara Membuat Login Pada Blogger

Lain blogger lain wordpress, membuat Login di blogger/blogspot memang tak seperti jika kita membuat login pada wordpress. Yang kita soroti disini adalah di wordpress mempunyai halaman login/kotak login/login form di sidebar,sedangkan login pada blogger hanya tertera pada navigationbar (navbar) yaitu pada bar yang terpampang di ujung atas halaman blogger. Terus, Bagaimana kalau kita ingin membuat form login blogger di sidebar?.... Walaupun dari blogger sendiri tidak menyediakan, tapi kita dapat mensiasatinya. Bagaimana cara membuatnya? hehehe.. Langsung saja, check it out!!.... Kalo cara yang sulit yaitu secara manual berikut caranya dan nanti tampilannya akan seperti ini :

1.Copy Kode Berikut:


<form  id="gaia_loginform"              action="https://www.google.com/accounts/ServiceLoginAuth?service=blogger" method="post"            onsubmit=                 "return(gaia_onLoginSubmit());"                >



<div id="gaia_loginbox">


<table  class="form-noindent" cellspacing="0" cellpadding="5" width="100%" border="0">  


<tr>  <td valign="top" style="text-align:center" nowrap="nowrap"        bgcolor="#e8eefa">  


<input type="hidden" name="ltmpl"             value="draft">  


<div class="loginBox">  


<table id="gaia_table" align="center" border="0" cellpadding="1" cellspacing="0">  


<tr><td colspan="2" align="center">  


<table>  <tr>  <td valign="top">  


<img src="http://kodehexa.googlepages.com/google_transparent.gif"           alt="Google">  


</img>  


</td>  


<td valign="middle">  


<font size="+0">


<b>Akun</b>


</font>  


</td>  


</tr>


</table>  


<font size="-1">  


</font></td>


</tr>  


<script type="text/javascript">


<!--    function onPreCreateAccount() {          return true;        }     function onPreLogin() {                if (window["onlogin"] != null) {        return onlogin();      } else {        return true;      }        }  -->


</script>


<tr>  


<td colspan="2" align="center">  


</td>


</tr>


<tr>  


<td nowrap="nowrap">  


<div align="right">  


<span class="gaia le lbl">  


Email:  


</span>  


</div>  


</td>  


<td>  


<input type="hidden" name="continue" id="continue"           value="https://draft.blogger.com/loginz?d=%2Fhome&amp;a=ADD_SERVICE_FLAG" />  


<input type="hidden" name="service" id="service"           value="blogger" />  


<input type="hidden" name="naui" id="naui"           value="8" />  


<input type="hidden" name="fpui" id="fpui"           value="2" />  


<input type="hidden" name="skipvpage" id="skipvpage"           value="true" />  


<input type="hidden" name="rm" id="rm"           value="false" />  


<input type="hidden" name="ltmpl" id="ltmpl"           value="draft" />  


<input type="hidden" name="hl" id="hl"           value="in" />  


<input type="hidden" name="alwf" id="alwf"           value="true" />  


<input type="hidden" name="alinsu" id="alinsu"           value="0" />  


<input type="hidden" name="ltmpl" id="ltmpl"           value="draft" />  


<input type="hidden"             name="GALX"             value="Ie2nThzvHSI" />  


<input  type="text" name="Email"  id="Email"  size="18" value=""      class='gaia le val'    />  


</td>


</tr>


<tr>  


<td>


</td>  


<td align="left">  


</td>


</tr>


<tr>  


<td align="right">  


<span class="gaia le lbl">  


Sandi:  


</span>  


</td>  


<td>  


<input  type="password"   name="Passwd" id="Passwd"  size="18"       class="gaia le val"     />  


</td>


</tr>


<tr>  


<td>  


</td>  


<td align="left">  


</td>


</tr>  


<tr>  


<td align="right" valign="top">  


<input  type="checkbox" name="PersistentCookie" id="PersistentCookie"    value="yes"          />  


<input type="hidden" name='rmShown' value="1" />  


</td>  


<td>  


<label for="PersistentCookie" class="gaia le rem">  


Ingat saya di komputer ini  


</label>  


</td>


</tr>


<tr>  


<td>  


</td>  


<td align="left">  


<input type="submit" class="gaia le button" name="signIn"           value="Masuk"                  />  


</td>


</tr>


<tr id="ga-fprow">  


<td colspan="2" height="33.0" class="gaia le fpwd"    align="center" valign="bottom">  


<a href="https://www.blogger.com/forgot.g"       target=_top>  


Anda lupa sandi?  


</a>  


</td>


</tr>  


</table>  


</div>  


</td>  


</tr>


</table>


</div>


<input type="hidden" name="asts"       id="asts"       value="">


</form>


<form id="gaia_universallogin"      action="https://www.google.com/accounts/ServiceLoginAuth?service=blogger" method="post"      onsubmit="return(gaia_onLoginSubmit());">  


<input type="hidden" name="continue" id="continue"           value="https://draft.blogger.com/loginz?d=%2Fhome&amp;a=ADD_SERVICE_FLAG" />  


<input type="hidden" name="service" id="service"           value="blogger" />  


<input type="hidden" name="naui" id="naui"           value="8" />  


<input type="hidden" name="fpui" id="fpui"           value="2" />  


<input type="hidden" name="skipvpage" id="skipvpage"           value="true" />  


<input type="hidden" name="rm" id="rm"           value="false" />  


<input type="hidden" name="ltmpl" id="ltmpl"           value="draft" />  


<input type="hidden" name="hl" id="hl"           value="in" />  


<input type="hidden" name="alwf" id="alwf"           value="true" />  


<input type="hidden" name="alinsu" id="alinsu"           value="0" />  


<input type="hidden" name="ltmpl" id="ltmpl"           value="draft" />  


<input type="hidden" name="ltmpl" id="ltmpl"           value="draft" />


</form>

2. Kemudian Login ke Blogger sobat
3. Pilih Layout=> Add Gadget=> HTML//Java Script
4. Paste-kan Kode tadi => Save

Selamat Mencoba...... Semoga bermanfaat.......

Read More ->>

Free Download Videopad Video Editor

Designed to be intuitive, VideoPad is a fully featured video editing program for creating professional looking videos in minutes. Making movies has never been easier.

Drag and drop video clips for easy video editing
Apply effects and transitions, adjust video speed and more
One of the fastest video stream processors on the market

Download VideoPad Video Editing Software for Windows

Get it Free. A free video editor version is available for non-commercial use only. If you will be using it at home you can download the free version here.

Free Download of VideoPad Video Editing Software

Download Now

Purchase VideoPad

Screenshots of VideoPad Free Video Editing Software

Edit video from any camcorder
Capture video from a DV camcorder, VHS, webcam, or import most any video file format including avi, wmv, 3gp, wmv and divx.
Full of transitions and visual effects
Over 50 visual and transition effects to add a professional touch to your movies.
Create videos for DVD, HD, YouTube and more
Burn your movie project to DVD for playback on TV, or as a standalone video file for enjoying on web and portable devices.

Stunning Video Transitions and Effects Choose from a wide range of video clip transitions Preview video effects in real time Customize the duration of applied transitions Overlay text for captions and movie credits Chroma key green screen video production Stereoscopic 3D video conversion and support

Amazing Audio Tools Import and mix music tracks like a pro Make your own custom movie soundtrack with MixPad multi-track mixing software Record your own narrations with the click of a button Use sound effects from the free Sound Effect Library

Complete Video Optimization Fine-tune color and other visual effects Slow down, speed up or reverse playback of video clips Reduce camera shake with video stabilization Add photos and digital images to your sequences VirtualDub plugin support for added tools and effects

Share With Family and Friends Burn to DVD and watch on your TV Save for YouTube and share online Save to PSP, iPod, iPhone or 3GP mobile phone Export movies in standard definition or full HD (720p, 1080i or 1080p)

Technical Information

Supported Input Formats

Import Video
avi, mpeg, wmv, divX, Xvid, mpeg1, mpeg2, mpeg4, mp4, mov, vob, ogm, .3gp, H.264, RM and more
Import Images
bmp, gif, jpg, jpeg, png, tif, tiff, psd, tga, pcx and more
Import Audio
wav, mp3, mp2, mpga, m4a, ogg, avi, mid, flac, aac, wma, au, aiff, ogg, raw, dvf, vox, cda and more

Supported Output Formats

Burn to Disc - DVD, CD, Blu-ray Discs, HD-DVD
Export Video File - avi, wmv, asf, mpg, 3gp, mp4, mov, YouTube, iPod, iPhone, PSP, Mobile Phone
Upload to YouTube - save login credentials to upload videos directly to YouTube from VideoPad

Supported Devices

VideoPad supports just about any type of video input device including DV based or HDV camcorders.

System Requirements

Works on Windows XP, Vista, Windows 7 and 8
For earlier versions please see Windows 98/ME and Windows 2000

May Be Useful.

127-1.gif image by febridriver

Sumber : Febridriver.blogspot.com

Read More ->>

Gratis Download Software Webcame

Download software untuk webcam ini secara gratis, semua software 100% freeware, jadi bisa anda gunakan untuk selama-lamanya dan berakhir saat anda dipanggil yang diatas. Ha ha ha! Tentu saja selain memiliki kemampuan wajibnya untuk merekamvideo, namun juga memiliki fitur-fitur lain yang patut dipertimbankan keberadaannya.

Dari software berikut ini, mana sih yang lebih baik? Wah ya nggak tahulah! Disini saya hanya menampilkan daftarnya saja. Jika mau tahu siapa yang terbaik, download aja semua software webcam dibawah ini, dan rasakan mana yang lebih keren dari yang lainnya.

1. Vitamin D Video

Vitamin D Video bisa dikatakan adalah sofware webcam yang paling favorit. Ini 100% gratis lho, dan dilengkapi dengan beberapa fitur bagus, dan karenanya banyak di download. Berikut beberapa fiturnya :

Dapat mendeteksi benda bergerak dalam video pengawasan.
Dapat mendeteksi manusia dalam video saat pengawasan , artinya dapat membedakan manusia dari benda-benda lainnya (seperti mobil, motor).
Dapat mengirimkan email ketika sesuatu terjadi selama video surveillance.Misalnya, jika seseorang mencoba masuk gerbang lalu melompati dinding, anda bisa mengaturnya untuk mengirimkan email.
Software Vitamin D juga memungkinkan bro dengan mudah memeriksa video Anda nanti.

Vitamin D sebenarnya software webcam premium, tapi ada versi gratisnya. Tertarik mencoba, tertarik menggunakannya.

Download Vitamin D Video di bawah ini :

2. WebcamXP

WebcamXP merupakan software webcam surveilans yang bagus serta gratis. Software ini memungkinkan bro untuk menghubungkan hingga 6 kamera, dan melihat video webcam dari internet. Juga mampu menunjukkan a alamat IP, lokasi, dan informasi negara. Yang terbaru WebcamXP memungkinkan Anda streaming pakan webcam Anda ke iPhone.
Software ini 100% gratis tapi hanya digunakan untuk kepentingan pribadi.

Download WebcamXP dibawah ini :

3. My Webcam Broadcaster

Home Camera Software keren ini dapat digunakan untuk rumah maupun kantor. Cara penggunaannya juga terbilang gampang sekali. Dan dapat mereka dari sumber apapun baik webcam maupun network camera.
Fitur paling bagus menurut blogbintang.com lainnya adalah bro dapat memonitor melalui hp kamu, Cukup bro pergi aja ke website dari My Webcam Broadcaster, masukkan akun kamu.

Download My Webcam Broadcaster dibawah ini :

4. Home Camera

Home Camera bisa dikatakan software gratis untuk webcam yang patut dicoba oleh sobat. Dapat mengkoneksikan 4 webcam atau kamera CCTV ke komputermu dan menggunakan mereka bersama-sama untuk pengawasan. Salah satu fitur bagus yang menyebabkan software ini patut di download adalah… ini memberi akses ke webcam dari internet, jadi dimanapun dirimu berada, tetap dapat melihat apa yang sedang direkam kamera.
Kamu juga dapat berbagi kepada orang lain yang kamu izinkan. Home Camera juga dapat disetting untuk mengirimkan semua peringatan saat pergerakan di deteksi di didepan kamera. Sayangnya yang versi free alias gratis hanya bisa email sedangkan yang paid version bisa untuk HP juga.
Bagi yang ingin mencoba software gratis.

Download Home Camera dibawah ini :

Selamat Mencoba Semoga bermanfaat.

Read More ->>

Cara membuat Teks Berjalan (Marquee)

Terimakasih atas kunjungannya

Sering kali kita melihat blog yang dihiasi oleh tulisan atau kata-kata yang berjalan di blog teman-teman kita. mungkin sebagian besar sudah mengetahuinya. tapi disini ade mencoba untuk sharing kepada teman-teman yang belum mengetahui cara pembuatannya.

Note: yang akan ade bahas ini merupakan tulisan berjalan biasa bukan tulisan berjalan yang apabila ada mouse di area tulisan itu akan berhenti.

berikut cara pembuatannya :

Login ke Blogger
Kemudian klik Tata Letak dan Elemen Halaman
Ketika sudah berada di Elemen Halaman klik Tambah Gadget
Lalu pilih HTML/JavaScript
Langkah selanjutnya masukkan kode marquee yang anda inginkan seperti contoh dibawah ini :

1. Teks berjalan dari kanan ke kiri

kode :

hasil :

Contoh Tulisan Berjalan

2. Teks berjalan dari kiri ke kanan

kode :

hasil :

Contoh Tulisan Berjalan

3. Teks berjalan bolak balik

kode :

hasil :

Contoh Tulisan Berjalan

4. Teks berjalan dari atas ke bawah

kode :

hasil :

Contoh Tulisan Berjalan5. Teks berjalan dari bawah ke atas

kode :

hasil :

Contoh Tulisan Berjalan
6. Teks berjalan mondar-mandir

kode :

hasil :

Contoh Tulisan Berjalan
7. Teks berjalan zig-zag nembus

kode :

hasil :

Contoh Tulisan Berjalan

8. Teks berjalan zig-zag mantul

kode :

hasil :

Contoh Tulisan Berjalan

Langkah Selanjutnya adalah mengganti tulisan Contoh Tulisan Berjalan
dengan tulisan atau kata-kata yang anda inginkan.

Ket :
# direction="left/right/up/down" --> Mengatur arah gerakan teks.

# scrollamount="angka" --> mengatur kecepatan gerakan dalam pixel, semakin besar angka semakin cepat gerakannya.

# behavior="scroll/slide/alternate" --> Untuk mengatur perilaku gerakan :
~> Scroll --> teks bergerak berputar
~> Slide--> teks bergerak sekali lalu berhenti
~> Alternate --> teks bergerak dari kiri kekanan lalu balik lagi ( bolak-balik bo)

# Fungsi dari :

<center> ............. </center>

Supaya tulisan tersebut selalu berada di tengah.

Semoga bermanfaat.

Read More ->>

Cara Membuat Logo Menarik Pada Blogger

Tampilan logo blog pada header yang khas dan memiliki desain yang bagus pasti menjadi dambaan setiap blogger. Logo blog biasanya ditampilkan sebagai bagian dari header yang berupa paduan gambar dan gambar teks yang berisi nama atau ciri dari suatu blog. Umumnya, logo blog digunakan untuk menggantikan teks pada bagian title dan deskripsi header. Tentu saja, membuat logo blog, meskipun hanya berupa logo text, bukanlah perkara mudah bagi setiap orang. Keahlian setidaknya dibutuhkan untuk membuat teks logo dengan menggunakan software image editing semacam Correl Draw maupun Photoshop.

Pengen punya logo teks blog yang seperti ini?

atau seperti ini ?

Kabar baiknya, saat ini ada banyak layanan situs online logo creator and generator yang dapat memudahkan pekerjaan membuat logo blog. Siapa saja dapat dengan mudah membuat teks logo blog maupun logo blog untuk header dengan hasil yang lumayan baik dan tidak mengecewakan. Telah saya pilihkan 6 online logo generator/creator yang mudah untuk digunakan sebagai berikut:

1. www.textspace.net

Memiliki berbagai jenis text generator sesuai dengan bentuk design-nya, misalnya patterned text generator, glitter text generator, LCD text generator, marquee text generator, dan masih banyak lagi yang lainnya. Memiliki interface yang bersih dan waktu muat halaman yang cepat sehingga membuat kita semakin mudah dan cepat dalam membuat logo.

2. www.flamingtext.com

FLaming text memiliki banyak sekali koleksi design yang bermacam-macam dengan berbagai pilihan dari yang paling sederhana dan paling animatif. Membuat anda harus lebih jeli dan benar-benar fokus untuk membuat pilihan karena banyaknya design yang harus dipilih. Interface generator yang lengkap disertai live preview dari hasil teks yang diedit sehingga tidak perlu lagi berpindah halaman untuk kembali mengedit.

3. www.cooltext.com

Sama halnya dengan flamingtext, cooltext memiliki banyak koleksi design dan memiliki interface editor yang mudah dan handy, sehingga siapapun dapat dengan mudah menggunakannya. Terdapat dua jenis design, yaitu logo dan button. Dilengkapi pula dengan puluhan jenis font menarik yang dapat dipilih dan disesuaikan dengan design blog.

4. www.simwebsol.com

Ketika membuka halaman web situs ini, anda akan masuk ke halaman text logo editor yang sederhana. Kostumisasi keseluruhan teks diserahkan kepada user, sehingga dapat membuat logo sesuai dengan kehendak. Pilhan style-nya tidak begitu banyak, namun masih cukup berharga mengingat hasil gambar dari online logo creator ini memiliki kualitas yang cukup baik.

5. www.logomatik.net

Design-design pada situs ini lebih menekankan pada koleksi design font yang menawan. Design yang dihasilkan dengan generator dapat dikostumisasi lebih, namun warna gambar hitam dan putih menurut saya adalah yang terbaik karena kesan vector-nya sangat kuat dan memukau.

6. www.thelogoshop.info

Cukup sederhana, atau bisa dibilang sangat sederhana, selain karena situs ini hanya memiliki satu halaman, design-nya pun sangat terbatas. Namun, bagi anda yang sedang belajar dan dalam proses awal blogging dan design gambar, situs ini bisa menjadi awalan bagi anda untuk belajar membuat design logo.

Setelah mendapatkan logo blog, pasang logo tersebut untuk menggantikan title dan description pada header blog. Simak Cara Mengubah/Memasang Gambar Background Header Blogger/Blogspot.

Selamat Mencoba Semoga bermanfaat.

Read More ->>

Tutorial

Sabtu, 28 Juli 2012

Cara Membuat Menu Dropdown Pada Blogger

Rabu, 25 Juli 2012

Cara Membuat "Read More" Otomatis Pada Blogger

Cara Membuat Scroll Bar Pada Blog Archive

Selasa, 24 Juli 2012

Cara Memasang Tanda Tangan Pada Blogger

Cara Membuat Gambar Tanda Tangan Secara Online

Cara Memasang Tanda Tangan di Bawah Posting Blog

Cara Membuat Menu Horizontal Pada Blogger

Cara memasang kamera CCTV pada blogger

Cara Mengubah Warna Scroll Pada Blogger

Cara Menghilangkan Tulisan Diberdayan Oleh Blogger

Cara Membuat Tulisan Berkedip Pada Blogger

Cara Memasang Widget Animasi Hamster

Cara Membuat Login Pada Blogger

Free Download Videopad Video Editor

Stunning Video Transitions and Effects

Amazing Audio Tools

Complete Video Optimization

Share With Family and Friends

Technical Information

Supported Input Formats

Supported Output Formats

Supported Devices

System Requirements

Gratis Download Software Webcame

1. Vitamin D Video

2. WebcamXP

3. My Webcam Broadcaster

4. Home Camera

Cara membuat Teks Berjalan (Marquee)

Cara Membuat Logo Menarik Pada Blogger

Popular Posts

Archive

Labels

Visitor