Belajar Ngeblog

Membuat klik disini

noreply@blogger.com (mohamad imron) — Thu, 06 Oct 2011 00:44:00 +0000

Cara membuat klik disini tidaklah terlalu sulit, anda hanya membutuhka kode dibawah ini, serta alamat URL yang dituju.
Ganti tulisan yang berwarna merah dengan alamat Link yang dituju

<a href = "url alamat link ">klik disini</a>

Selamat mencoba……….!

Istilah Dalam Blog

noreply@blogger.com (mohamad imron) — Mon, 26 Sep 2011 03:16:00 +0000

Dasar-Dasar
Buat kamu yang masih baru dan belum tahu banyak tentang dunia blog, ini ada beberapa istilah-istilah yang perlu kamu kenal dan ketahui. Disini sengaja tidak disusun menurut abjad tapi disusun berdasarkan kategori masing-masing.

* Blog
Blog : istilah yang pertama kali digunakan oleh Jorn Barger untuk menyebut kelompok website pribadi yang selalu diupdate secara kontinyu dan berisi link-link ke website lain yang mereka anggap menarik disertai dengan komentar-komentar.
Weblog : istilah lain dari blog.
Blogging : kegiatan-kegiatan yang dilakukan dalam dunia blog.
Blogger : seseorang yang melakukan blogging.
arti lainnya: sebuah layanan blog dari google.
Blogosphere : komunitas dalam blogging.
Posting : kegiatan untuk mengirimkan artikel ke dalam blog.

* Bentuk-Bentuk Blogging
Photoblogging : sebuah blog yang difokuskan pada dunia Photografi dan gambar-gambar.
Podcasting : metode untuk mendistribusikan file multimedia (video/audio) secara online melalui feeds
Autocasting : bentuk podcasting secara otomatis.
Blogcasting : penggabungan blog dan postcas dalam sebuah wensite.
Vlog / Vlogging : jenis blogging yang lebih senang menggunakan video daripada text.
Audioblog / Audioblogging : jenis blogging yang lebih senang menggunakan audio/musik daripada text.
Moblogs / Moblogging kegiatan blogging dengan menggunakan HP (handphone).

* Komponen dan Fungsi-Fungsi Blog
Index page : halaman depan dari blog.
Header : bagian paling atas blog.
Footer :bagian paling bawah blog.
Sidebar : kolom-kolom yang berada di sisi blog.
Link : proses untuk menghubungkan ke suatu postingan/kontent atau ke web/blog yang lain.
Archive : sekumpulan/arsip dari semua postingan. Bisa dikelompokkan dalam bulan, tahun dsb.
Categories : sekumpulan/sekelompok spesifik dari beberapa artikel.
Commnets : Kompentar-komentar dari para pembaca blog.
Captcha : kependekan dari "Completely Automated Public Turing test to tell Computers and Humans Apart", yaitu sebuah gambar yang berisi kata atau huruf yang harus diketikkan untuk verifikasi. Berguna untuk menangkal spam.
Ping (Packet Internet Grouper) : berfungsi untuk memberitahu layanan-layanan yang berhubungan dengan blog (seperti tchnocarty dkk) bahwa kita baru menambah atau mengupdate konten blog kita.
Trackback : berfungsi untuk memberitahu bahwa kita me-link ke postingan atau kontent blog orang lain.
Blogroll : sekumpulan link yang dijukan ke blog yang lain.
Template : desain dasar blog.
Plugin : sebuah file yang berfungsi untuk menambah feature2 blog.
Dashboard : sebuah tampilan yang berisi kontrol-kontrol, tool, setting dll saat pertama kali kita login ke blog account.

*Penyedia Layanan Blog
Blogger/Blogspot : Layanan blog gratis dari google.
Wordpress : Salah satu layanan blog gratis yang lain, memiliki feature yang lebih lengkap daripada blogger.com tapi kita tidak bisa mengotak-atik script HTML, kalo mau mengedit harus bayar dulu, jadi buat yang gratisan nggak bisa ngedit.
LiveJournal : Tolls blogging gratis dari SixApart
TypePad : Tolls blogging tidak gratis (bayar) dari SixApart.

* Bloging Habits
Metablogging : menulis artikel tentang blogging.
Blogstipation : blogger yang sedang malas ngeblog, karena sedang bad mood atau nggak pingin ngeblog.
Blogopotamus : Postingan blog yang sangat panjang.
Bleg : adalah ketika seseorang memohon pada sebuah blog.
Blego : Blog+Ego, ukuran kekayaan blogger.
Blog Hopping : Berpindah-pindah dari satu blog ke blog yang lain.
Blogroach : Komentator yang tidak setuju dengan postingan atau kontent suatu blog, biasanya diungkapkan dengan kata-kata yang kasar.
Blogoholic : Pecandu Blog.
Blogorific / Blogtastic Suatu hal yang dahsyat dari perkataan blogger.
Blogsit : Pemeliharaan blog ketika sang pemilik utama blog sedang bepergian atau sedang liburan.
Blogvertising/Blogvert : Iklan-iklan yang ada di blog.
Blurker : Pembaca blog yang hanya melihat-lihat saja, tidak memberikan komentar atau apapun.
Blogathon : mengaupdate blog setiap 30 menit dan selama 24 jam non-stop.
Blogiversary : Ulang tahun Blog.
Blog Carnival : Link ke artikel yang lain yang disamarkan dengan topik yang spesifik.
Multiblog : menjalankan banyak blog.
Blog Tipping : pujian atau ucapan selamat setiap tanggal 1 setiap bulannya.
Blogger Bash : Pesta para blogger.
Reciprocal Links / Link Exchange : atau Link Love, saling me-link antara blog yang satu dengan blog yang lain.
Linkbaiting : menulis artikel yang bagus supaya dilink oleh blog yang lain.
Hitnotice : me-refresh browser berulang-ulang untuk melihat hit-counter atau melihat apakah ada komentar yang baru atau tidak.
Blogstorm / Blogswarm : Kegiatan komunitas blogger yang sangat besar.
Blogsnop : menolak respon dari komentator yang bukan temannya.
Doppelblogger : blogger yang menjiplak konten dari blog orang lain.
Blogophobia takut terhadap blog atau blogging.
Blogeerel : opini yang sama yang dikirim berulang-ulang pada sebuah blog.

Aduh capek nih, ngaso dulu ah, minum kopi dulu bos biar seger. huuaaaahhhhh...
hup..hap..hup..hap..huaaaahhhhhhhhhh
yak, udah seger lagi, mari kita lanjutkan.

