Pasang Kolom Follower di Blog

by kwangkxz

Hallo teman-teman blogger semua, kembali dalam postingan kali ini adalah mengenai Pentingnya memasang kolom follower di blog.

Sebenarnya Follower mirip dengan Mybloglog atau BlogCatalog, cuma yang ini bawaan dari Blogspot, jadi kita tidak perlu mendaftarkannya ke site manapun karena ini salah satu fasilitas dari Blogspot.

Karena Follower ini asli dari blogspot, cara memasangnya juga mudah sekali, Saya akan memberikan langkah-langkahnya sebagai berikut :

• Login ke Dashboard anda
• Pilih Layout
• Klik Add a Gadget
• Klik (+) pada Followers, kebetulan saat gambar ini diambil, sudah dalam keadaan “Already added” alias sudah dibuat.

• Selesai, maka hasilnya akan seperti ini :

Oke, cukup sekian informasi dari saya, semoga ini berguna.

Terimakasih

Selengkapnya...

Permasalahan seputar Paragraf Artikel

by kwangkxz

Hallo rekan-rekan blogger….

Pembahasan artikel Tips Blogging kali adalah mengenai pengaturan paragraf postingan. Artikel ini dibuat berdasarkan kesulitan mengatur postingan atau paragraf postingan.

Sebagai contoh, pada saat saya mengetik pada kolom artikel, pada tiap paragraf saya selalu memberikan jarak satu spasi dengan menekan tombol enter, tapi hasil publishnya tidak sesuai dengan pengaturan saya pada kolom compose sebelumnya.

Bagaimana solusinya ?

Untuk masalah ini, saya menyarankan jika setelah mengetik artikel di mode COMPOSE, sebelum di PUBLISH, sebaiknya pindah dulu ke mode Edit HTML. Nah pada sela-sela paragrap yang ingin di beri jarak kita sisipkan kode <br/>. Satu kode <br/> berarti satu line break ke bawah, jadi kalau jarak yang di inginkan jauh ke bawah kita tinggal tambahkan kode <br/> beberapa kali.

Contoh :

Berita buruk datang dari Microsoft kemarin, yang telah melakukan pemecatan atas 5,000 karyawannya. dalam sebuah emailnya untuk karyawannya, Steve Ballmer, CEO Microsoft telah membuka pintu yang lebar untuk mengadakan pemecatan lebih banyak.
<br/>
Langkah yang akan diambil adalah :
<br/>
Sebagai langkah selanjutnya, kami akan melanjutkan untuk menutup impact dari kondisi ekonomi yang memburuk, dan jika perlu, kami akan melakukan aksi pemotongan cost structural, termasuk mengeliminasi pekerjaan tambahan.” tulis ballmer dalam emailnya.

Maka yang akan muncul di blog kita akan seperti ini :

Berita buruk datang dari Microsoft kemarin, yang telah melakukan pemecatan atas 5,000 karyawannya. dalam sebuah emailnya untuk karyawannya, Steve Ballmer, CEO Microsoft telah membuka pintu yang lebar untuk mengadakan pemecatan lebih banyak.
Langkah yang akan diambil adalah :
Sebagai langkah selanjutnya, kami akan melanjutkan untuk menutup impact dari kondisi ekonomi yang memburuk, dan jika perlu, kami akan melakukan aksi pemotongan cost structural, termasuk mengeliminasi pekerjaan tambahan.” tulis ballmer dalam emailnya.

Atau bisa juga kita menggunakan tag <p> ... <p>, tapi saya lebih menyukai tag <br/> tadi.

Oke, sampai disini dulu pembahasan tentang pengaturan paragraf artikel. Bila anda ingin terbiasa dengan kode HTML, maka ketika posting artikel sebaiknya pada posisi Edit HTML jangan pada posisi Compose.

Semoga artikel ini bermanfaat bagi rekan-rekan blogger semua, dan bila anda menemui kesulitan, bisa menghubungi saya via kolom komentar.