* Tipe-Tipe Blogger
Problogger : Blogger yang sudah profesional.
Blogebrity : Blogger yang sangat terkenal, kayak selebriti gitu.
Blogerati : Komunitas Blogger yang sudah pinter-pinter.
Blognoscenti : Blogger yang memiliki kemampuan yang spesial.
Commnetariat : Komunitas para komentator (lho emangnya ada? :D ).
Dooced : kehilangan pekerjaan gara-gara blognya.
Blogther : teman/saudara/keluarga blogger.
Blogstar : Blogger yang mengoperasikan blog yang sangat populer.

* Web/Blog Feeds
Web Feed : format data yang disediakan untuk user agar bisa berlangganan pada postingan sebuah blog.
RSS : adalah sebuah file berformat XML untuk sindikas. RSS mengijinkan kita untuk berlangganan kepada web/blog yang menyediakan umpan (feed) RSS. RSS kependekan dari Really Simple Syndication (RSS 2.0), Rich Site Summary (RSS 0.91, RSS 1.0), RDF Site Summary (RSS 0.9 and 1.0).
XML : (eXtensible Markup Language).
RDF : (Resource Description Framework)
Atom : hampir sama dengan web feed.
Photofeed : web feed dengan lampiran gambar.

Pelajari dulu ya............

Membuat menu dibawah Header/Judul Blog /Menu Horisontal

noreply@blogger.com (mohamad imron) — Mon, 26 Sep 2011 03:15:00 +0000

Bagi rekan blogger yang menggunakan template yang belum difasilitasi dengan menu horisontal dibawah header pada blognya, berikut saya bagikan tips tentang cara membuat menu tersebut. Fungsi dan kegunaan menu ini adalah agar memudahkan kita dalam menelusuri semua isi yang terkandung didalam blog tersebut dan memberikan layanan kemudahan shortcut link bagi pengunjung blog kamu. (baca: easy to navigate) Pertama yang harus dilakukan adalah login ke blogger > Layout/Tata Letak > Edit Html .
Selanjutnya Anda cari kode dibawah ini, untuk mempermudah pencarian silahkan gunakan CTRL+F / F3

<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol' showaddelement='no'>
<b:widget id='HTML1' locked='false' title='' type='HTML'/>
</b:section>
</div>

Anda ubah kode showaddelement='no' menjadi showaddelement='yes' , kalau sudah klik simpan ya

Setelah yang pertama sudah disimpan, sekarang klik Page elements / Elemen Laman > Tambah Gadget > HTML/Javascript , copy kode dibawah ini,simpan dan letakan tepat dibawah header.

<a href='http://nama blog anda.blogspot.com/'>Beranda</a>
<a href='http://imron2710.blogspot.com/'>Arsip Blog</a>
<a href='http://imron2710.blogspot.com/'>Download</a>
<a href='http://www.imron2710.blogspot.com/'>News </a>
<a href='http:// www.imron2710.blogspot.com/'>Lain-lain </a>

*Alamat url diatas silahkan sesuaikan dengan blog Anda.

Hal ketiga adalah supaya menu itu menimbulkan efek warna sehingga menjadi kelihatan menarik.

Klik Tata Letak > Edit HTML , cari kode , agar mudah gunakan tombol CTRL+F
Copy kode dibawah ini dan letakan tepat diatas kode kemudian simpan.

a.navigation {
background: #3333ff ;
color: #ffffff;
margin: 1px;
padding: 2px;
border-width: 0;
text-transform: uppercase;
text-decoration: none;
font-weight: bold;
}
a.navigation:hover {
background: #333333;
color: #ffffff;
text-decoration: none;
}

Perhatikan kode yang berwarna biru adalah warna tombol dan efek hover dan bisa dirubah sesuka hati Anda.Dan yang berwarna merah adalah jarak antara tombol satu dengan lainnya, silahkan Anda sesuaikan sesuai selera.

Selesai, semoga bermanfaat....salam

Cara Membuat Menu Navigasi Horisontal

noreply@blogger.com (mohamad imron) — Mon, 26 Sep 2011 03:14:00 +0000

Mempostingkan Tentang Cara Membuat Menu Horizontal Biasa untuk Blog/Blogger. Sebelum ke topik utama kita saya akan menjelaskan tentang menu horisontal.Menu horizontal merupakan kumpulan beberapa link yang diletakkan secara horizontal/mendatar dan biasanya ditempatkan di bawah header. dan Fungsi dari Tutorial Blog Kali ini adalah sebagai salah satu navigasi dalam blog agar memberikan layanan kemudahan shortcut link bagi pengunjung blog kamu.
Tidak Usah panjang Lebar lagi,berikut langkah Cara Membuat Menu Horizontal Biasa dalam blog anda :
Adapun langkah-langkah membuat menu navigasi blog adalah sebagai berikut:
1. Silahkan login ke blogger dengan ID anda
2. Masuk pada Dasbor
3. Klik Rancangan
4. Kemudian Klik Edit HTML
5. Kemudian sebelum melakukan langkah selanjutnya lebih baik klik Download Template Lengkap (Antisipasi jika ada kesalahan atau ingin kembali pada blog semula)
6. Setelah di downloud template lengkap maka ceklis Expand Template Widget
7. Cari Kode kode ]]></b:skin>
8. Copy paste kode berikut persis di atas kode ]]></b:skin>

/* navbar
================== */

#bg_nav {
background: #ffffff;
width: 850px;
height: 29px;
font-size: 11px;
font-family: Arial, Tahoma, Verdana;
color: #000000;
font-weight: bold;
margin: 0px auto 0px;
padding: 0px;
border-top: 1px solid #000000;
border-bottom: 1px solid #ffffff;
overflow: hidden;
}
#bg_nav a, #bg_nav a:visited {
color: #000000;
font-size: 11px;
text-decoration: none;
text-transform: uppercase;
padding: 0px 0px 0px 3px;
}

#bg_nav a:hover {
color: #000000;
text-decoration: underline;
padding: 0px 0px 0px 3px;
}

#navleft {
width: 500px;
float: left;
margin: 0px;
padding: 0px;
}
#navright {
width: 220px;
font-size: 11px;
float: right;
margin: 0px;
padding: 3px 5px 0px 0px;
}
#navright a img {
border: none;
margin: 0px;
padding: 3px 5px 0px 0px;
}

#nav {
margin: 0px;
padding: 0px;
list-style: none;
}
#nav ul {
margin: 0px;
padding: 0px;
list-style: none;
}

#nav a, #nav a:visited {
background: #ffffff;
color: #000000;
display: block;
font-weight: bold;
margin: 0px;
padding: 8px 15px 8px 15px;
border-left: 1px solid #ffffff;
}
#nav a:hover {
background: #c06000;
color: #000000;
margin: 0px;
padding: 8px 15px 8px 15px;
text-decoration: none;
}

#nav li {
float: left;
margin: 0px;
padding: 0px;
}
#nav li li {
float: left;
margin: 0px;
padding: 0px;
width: 150px;
}
#nav li li a, #nav li li a:link, #nav li li a:visited {
background: #ffffff;
width: 160px;
float: none;
margin: 0px;
padding: 7px 30px 7px 10px;
border-bottom: 1px solid #ffffff;
border-left: 1px solid #ffffff;
border-right: 1px solid #ffffff;
}
#nav li li a:hover, #nav li li a:active {
background: #c06000;
padding: 7px 30px 7px 10px;
}

#nav li ul {
position: absolute;
width: 10em;
left: -999em;
}

#nav li:hover ul {
left: auto;
display: block;
}
#nav li:hover ul, #nav li.sfhover ul {
left: auto;
}

Ganti tulisan yang berwarna merah sesuai dengan selera anda

Lalu cari Kode yang mirip kode seperti berikut ini

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

Saya sarankan Fokuskan pada kode <div id='header-wrapper'>

Jika sudah ketemu Copas code berikut persis di bawah kode yang barusan anda cari tepatnya di bawah kode </div>

<div id='bg_nav'>
<div id='navleft'>
<div id='nav'>
<ul>

<li><a href='http://nama blog anda.blogspot.com/'>Beranda</a></li>
<li><a href='http:// ://imron2710.blogspot.com/'>Arsip Blog</a></li>
<li><a href='http:// ://imron2710.blogspot.com/'>Download</a></li>
<li><a href='http:// ://www.imron2710.blogspot.com/'>News </a></li>
<li><a href='http:// ://www.imron2710.blogspot.com/'>Lain-lain </a></li>

</ul>
</div>
</div>
<div id='navright'>
</div>
</div>

Ganti tulisan yang berwarna Biru dengan nama Blog anda dan link/Url yang dituju
Kemudian Klik tombol SIMPAN TEMPLATE.
Selesai.
Jika merasa susah atau mungkin ribet dalam menggunakan trik diatas, maka jangan takut masih ada alternatif lain, yaitu cara membuat menu Horizontal secara instan dan ga perlu menunggu terlalu lama. Tidak hanya bisa membuat menu Horisontal, disinipun kita bisa membuat menu Vertikal beserta sub menunya, dan kerennya lagi bisa milih2 gaya/style suka2 kita. Biar gak kelamaan, langsung aja kunjungi web: Accessify.com

Membuat Menu Vertikal

noreply@blogger.com (mohamad imron) — Mon, 26 Sep 2011 03:13:00 +0000

Sebelumnya saya menulis mengenai menu Horizontal dan berikut ini saya mencoba menulis artikel menu vertikal. Pembuatan menu vertikal ini sangat mudah, hanya sedikit menambahkan kode css pada bagian template dan kode html pada sidebar.
Terus bagaimana cara membuatnya………, berikut ini saya berikan tips untuk membuat menu vertikal.
Adapun langkah-langkahnya adalah sebagai berikut :
1. Masuk ke bagian Edit HTML
2. Tambahkan kode css berikut ini sebelum kode ]]></b:skin>

.clearit {
margin: 0;
padding: 0;
height: 0;
clear: both;
}