Terimakasih.
Selengkapnya...

Membuat Efek Stabilo/Coretan pada Artikel

by kwangkxz

Halo rekan bloggers semua...

Pembahasan Trik Blogging dalam artikel/postingan kali ini adalah mengenai pembuatan efek stabilo atau mencoret kata dalam postingan. Maksudnya adalah efek stabilo pada tulisan dan membuat coretan pada kata yang kita tulis di posting.

Informasi ini sangat sederhana,tapi kadang kita juga memerlukannya.

Contoh nya seperti ini :

Sebenarnya di blogspot tidak tersedia short key untuk melakukan kedua hal diatas.

Lalu harus bagaimana ?

Langkah yang harus kita lakukan adalah dengan cara manual.

Cara membuat efek stabilo dan coretan pada tulisan adalah seperti ini :

• Efek Stabilo

<span style="background-"> Masukkan tulisan anda di sini </span>

Keterangan : Kode warna bisa anda ganti sesuai dengan keinginan anda

• Efek Coretan

<s> masukkan tulisan anda di sini </s>

Engga susah khan ?

Oke, sampai disini pembahasan mengenai Pembuatan efek stabilo dan coretan pada tulisan di artikel, semoga informasi ini bermanfaat.

Selamat mencoba...

Selengkapnya...

Membuat Link CSS

by kwangkxz

Hallo rekan-rekan blogger …..


Menindaklanjuti artikel saya sebelumnya mengenai “Cara Membuat Link dan Button (Menu Navigasi)”, sekarang saya akan berikan informasi yg lebih baik yaitu dengan Link CSS.

Pertama-tama kita harus mendeklarasikan terlebih dahulu CSS-nya. Link yang akan dibuat nanti diberikan Class. Contohnya seperti ini :

<a href=”http://www.kwangkxz.co.cc” class=tombol1>Home</a>

Kode class=tombol1 merupakan script CSS yang mendefinisikan tampilan button pada Home, didalamnya terdapat warna misalnya merah, kemudian tulisannya 14 pt, dan berbagai pengaturan lainnya.

Setiap link bisa kita definisikan yg berbeda-beda.

Sebagai contoh, penulis mendefinisikan untuk link home sbb :

• Background warna biru
• Warna Teks putih, dan
• Padding sebesar 3px.

Oleh karena itu script CSS yang harus dibuat seperti ini :

a.tombol1 {
background: #333399;
padding: 3px;
color: #ffffff;
}

Untuk lebih jelasnya, silahkan ikuti langkah-langkah berikut :

1. Masuk ke Dashboard
2. Klik link Layout, sesudah itu pilih Edit HTML
3. Carilah script ini : ]]></b:skin>
4. Lalu ketikkanlah script berikut ini diatasnya.

a.tombol1 {

background: #333399;
padding: 3px;
color: #ffffff;
}

a.tombol2 {
background: #ff0000;
padding: 3px;
color: #ffffff;
}

a.tombol3 {
background: #339966;
padding: 3px;
color: #ffffff;
}

a.tombol4 {
background: #ff6600;
padding: 3px;
color: #ffffff;
}

a.tombol5 {
background: #cc99ff;
padding: 3px;
color: #ffffff;
}

5. Lalu klik SAVE TEMPLATE

6. Sesudah itu klik pada Page Elements

7. Sesudah halaman Page Elements ditampilkan, klik pada link Edit
yang terdapat pada HTML/JavaScript (tombol atau link yang
pernah dibuat sebelumnya). Klik tombol Add Gadget jika belum
ada.

8. Lalu akan tampil kotak dialog Configure HTML/JavaScript,
lakukan modifikasi pada link dengan menambahkan script
class=”tombol1” untuk link yang pertama (Home).
Sesuaikan dengan link yang anda buat.

<a href=”http://www.kwangkxz.co.cc>”class=”tombol1”>Home</a>

<a href=”http://www.blogger.com/profile/0123456789”class=”tombol2”>About</a>