/* BUBBLE PLASTIC VERTICAL MENU */
.bubplastic.vertical {
width: 150px;
margin: 0px;
padding: 0px;
display: block;
}
.bubplastic.vertical ul {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
.bubplastic.vertical ul li {
display: block;
float: left;
width: 100%;
margin: 0;
padding: 0;
background: transparent url(http://lh6.ggpht.com/_7Y9pl24WpQY/TCTaMf6oL6I/AAAAAAAAEOU/WMlVDrN8s8M/bg-bubplastic-button_thumb%5B5%5D.gif) top left no-repeat;
}
.bubplastic.vertical ul li a {
display: block;
margin: 0;
width: 100%;
padding-left: 15px;
text-transform: uppercase;
font-family: "Helvetica Neue",helvetica,"microsoft sans serif",arial,sans-serif;
font-size: 70%;
color: #FFFFFF;
text-decoration: none;
background: transparent url(http://lh6.ggpht.com/_7Y9pl24WpQY/TCTaMf6oL6I/AAAAAAAAEOU/WMlVDrN8s8M/bg-bubplastic-button_thumb%5B5%5D.gif) top left no-repeat;
}
.bubplastic.vertical ul li a span.menu_ar {
display: block;
margin: 0;
width: 100%;
height: 22px;
padding-top: 5px;
padding-right: 15px;
background: transparent url(http://lh6.ggpht.com/_7Y9pl24WpQY/TCTaMf6oL6I/AAAAAAAAEOU/WMlVDrN8s8M/bg-bubplastic-button_thumb%5B5%5D.gif) top right no-repeat;
cursor: pointer;
}
/* BLUE HOVER */
.bubplastic.blue ul li a:hover,
.bubplastic.blue ul li.highlight a {
background: transparent url(http://lh4.ggpht.com/_7Y9pl24WpQY/TCTaTTyG38I/AAAAAAAAEOk/s7mSQh3v_oo/bg-bubplastic-h-blue_thumb%5B3%5D.gif) top left no-repeat;
}
.bubplastic.blue ul li a:hover span.menu_ar,
.bubplastic.blue ul li.highlight a span.menu_ar {
background: transparent url(http://lh4.ggpht.com/_7Y9pl24WpQY/TCTaTTyG38I/AAAAAAAAEOk/s7mSQh3v_oo/bg-bubplastic-h-blue_thumb%5B3%5D.gif) top right no-repeat;
}

3. Simpan Template.
4. Masuk Ke Elemen Halaman.
5. Klik Tambah Gadget pada bagian sidebar.
6. Pilih yang HTML/Javascript, kemudian masukkan kode berikut kedalamnya :

<div class="menu bubplastic vertical blue">
<ul>
<li><span class="menu_r"><a href="http://blog anda.blogspot.com/" target="_self"><span class="menu_ar">,About</span></a></span></li>
<li><span class="menu_r"><a href="http:// blog anda.blogspot.com/" target="_self"><span class="menu_ar"> Contact Us</span></a></span></li>
<li><span class="menu_r"><a href="http:// blog anda.blogspot.com/" target="_self"><span class="menu_ar"> Advertiser</span></a></span></li>
<li><span class="menu_r"><a href="http:// blog anda.blogspot.com/" target="_self"><span class="menu_ar"> Banner</span></a></span></li>
<li><span class="menu_r"><a href="http:// blog anda.blogspot.com/" target="_self"><span class="menu_ar"> Link</span></a></span></li>
</ul>
<br class="clearit" />
</div>

7. Simpan.

Yang harus diganti adalah tulisan yang berwarna hijau dan merah. Selamat mencoba !

Cara Membuat Scroll bar Pada Arsip Blog

noreply@blogger.com (mohamad imron) — Sun, 25 Sep 2011 16:56:00 +0000

Agar arsip blog anda mudah dilihat berikut ini ada tips dan trik yang coba saya perkenalkan, yaitu dengan cara membuat scroll bar pada arsip blog. Untuk membuat arsip blog memiliki fungsi scroll sangat mudah, bagaimanakah caranya : 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

<b:widget id='BlogArchive1' 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 anda ganti agar sesuai dengan blog anda.

Selamat mencoba dan Semoga bermanfaat

Cara Membuat Kotak Kode Script/Html

noreply@blogger.com (mohamad imron) — Sun, 25 Sep 2011 16:46:00 +0000

Postingan saya kali ini akan membahas tentang cara Membuat Kotak Kode Script/HTML Saat Memposting/membuat tulisan baru.
Bagi sobat yang belum pada tau maupun bisa, untuk memperindah script yang sobat posting. Mari kita bersama-sama coba mempraktekan membuat sebuah kotak script/html saat memposting, Silahkan pilih berikut ini sesuai dengan selera anda.

• Solid Border.

<div style="border: 2px #006400 so;id; padding: 10px; background-color: #E6E6FA; text-align: left;"> > TULISKAN KODE/SCRIPTNYA DISINI </div>

• Ridge Border.

<div style="border: 2px #006400 ridge; padding: 10px; background-color: #E6E6FA; text-align: left;"> > TULISKAN KODE/SCRIPTNYA DISINI </div>

• Groove Border.

<div style="border: 2px #006400 groove; padding: 10px; background-color: #E6E6FA; text-align: left;"> > TULISKAN KODE/SCRIPTNYA DISINI </div>

• Inset Border.

<div style="border: 2px #006400 inset; padding: 10px; background-color: #E6E6FA; text-align: left;"> > TULISKAN KODE/SCRIPTNYA DISINI </div>

• Outset Border.

<div style="border: 2px #006400 outset; padding: 10px; background-color: #E6E6FA; text-align: left;"> > TULISKAN KODE/SCRIPTNYA DISINI </div>

• Double Border.

<div style="border: 2px #006400 double; padding: 10px; background-color: #E6E6FA; text-align: left;"> > TULISKAN KODE/SCRIPTNYA DISINI </div>

• Dotted Border.

<div style="border: 2px #006400 dotted; padding: 10px; background-color: #E6E6FA; text-align: left;"> &> TULISKAN KODE/SCRIPTNYA DISINI </div>

• Dashed Border.

<div style="border: 2px #006400 dashed; padding: 10px; background-color: #E6E6FA; text-align: left;"> > TULISKAN KODE/SCRIPTNYA DISINI </div>

• Border dengan scroll, lebar dan tinggi.

<div style="border: 2px #006400 solid; padding: 10px; background-color: #82CAFA; overflow: auto; height: 50px; width: 300px; text-align: left;"> >TULISKAN KODE/SCRIPTNYA DISINI</div>

Keterangan :

- Tulisan 'Berwarna Merah' : Silahkan ganti dengan Kode Script/HTML yang sobat inginkan.
- Perlu di ingat Kode HTML atau Script yang ingin kamu tampilkan harus dalam keadaan ENCODE bisa dilihat caranya disini

- Warna Background silahkan ganti sesukamu

GOOG LUCK

Kode Warna HTML

noreply@blogger.com (mohamad imron) — Sun, 25 Sep 2011 16:43:00 +0000

Baca Selengkapnya Tips dan Trik Cara Memasang/Membuat Tabel Kode Warna HTML Di Blog

Cara Memasang/Membuat Tabel Kode Warna HTML Di Blog

noreply@blogger.com (mohamad imron) — Sun, 25 Sep 2011 16:42:00 +0000

Berikut ini saya membuat postingan tentang Cara Memasang/Membuat Tabel Kode Warna HTML di Blog. Dengan Anda memiliki Tabel Warna Berikut Anda tidak perlu lagi capek-capek pergi kesitus penyedia kode warna untuk mengedit Blog. Karena Sobat juga bisa memasangnya di Blog Sobat. sebaiknya widget ini Anda pasang di postingan saja bermanfaat buat kita bermanfaat juga untuk pengunjung yang mencari kode warna. Jika memasangnya di widget blog takutnya blog malah tambah berat. Beda jika kita menampilkannya di postingan beban blog masih bisa di minimalisir.
Contohnya Posting kode warna klik disini

Jika Anda tertarik membuatnya ikuti langkah berikut ini :
1. Login ke akun Blogger Anda
2. Klik Tata Letak / Layout
3. Klik Edit HTML
4. Cari kode Untuk memudahkan tekan ctrl+F.
5. Kemudian copy paste-kan kode dibawah ini persis diatas kode

<script language='javascript'>
function Barva(koda)
{
document.getElementById("vzorec").bgColor=koda;
document.hcc.barva.value=koda.toUpperCase();
document.hcc.barva.select();
}
function BarvaDruga(koda)
{
document.getElementById("vzorec2").bgColor=koda;
document.hcc.Barva2.value=koda.toUpperCase();
document.hcc.Barva2.select();
}
</script>

<script type='text/javascript'>

var hue;
var picker;
//var gLogger;
var dd1, dd2;
var r, g, b;

function init() {
if (typeof(ygLogger) != "undefined")
ygLogger.init(document.getElementById("logDiv"));
pickerInit();
//ddcolorposter.fillcolorbox("colorfield1", "colorbox1") //PREFILL "colorbox1" with hex value from "colorfield1"
//ddcolorposter.fillcolorbox("colorfield2", "colorbox2") //PREFILL "colorbox1" with hex value from "colorfield1"
}

// Picker ---------------------------------------------------------

function pickerInit() {
hue = YAHOO.widget.Slider.getVertSlider("hueBg", "hueThumb", 0, 180);
hue.onChange = function(newVal) { hueUpdate(newVal); };

picker = YAHOO.widget.Slider.getSliderRegion("pickerDiv", "selector", 0, 180, 0, 180);
picker.onChange = function(newX, newY) { pickerUpdate(newX, newY); };

hueUpdate();

dd1 = new YAHOO.util.DD("pickerPanel");
dd1.setHandleElId("pickerHandle");
dd1.endDrag = function(e) {
// picker.thumb.resetConstraints();
// hue.thumb.resetConstraints();
};
}

executeonload(init);

function pickerUpdate(newX, newY) {
pickerSwatchUpdate();
}

function hueUpdate(newVal) {

var h = (180 - hue.getValue()) / 180;
if (h == 1) { h = 0; }

var a = YAHOO.util.Color.hsv2rgb( h, 1, 1);

document.getElementById("pickerDiv").style.backgroundColor =
"rgb(" + a[0] + ", " + a[1] + ", " + a[2] + ")";

pickerSwatchUpdate();
}

function pickerSwatchUpdate() {
var h = (180 - hue.getValue());
if (h == 180) { h = 0; }
document.getElementById("pickerhval").value = (h*2);

h = h / 180;

var s = picker.getXValue() / 180;
document.getElementById("pickersval").value = Math.round(s * 100);

var v = (180 - picker.getYValue()) / 180;
document.getElementById("pickervval").value = Math.round(v * 100);

var a = YAHOO.util.Color.hsv2rgb( h, s, v );

document.getElementById("pickerSwatch").style.backgroundColor =
"rgb(" + a[0] + ", " + a[1] + ", " + a[2] + ")";

document.getElementById("pickerrval").value = a[0];
document.getElementById("pickergval").value = a[1];
document.getElementById("pickerbval").value = a[2];
var hexvalue = document.getElementById("pickerhexval").value ='#'+
YAHOO.util.Color.rgb2hex(a[0], a[1], a[2]);
ddcolorposter.initialize(a[0], a[1], a[2], hexvalue)
if (hexvalue!="#FFFFFF") document.getElementById("pickerhexval").select();
}

</script>

6. Klik Save Template

Kemudian untuk menampilkan tabel warna pada postingan atau widget masukan kode berikut ini :

center><form name="hcc" id="hcc">
<table style="border-collapse: collapse;" align="center" border="1" bordercolor="#cccccc" cellpadding="0" cellspacing="0"><tbody><tr><td><table align="center" border="0" cellpadding="0" cellspacing="1" width="175"><tbody><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#190707">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a0a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b0b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#610b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a0808">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b40404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df0101">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff0000">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe2e2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fa5858">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f78181">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5a9a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6cece">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8e0e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbefef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#191007">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a1b0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b240b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#61380b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a4b08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b45f04">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df7401">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff8000">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe9a2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#faac58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f7be81">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5d0a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6e3ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8ece0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbf5ef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#181907">
</td><td onclick="Barva(this.bgColor)" bgcolor="#292a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#393b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5e610b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#868a08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#aeb404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d7df01">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ffff00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f7fe2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f4fa58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f3f781">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f2f5a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5f6ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f7f8e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbfbef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#101907">
</td><td onclick="Barva(this.bgColor)" bgcolor="#1b2a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#243b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#38610b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#4b8a08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5fb404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#74df00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#80ff00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#9afe2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#acfa58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#bef781">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d0f5a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e3f6ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ecf8e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5fbef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071907">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a2a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b610b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#088a08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#04b404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#01df01">
</td><td onclick="Barva(this.bgColor)" bgcolor="#00ff00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2efe2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58fa58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81f781">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9f5a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cef6ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0f8e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#effbef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071910">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a2a1b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3b24">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b6138">
</td><td onclick="Barva(this.bgColor)" bgcolor="#088a4b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#04b45f">
</td><td onclick="Barva(this.bgColor)" bgcolor="#01df74">
</td><td onclick="Barva(this.bgColor)" bgcolor="#00ff80">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2efe9a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58faac">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81f7be">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9f5d0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cef6e3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0f8ec">
</td><td onclick="Barva(this.bgColor)" bgcolor="#effbf5">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071918">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a2a29">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3b39">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b615e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#088a85">
</td><td onclick="Barva(this.bgColor)" bgcolor="#04b4ae">
</td><td onclick="Barva(this.bgColor)" bgcolor="#01dfd7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#00ffff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2efef7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58faf4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81f7f3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9f5f2">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cef6f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0f8f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#effbfb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071019">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a1b2a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b243b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3861">
</td><td onclick="Barva(this.bgColor)" bgcolor="#084b8a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#045fb4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0174df">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0080ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2e9afe">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58acfa">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81bef7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9d0f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cee3f6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0ecf8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#eff5fb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#070719">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a0a2a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b0b3b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b0b61">
</td><td onclick="Barva(this.bgColor)" bgcolor="#08088a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0404b4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0101df">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0000ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2e2efe">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5858fa">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8181f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9a9f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cecef6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0e0f8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#efeffb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#100719">
</td><td onclick="Barva(this.bgColor)" bgcolor="#1b0a2a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#240b3b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#380b61">
</td><td onclick="Barva(this.bgColor)" bgcolor="#4b088a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5f04b4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#7401df">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8000ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#9a2efe">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ac58fa">
</td><td onclick="Barva(this.bgColor)" bgcolor="#be81f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d0a9f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e3cef6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ece0f8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5effb">
</td></tr><tr height="24"> <td onclick="Barva(this.bgColor)" bgcolor="#190718">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a0a29">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b0b39">
</td><td onclick="Barva(this.bgColor)" bgcolor="#610b5e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a0886">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b404ae">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df01d7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff00ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe2ef7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fa58f4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f781f3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5a9f2">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6cef5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8e0f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbeffb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#190710">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a0a1b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b0b24">
</td><td onclick="Barva(this.bgColor)" bgcolor="#610b38">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a084b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b4045f">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df0174">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff0080">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe2e9a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fa58ac">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f781be">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5a9d0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6cee3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8e0ec">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbeff5">
</td></tr><tr height="10"><td>
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#000000">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b0b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#151515">
</td><td onclick="Barva(this.bgColor)" bgcolor="#1c1c1c">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2e2e2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#424242">
</td><td onclick="Barva(this.bgColor)" bgcolor="#585858">
</td><td onclick="Barva(this.bgColor)" bgcolor="#6e6e6e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#848484">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a4a4a4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#bdbdbd">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d8d8d8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e6e6e6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f2f2f2">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ffffff">
</td></tr></tbody></table></td></tr></tbody></table>
<table align="center" border="0" cellpadding="0" cellspacing="2"><tbody><tr height="24"><td id="vzorec" height="24" width="24">
</td><td valign="bottom"><p>Kode warna yang terpilih : <input name="barva" id="barva" style="font-weight: bold; font-family: Verdana; height: 16px; width: 74px; font-size: 12px;" maxlength="7" size="9" type="text"></p></td></tr></tbody></table>
</form></center>
SELAMAT MENCOBA

Cara Mempromosikan/Memperkenalkan Blog

noreply@blogger.com (mohamad imron) — Sun, 25 Sep 2011 16:41:00 +0000

Setelah anda selesai membuat sebuah blog, kini giliran anda untuk mempromosikan/memperkenalkan blog milik Anda pada dunia ramai.
Apa gunanya membuat sebuah blog kalau semua yang kita tulis dalam postingan blog kita tidak dibaca orang/pengunjung.
Bagaimanakah caranya supaya tulisan/postingan kita dapat dibaca orang/pengunjung dengan cepat

Berikut langkah-langkah cara mempromosikan blog :

(1) Daftarkan di blog directory

Daftarkan blog Anda ke berbagai direktori blog yang ada. Sedikitnya, daftarkan di tiga blog directory terbesar dan terpopuler, yaitu

(a) http://www.technorati.com
(b) http://feeburner.com
(c) http://blogdigger.com

Ikuti seluruh petunjuk pada ketiga blog directory tsb ketika mendaftar.

Blog-blog directory ini nantinya secara otomatis akan mengirim data blog dan posting-posting anda ke berbagai search engine, termasuk tiga search engine besar yaitu http://google.com, http://msn.com, http://yahoo.com.

(2) Link-trade, Link Exchange atau Tukar Link

Ajak teman /pengunjung anda untuk saling tukar link. Link URL anda di blog dia, dan jangan lupa anda juga memasukkan link blog teman anda tsb. di blog anda. Dalam dunia blog, ini disebut juga dg istilah BLOGROLL. Dan blogroll ini salah satu penyebab cepatnya popularitas blog di seluruh dunia, mengalahkan website yg biasa.

Blogroll atau link-exchange tidak harus melalui permintaan, bisa juga dg saling suka rela. Umpamanya, ada seseorang blogger (pemilik blog) yg memasang link Anda di blog dia, apabila Anda tahu, maka Anda juga "berkewajiban" menambah link blog dia di blog Anda. Apabila tidak, maka akan dicap sebagai "blogger pelit". Di dunia maya pun, sebagaimana di dunia nyata, orang pelit akan selalu teralienasi. Dg kata lain, sedikit "tamu"nya. :)

Nah, bagaimana cara mengetahui ada yg mengelink blog Anda? Caranya mudah: tulis di kotak http://technorati.com/search alamat blog Anda atau blog siapa saja yg ingin Anda ketahui. Contoh blog ini, http://kolom-mario.blogspot.com, setelah itu tekan search, anda akan tahu siapa saja yg ngelink ke blog tsb.

Sebagai langkah pertama 'proyek' tukar link, Anda bisa mencoba dg memasang link blog http://afsyuhud.blogspot.com di sidebar blog Anda. Dalam waktu tidak lama, alamat blog Anda akan tampil di blognya.

(3) Berkunjung ke blog lain

Untuk menambah teman untuk diajak blogroll, sempatkan berkunjung ke blog2 lain, dan berkomentar di bukutamu atau tagboard mereka atau berkomentar di tulisan mereka sambil jangan lupa memasang alamat blog Anda di blog mereka. Dalam waktu tidak lama, mereka akan "bertamu balik" ke "rumah" atau blog Anda.

(4) Aktivitas posting
Usahakan sedikitnya satu kali posting setiap harinya. Posting yg teratur di blog, akan membuat tamu datang secara teratur juga.

(5) Alamat blog di signature email
Tulis alamat blog Anda di signature email. Sehingga setiap anda menulis email ke pribadi atau ke milis, alamat blog anda akan selalu muncul, dan "menggoda" orang untuk berkunjung. Memposting ringkasan tulisan di blog Anda ke milis juga akan sangat menggoda member milis untuk datang ke blog Anda.

Cara Mempromosikan/Memperkenalkan Blog

noreply@blogger.com (mohamad imron) — Sun, 25 Sep 2011 16:40:00 +0000

Membuat Readmore - Cara Membuat Readmore/Baca Selanjutnya/Selengkapnya

noreply@blogger.com (mohamad imron) — Sun, 25 Sep 2011 16:35:00 +0000

Readmore/Baca Selanjutnya/Selengkapnya………………….
Sudah banyak yang saya baca mengenai kata Readmore/ baca selengkapnya/Selanjutnya. Berikut ini saya akan membagikan tips bagaimana cara membuat dan memasang tanda Readmore/baca selengkapnya/ Selanjutnya. Mari kita coba ikuti langkah berikut ini :
Pertama-tama :
• Sign in di blogger dengan id anda.
• Klik Pengaturan
• Klik Format
• Pada layar paling bawah, ada text area kosong disamping tulisan Template Posting, isi tesxt area kosong tersebut dengan kode di bawah ini :
<span class="fullpost">

</span>

• Klik tombol Simpan Pengaturan

Pemasangan kode ini di maksudkan agar pada saat posting artikel, kode tersebut langsung muncul tanpa harus menuliskan terlebih dahulu, jadi membantu kita agar tidak harus selalu mengingat kode tersebut.

Selanjutnya :
• Klik menu Dasboard
• Klik Tata Letak
• Klik tab Edit HTML
• Klik tulisan Download Template Lengkap.
• Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula
• Beri tanda centang pada kotak di samping tulisan Expand Template Widget

• Tunggu beberapa saat ketika proses sedang berlangsung
• Kemudian cari kode berikut pada kode template milik anda :

<data:post.body/>

atau kode di bawah ini (sama saja) ;

<p><data:post.body/></p>

• Hapus kode diatas, lalu ganti dengan kode di bawah ini (klik pada tombol untuk menandai):
Tandai Semua

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/>
<a expr:href='data:post.url'><strong>Readmore...</strong></a></p>
</b:if>

• Tulisan Readmore bisa anda rubah Selanjutnya/Selengkapnya
• Setelah itu Klik tombol Simpan Template
• Selesai

Cara Posting Artikel
• Klik menu Posting
• Klik menu Edit HTML, maka secara otomatis tampak kode yang telah kita setting tadi, yakni :

<span class="fullpost">

</span>

• Tuliskan artikel yang ingin tampak pada blog sebelum kode :

<span class="fullpost">

• Tulis keseluruhan sisa artikel sesudah kode di atas tadi dan sebelum kode :

</span>

• Klik tombol bertuliskan MEMPUBLIKASIKAN POSTING
• Klik tulisan Lihat Blog(di jendela baru) untuk melihat hasil dari postingan kita, kemudian lihat apakah hasilnya sukses atau tidak. Jika tidak, mungkin ada bagian yang terlewatkan. Coba lihat kembali langkah diatas

Selamat mencoba dan semoga bermanfaat artikel cara membuat menu Read more...

Cara menampilkan Adsense

noreply@blogger.com (mohamad imron) — Sat, 20 Aug 2011 17:32:00 +0000

Untuk memasang adsense agar tampil di dialam postingan membutuhkan sedikit trik, karena kalo cuma asal pasang script adsense didalam potingan maka iklan adsense tidak akan muncul. Nha kali ini akan kita bahas trik untuk menampilkan adsense didalam postingan tapi setelah link "Read more" diklik. Gini nih caranya :
1. Login ke blogger kemudian pilih "Layout --> Edit HTML"
2. Beri tanda centang pada kotak "Expand widget template"
3. Cari Kode berikut :

<data:post.body/></p>

4. Hati-hati, di dalam kode HTML yang sudah dipasang "Readmore" biasanaya ada 2 kode seperti itu. Jadi pilih kode yg pertama.
5. Setelah itu letakan kode Google adsense kamu dibawah kode tersebut. Tp sebelumnya perhatikan yg berikut ini.

kode adsense biasanya seperti ini :

<center><script type="text/javascript">
</script>
<script
src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script></center>

perhatikan kode yang berwarna merah ( ). Hapus kedua kode tersebut. Kemudian copy kode adsens dan letakkan dibawah kode <data:post.body/></p>. Lalu simpan Template kamu.

Cara daftar Google Adsense

noreply@blogger.com (mohamad imron) — Sat, 20 Aug 2011 17:25:00 +0000

Untuk mendaftar di google adsense caranya gampang2 susah. Syaratnya yaitu km harus punya web/blog yang kondisinya lumayan bagus. Jadi kalo web/blognya masih acak-acakan atau masih belum ada isinya misalnya, akan susah di approve oleh google. Kalosudah punya web/blog, langkah selanjutnya yaitu buka situs google adsense trus daftarkan diri kamu disana. Kalo sudah mendaftar kamu tinggal menunggu web/blog kamu disetujui oleh om google (nunggunya bisa nyampe beberapa hari).

Kalo nanti account kamu sudah disetuui oleh google, baru kamu bisa memasang adsense di web/blog km. Oh ya, kalo udah disetujui kita bisa masang adsense di web/blog2 kita yang lain, jadi tidak hanya di web/blog yang sudah kita daftarkan dulu. Dan kita tidak perlu lagi mendaftarkan web/blog yang akan kita pasangi adsense.
Cara Memasang Adsense di Web/Blog
Kalo account kita sudah disetujui oleh google maka kita sudah bisa memasang adsense/iklan di web/blog kita. Caranya gimana?
Gini nih langkah-langkahnya, ohya ini untuk memasang adsense yang type content lho ya:

1. Login ke https://www.google.com/adsense/home
2. Pilih menu "Adsense Setup" kemudian pilih "Adsense for content".
3. Setelah itu akan muncul beberapa settingan ang harus disisi, seperti Format, Color, Style. Kalo sudah klik tombol "Continue >>" dibagian bawah.
4. Kemudian akan muncul tampilan untuk memasukkan kedalam channel2. Fungsinya untuk mengelompokan iklan2/adsense2 yang dibuat. Untuk menambahkan channel kilk link "Add new channel" trus kasih nama channelnya. Kalo sudah tekan tombol "Continue >>"
5. Kemudian klik tombol "Submit and Get Code"
6. Nha setelah itu km akan mendapati sebuah kotak yang berisi kode2/script, copy kode tersebut. dan pasang di web/ blog kamu.
7. Kalo di blogspot, cara pasangnya pilih "add page element --> HTML/Javascript"

Silahkan dilihat blognya apakah sudah muncul adsensnya? Biasanya adsensenya belum akan muncul, jadi harus nunggu beberapa menit baru adsensnya muncul.

Google Adsense

noreply@blogger.com (mohamad imron) — Sat, 20 Aug 2011 17:21:00 +0000

Google Adsense adalah program yang dibuat oleh Google yang menampilkan iklan, isi dari iklan adsense tersebut biasanya adalah text link atau gambar yang commersil untuk dipasang pada sebuah website atau blog. Biasanya berupa text atau gambar yang mengandung link atau juga bisa berupa Search box atau kotak untuk pencarian. Google akan membayar pemasang setiap kali link tersebut di klik. Biasanya link atau gambar tersebut akan disesuaikan dengan isi dari website pemasang secara otomatis oleh Google. Misalnya, website pemasang Adsense berhubungan dengan ebok ada hubungannya dengan ebook.
Sekarang ini banyak sekali orang indonesia yang berbondong-bondong menggunakan cara ini untuk mencari uang, bahkan dijadikan sebagai pekerjaan atau penghasilan utama mereka. Ratusan bahkan ribuan dollar bisa mereka hasilkan setiap bulannya. Bagaimana tidak tertarik, cuma dengan modal buat website/blog trus dipasangi iklan bisa menghasilkan penghasilan yang begitu menggiurkan.

Ada beberapa macam type adsense yang disediakan oleh google adsense, yaitu :

1. Adsense for content.
Type ini merupakan type yang biasa. Ini yang paling banyak digunakan orang. Bentuknya yaitu berupa iklan yang kita akan mendapatkan dollar jika ada yang mengklik iklan tersebut dengan kata lainnya yaitu PPC (Paid Per Click). Tapi kadang-kadang kita juga bisa mendapatkan dollar setiap 1000 impression/tampil (Paid Per Impression) , tapi untuk yang ini sepertinya hanya untuk iklan2 tertentu dan dibuka di negara2 tertentu.
Contoh :

2. Adsense for search.
Yang ini bentuknya berupa "Search engine". Kita hanya akan mendapatkan bayaran bila ada orang yang melakukan pencarian melalui search engine yang kita pasang di web/blog kita dan kemudian orang tersebut mengklik pada salah satu hasil pencarian yang berupa iklan, jadi tidak semua hasil pencarian itu berupa iklan yang dibayar. Biasanya yang diberi kotak dan ada tulisannya "Ads by google"
Contoh :

3. Referrals.
Adsense Referrals bentuk sama persis dengan type "for content", cuma bedanya yaitu dari sistem perolehan dollarnya. type ini, kita akan mendapatkan bayaran jika ada yang mendaftar/mendownload/membeli/menggunakan pruduk dari iklan tersebut.

Cara membuat Readmore

noreply@blogger.com (mohamad imron) — Wed, 17 Aug 2011 19:27:00 +0000

Sudah banyak yang saya baca mengenai kata Readmore/ baca selengkapnya/Selanjutnya. Berikut ini saya akan membagikan tips bagaimana cara membuat dan memasang tanda Readmore/baca selengkapnya/ Selanjutnya. Mari kita coba ikuti langkah berikut ini :
Pertama-tama :
• Sign in di blogger dengan id anda.
• Klik Pengaturan
• Klik Format
• Pada layar paling bawah, ada text area kosong disamping tulisan Template Posting, isi tesxt area kosong tersebut dengan kode di bawah ini :

• Klik tombol Simpan Pengaturan

Pemasangan kode ini di maksudkan agar pada saat posting artikel, kode tersebut langsung muncul tanpa harus menuliskan terlebih dahulu, jadi membantu kita agar tidak harus selalu mengingat kode tersebut.

Selanjutnya :
• Klik menu Dasboard
• Klik Tata Letak
• Klik tab Edit HTML
• Klik tulisan Download Template Lengkap.
• Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula
• Beri tanda centang pada kotak di samping tulisan Expand Template Widget

• Tunggu beberapa saat ketika proses sedang berlangsung
• Kemudian cari kode berikut pada kode template milik anda :

atau kode di bawah ini (sama saja) ;

• Hapus kode diatas, lalu ganti dengan kode di bawah ini (klik pada tombol untuk menandai):
Tandai Semua

Readmore...

• Tulisan Readmore bisa anda rubah Selanjutnya/Selengkapnya
• Setelah itu Klik tombol Simpan Template
• Selesai

Cara Posting Artikel
• Klik menu Posting
• Klik menu Edit HTML, maka secara otomatis tampak kode yang telah kita setting tadi, yakni :

• Tuliskan artikel yang ingin tampak pada blog sebelum kode :

• Tulis keseluruhan sisa artikel sesudah kode di atas tadi dan sebelum kode :

• Klik tombol bertuliskan MEMPUBLIKASIKAN POSTING
• Klik tulisan Lihat Blog(di jendela baru) untuk melihat hasil dari postingan kita, kemudian lihat apakah hasilnya sukses atau tidak. Jika tidak, mungkin ada bagian yang terlewatkan. Coba lihat kembali langkah diatas

Mudah-mudahan dengan adanya postingan ini tidak ada lagi yang mengalami kegagalan dalam membuat menu Read more...

Cara membuat Google search tampil dihalaman posting

noreply@blogger.com (mohamad imron) — Wed, 17 Aug 2011 18:54:00 +0000

Trik Membuat Hasil Pencarian Google Search Tampil di Halaman Posting
Jika Kita memasang "Google Adsense for Search" atau search engine dari google adsense, maka ada tiga cara untuk menampilkan hasil pencariannya, yaitu:

1. Open results on Google in the same window (ditampilkan di halaman yang sama)
2. Open results on Google in a new window (ditampilkan dihalaman yang baru)
3. Open results within my own site (ditampilkan di site yang kita kehendaki).

Yang paling mudah adalah memakai cara yang pertama dan kedua, tapi cara ini membuat pungunjung yg melakukan pencarian kurang begitu antusias karena hasil pencariannya tidak lagi berada di blog kita. Kalo menurutku cara yg ketiga yang paling bagus, karena hasil pencariannya akan langsung berada di dalam web/blog kita. Ttapi cara ini membutuhkan beberapa trik agar bisa tampil di dalam postingan blogger. Yang pengen tahu beginilah caranya :

1.    Buat postingan di blogger, tapi isinya kosong. trus dikasih judul.
2.    Ganti tanggal postingnya ke tanggal yg lebih lama biar tidak muncul di halaman utama. caranya klik link "Post Option" (kiri bawah) kemdian yang didalam kotak "Post date and time" itu tanggalnya diganti. kalo sudah "Publish Post"
3.    Masuk di "edit post" trus klik kanan link "View" pada judul postingan kosong yang km buat tadi, trus pilih "Copy link location" (bagi yg pake opera). Intinya yaitu mengambil link dari judul postingan kosongmu tadi.
3.    Selanjutnya yaitu Login di google adsense, trus buat "Adsense for search".
5.    lakukan beberapa settingnya, seperti memlih tampilan dan lain2.
6.   Kemudian saat masuk ke pilihan "Opening of search results page" pilih yang "Open results within my own site", trus isikan link postinganmu tadi kedalam kotak dibawahnya.
7.    Lalu didalam kotak "Enter width of results area:" ganti menjadi angka yg lebih kecil supaya muat di dalam bagian utama (postingan) blogmu. Minimal 500 px.
8.    Ikuti terus langkah berikutnya sampai anda mendapatkan script dari google. Biasanya akan ada dua script, yang pertama untuk Foor Search Enginenya, yang kedua untuk hasil pencariannya.
9.    Copy script yg pertama dan taruh di blogger, "Page element-->Add page element -->Html/Javascript".
10. Script yang kedua juga sama, copy ke "Page element-->Add page element -->Html/Javascript", tapi kemudian geser/taruh pagelement script yang kedua tadi, ke bawah dari element utama/postingan. (mudeng gak ya).
11. Kalo sudah trus simpan dan coba deh....

Postinganku dari Pengalamanku

noreply@blogger.com (mohamad imron) — Fri, 12 Aug 2011 17:09:00 +0000

Sudah sejak lama saya mencoba mencari halaman demi halaman dari blog blog yang ada, saya sempat berfikir kenapa begitu susahnya membuat sebuah blog yang sebenarnya sangatlah mudah. Dari sekian banyak blog yang saya kunjungi, semuanya memiliki tips dan trik yang berbeda tapi memiliki arah dan tujuan yang sama, ini yang masih membuat saya bingung untuk memilih dan menentukan blog mana yang bisa saya ikuti dan sesuai dengan jiwa saya.
Masih bingung juga, maklum baru pertama kali mencoba membuat blog!
Gimana ya caranya supaya saya bisa lebih mudah untuk membuat blog yang fleksibel? ntar saya berfikir dulu