<a href=”http://www.kwangkxz.co.cc/search/label/tutorial”class=”tombol3”>Tutorial&

lt;/a>

<a href=”http://www.kwangkxz.co.cc/search/label/testimonial”class=”tombol4”>Testimonial</a>

<a href=”http://www.kwangkxz.co.cc/search/label/contact”class=”tombol5”>Contact</a>

9. Jika sudah, klik Save

10. Akses Blogspot anda untuk melihat hasilnya.

Sampai disini dulu pembahasan mengenai “Membuat Link CSS” semoga bermanfaat bagi rekan-rekan blogger semua.

Artikel ini mungkin belum sempurna, dan bila ada yg mau ditanyakan, bisa mengisi kolom komentar atau via email, dan saya akan berusaha untuk membantu anda.

Terimakasih.

Selengkapnya...

Cara Membuat Link dan Button (Menu Navigasi)

by Kwangkxz

Pembahasan Trik Blogging kita kali ini adalah bagaimana caranya membuat Menu Navigasi yang berisikan link. Mungkin diantara para blogger sudah sering melihat artikel mengenai ini, dan caranya pun pasti sudah expert. Nah trik yang akan saya terangkan disini sangat simple dan mudah. Oleh sebab itu artikel ini di khususkan untuk para blogger pemula yang belum pernah membuat Menu Navigasi.

Oke, sebelumnya saya ingin memberikan informasi bagi anda yang menggunakan layanan Blogger/Blogspot, yang sudah saya alami, Blogspot memiliki kekurangan dalam hal page, tidak seperti Wordpress yang memberikan fasilitas page pada blognya.

Tapi anda jangan khawatir, dengan menggunakan bantuan CSS dan penggunaan image, kita bisa menciptakan sendiri button untuk navigasi page-nya. Kita bisa membuat link yang berisi Home, About ME, Contact, dan link-link lainnya sesuai dengan kebutuhan anda. Page yang akan kita buat, bisa berupa link biasa, rollover link, dan link image.

1. Membuat Link Teks

Untuk menempatkan link-link tersebut, kita harus menyimpannya di Page Element HTML/JavaScript. Baiklah untuk cara yang pertama ini, kita akan membuat link berupa teks biasa (tanpa variasi)

Berikut langkah-langkahnya :

• Masuk ke halaman Dashboard anda
• Lalu klik pada link Layout, terus pilih Page Element
• Setelah Halaman Page Element ditampilkan, lalu klik/pilih Add a Gadget (lihat gambar dibawah)

• Lalu akan muncul tampilan kotak dialog Add a Gadget. Anda pilih atau klik HTML/JavaScript (klik di tanda (+)) seperti gambar dibawah ini.

• Akan tampil halaman Configure HTML/JavaScript, lalu yang perlu anda lakukan adalah menyiapkan link apa saja yang akan ditampilkan. Kebetulan penulis hanya menampilkan 5 link saja. Contohnya seperti dibawah ini :

<a href=”http://www.kwangkxz.co.cc”>Home</a>

<a href=”http://www.blogger.com/profile/0123456789”>About</a>

<a href=”http://www.kwangkxz.co.cc/search/label/tutorial”>Tutorial</a>

<a href=”http://www.kwangkxz.co.cc/search/label/testimonial”>Testimonial</a>

<a href=”http://www.kwangkxz.co.cc/search/label/contact”>Contact</a>

Lalu anda sesuaikan link diatas dengan URL dan kategori yang anda miliki, yg saya tuliskan diatas hanya sebagai contoh saja.

Keterangan : Link-link diatas bisa disesuaikan dengan alamat blog anda. Sesuaikan alamat link dengan postingan yang dibuat.

• Selanjutnya lalu klik Save
• Anda atur posisi gadget tersebut agar posisinya berada dibawah Header.

• Lalu selanjutnya klik Save
• Akses Blogspot anda untuk melihat hasilnya.

Mudah bukan ?

Sebenarnya, masih banyak trik blogging mengenai cara pembuatan link dan button ini, anda bisa melihat dalam artikel saya yg lain yaitu :

• Membuat Link CSS
• Membuat Button dan cara Menambahkannya ke Blogspot
  

Sekian pembahasan dari saya, dan bila anda menemui kesulitan, bisa mengisi kolom komentar, dan saya akan berusaha membantu anda.

Semoga artikel ini bermanfaat.

Terimakasih.

Selengkapnya...

Horizontal tab menu 10

by kwangkxz

Have seen navigation menu like this?
Please drop your mouse at the navigation below:

• Home
• Products
• Obral Plus
• Belajar Website

Interest to install this navigation menu in your blog? please read steps till finish.

I need to affirm that scripts which I give is possibility cannot in applying perfectly in your blog, because factor of the template which different each other, for that possibly you require to a little a few script which I give.
This is his steps :
Right click at both this picture, then clicked save picture As... then keep in your computer.

tableftJ.gif
tabrightJ.gif

Then upload both the picture to server ordinary place of you saving the pictures you have. example : I'm ordinary saving my pictures in google pages, and the picture have the address be like this :
http://ahom24.googlepages.com/tableft10.gif
http://ahom24.googlepages.com/tabright10.gif


Be in fact, you can use both the picture address, but I worry if too much the user using this address, the server cannot handling it so that the navigation menu becoming not function better.
Many ways to install this code, one of the way is be like this :
Step #1 :

1. Login to blogger with your ID
2. After entering the dasboard page , click Layout. Please saw the picture :
   
3. Then click edit HTML tab. Please saw the picture :
   
4. I suggest to you, beforehand to back up your template. Click the Download full template link. Please saw the picture :
   
5. After you click Download full template link, then will emerge new window just to download. Click the Save button. Saw the picture :
   
6. You could choose this data would in kept where and with what file name what, Afterwards ended with click of the Save button. Please saw the picture :
   
7. Copy and paste code above of ]]></b:skin>

   /*- Menu Tabs 10--------------------------- */ /*credits : http://www.exploding-boy.com */ #tabs10 { float:left; width:95%; font-size:13px; border-bottom:1px solid #2763A5; line-height:normal; } #tabs10 ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabs10 li { display:inline; margin:0; padding:0; } #tabs10 a { float:left; background:url("http://ahom24.googlepages.com/tableft10.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabs10 a span { float:left; display:block; background:url("http://ahom24.googlepages.com/tabright10.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabs10 a span {float:none;} /* End IE5-Mac hack */ #tabs9 a:hover span { color:#FFF; } #tabs10 a:hover { background-position:0% -42px; } #tabs10 a:hover span { background-position:100% -42px; } #tabs10 #current a { background-position:0% -42px; } #tabs10 #current a span { background-position:100% -42px; }

8. Go to underside, the code searching looking like be like :

   <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='your blog title (Header)' type='Header'/>
</b:section>

9. Change the code printing with green colour, so that his code become be like this :

   <b:section class='header' id='header' maxwidgets='3' showaddelement='yes'>
<b:widget id='Header1' locked='false' title='your blog title (Header)' type='Header'/>
</b:section>

10. Click . Await a few moments do shall your template have in saving.

Step #2

1. Click at Page Element tab. See the picture below :
   
2. Click at Add a Page element which located above of the header element. See the picture following :
   
3. After emerging pop up window , Klik add to blog button for the things HTML/JavaScript. See the picture following :
   
4. Copy and paste the code below into available column ( don't forget to change the links with link property of your own) :

   <div id="tabs10"> <!-- tabs10 begin --> <ul> <!-- Change the links with your own links --> <li id="current"><a href="#"><span>Home</span></a></li> <li><a href="#"><span>Products</span></a></li> <li><a href="#"><span>Services</span></a></li> <li><a href="Support.html"><span>Support</span></a></li> <li><a href="#"><span>Order</span></a></li> <li><a href="http://www.obralplus.com/?id=rohman"><span>Obral Plus</span></a></li> <li><a href="http://www.resepbisnis.com/?id=rohman"><span>Belajar Website</span></a> </ul> </div ><!-- tabs10 end -->

5. Click
6. Finish. Please see the result.

Besides the above ways, it is of course still many ways is again you can do, please try by your self.
Don't ever stop to doing an experiment !
Selengkapnya...

Cara memasang ShoutBox Di Blogspot

by kwangkxz

Trik Blogging kali ini adalah mengenai Cara Pasang ShoutBox di Blogger, mudah2an ini berguna bagi para blogger baru yang pengen punya kotak shoutbox.

Apa itu kotak Shoutbox? Dan Apa Kegunaannya?

Saya jelaskan disini ya ?
Shoutbox adalah semacam kotak pesan bagi pengunjung Blog kita yg ingin meninggalkan pesannya, sekedar say hallo, menyapa, dll...

Biasanya ada tiga form yang harus diisi pengunjung Blog kita sebelum meninggalkan pesannya di shoutbox yaitu :

- form untuk nama,

- web URL dan

- Isi Pesan

Terus bagaimana caranya mendapatkan shoutbox dan bagaimana cara pasangnya di blogger kita ?

Selain kotak untuk meninggalkan pesan bagi blogger yang mengunjungi blog kita. Kegunaan shoutbox juga untuk melihat reaksi blogger lain terhadap blog kita, kalo pengunjungnya baru satu kali mampir ke blog kita biasanya sekedar ucapkan "Hai, salam kenal ya" Tapi kata-kata ini pasti begitu berarti bagi yg pertama punya shoutbox nantinya.

Apa Manfaatnya ?

Kita bisa tahu siapa pengunjung blog kita (itu jika mereka meninggalkan jejak dengan menuliskan web URLnya) kebanyakan pengunjung yang mempunyai web/blog sendiri menuliskan URL mereka di shoutbox. Setelah pesan masuk shoutbox web URL itu hiding (tersembunyi pada nama si penulis pesan). Dan kita bisa balik berkunjung pada Blog yg telah mengunjungi kita.

Pengaruhnya ?

Banyak sekali! Pengaruh psikologisnya saja terhadap diri kita untuk terus berkreasi di dunia blog terasa banget, jika ada yg mengisi shoutbox dan meninggalkan pesan positif rasanya asyik sekali lho !

Jangankan pesan positif sekedar ucapan "Hai, salam kenal saja" itu sudah cukup meningkatkan semangat kita dalam nge-blog (khususnya blogger baru tak terkecuali blogger lama loh).

Ok langsung saja kita akan bikin kotak shoutbox dengan menggunakan fasilitas gratisan yang disediakan oleh oggix.com. Sebenarnya banyak penyedia shoutbox dan mereka memberikannya secara cuma-cuma tapi di tutorial ini kita pilih oggix.com.

Mengapa ?

Karena di oggix emang lebih mudah bikin shoutbox. Sebelumnya kita masuk dulu oggix,

klik disini untuk masuk dan daftar jadi member dulu, Klik register, dan kemudian form-nya sbb :

• Email/username : (isi alamat email Anda. Alamat email ini akan menjadi username buat login di oggix nantinya)
• Password : (isi Kode Rahasia anda)
• Confirm Password : (ulangi sekali lagi kode rahasia tadi)
• Name : (isi dengan nama kamu)
• Website Title : (isi dengan judul atau tema Blog Anda)
• Website Url : (isi dengan alamat blog Anda yang akan dipakai shoutbox nantinya)
• Website Description : (Isi penjelasan singkat mengenai Blog Anda, Jangan terlalu Panjang!)
• Country : (pilih negara Misal : Indonesia)
• Security Code : (lihat nomor untuk registrasi ? -biasanya tiga digit- ketik ulang di kotak bawahnya)

Setelah semua diisi klik Register dibawahnya.

Ok, anda tinggal login, Isi username/alamat email dan passwordnya kemudian klik login. Lalu anda bikin konfigurasi shoutbox-nya sekarang.
Setelah masuk ke oggix, kita akan dapat tools disebelah kiri sebagai menu; ada Home, Avatar, Install Shoutbox dan sebagainya.
Karena kita akan bikin Shoutbox maka kita pilih (klik) Install Shoutbox lalu klik HTML Code.

Yang kita perlukan ada lima langkah untuk mendapatkan shoutbox.

1. Set shoutbox configuration (Set konfigurasi)
2. Choose shoutbox type (Pemilihan type Shoutbox)
3. Choose shoutbox color (Pemilihan warna)
4. Choose shoutbox template (Pilih tampilan)
5. Copy and paste HTML codes to your HTML page where you want to put the shoutbox (Dan terakhir copy-paste ke blogger baru)

1. Set shoutbox configuration (Set konfigurasi)

didalamnya terdapat :

• Enable Smilies, jika anda ingin memakai icon smile jika tidak klik No.
• Enable Avatar, ini mirip dengan Enable Smilies.
• Shoutbox Time, pilih standar waktu dimana kamu tinggal. Jika kamu tinggal di bagian barat wilayah Indonesia pilih "GMT+7 Bangkok, Jakarta"
• TimeStamp, ini adalah pengaturan style tampilan tanggal dan jam
• Flood Control, banyaknya pesan yang ditampilkan di shoutbox dan sisanya di hide.

Setelah itu anda klik next...

2. Choose shoutbox type (Pilih type yang kita suka)

Kalo udah menemukan yg cocok, klik aja Choose This.

3. Choose shoutbox type (Pilih type yang kita suka)

Memilih warna kadang gak mudah, maka kita pilih Warna yang kita inginkan ada nggak disitu ? Saran saya pilih saja warna yang sesuai dengan warna Blog kamu, atau justru pilih warna yang justru ga sesuai dengan warna Blog kamu... Supaya kontras ! ini dimaksudkan agar mudah dapat perhatian... Itu semua terserah anda. Kemudian Choose This>> Kalo sudah menemukan warna yang cocok.

4. Choose shoutbox template (Memilih tampilan)

Ini berhubungan dengan style/Gaya dan kepribadian kita! Blogger bilang tampilan shoutbox menggambarkan kepribadian blogger tersebut, benar tidaknya, yang jelas jangan salam pilih tampilan. Ok langsung saja Klik Choose This, kalo sudah menemukan tampilan yg cocok buat shoutbox kamu.

5. Copy and paste the HTML codes to your HTML page where you want to put the shoutbox

Sekarang tinggal masukkan kode tersebut ke blogger kamu, Setelah login ke blogger dengan account google kita klik Layout-Template-Page Element. Lalu klik Add a Page Element di bagian (sidebar) kanan atau di kiri, tunggu sebentar lalu pilih HTML/JavaScript - ADD TO BLOG. Pada Title kita tuliskan "Tinggalkan Pesan Disini" atau apa saja yang lebih kamu sukai, misalkan "Jejak Blogger" atau yg lebih formal "Silahkan Tinggalkan Pesan Anda" atau apa saja.

Pada Content, kamu paste kode yang dari oggix tadi.
Ingat: Kodenya jangan diubah-ubah kecuali kamu tahu bagian mana saja yang bisa diubah dan bagian mana yg tidak boleh diubah.
Klik Save Changes dan selesai sudah.

Bagaimana ? gak sulit khan caranya ?

Oke sampai disini dulu pembahasan mengenai Cara Pasang ShoutBox Di Blogger. Bila ada kesulitan, bisa menghubungi saya via ShoutBox atau Isi komentar anda di Kolom Komentar.

Sebenarnya ada 1 cara lagi selain ShoutBox yaitu ShoutMix, dan apabila anda ingin mengetahuinya bisa klik disini.

Semoga Informasi ini berguna buat para blogger sekalian.

Terimakasih.

Selengkapnya...