Senin, 29 September 2008

Selamat Hari raya Iedul Fitri 1429H

lebaran2 Tak terasa hari Raya Iedul Fitri 1429H tinggal 2 hari lagi, karena hampir di pastikan dalam beberapa hari ke depan kang Rohman tidak akan bisa online di karenakan harus menjalani beberapa kegiatan yang berhubungan dengan perayaan hari raya yang antara lain harus bersilaturahmi ke sanak saudara, Maka ada baiknya dalam posting ini Kang Rohman sekeluarga hendak memohonkan maaf lahir dan bathin kepada anda semua para pembaca Blog Kang Rohman, tentunya kang Rohman sebagai manusia biasa banyak sekali dosa yang terasa dan dosa yang tidak terasa di perbuat.

Disamping itu, tentunya kang Rohman ucapkan Selamat Hari raya Iedul Fitri 1429H untuk anda yang merayakannya. Semoga di hari yang suci, diri kita termasuk kepada orang-orang yang kembali kepada kesucian.

 

 

** Selamat Hari raya Iedul fitri 1429h **

 

* Mohon Maaf lahir dan Bathin *

Rabu, 24 September 2008

Akhirnya kebagian PR juga

Sudah tahu yang lagi hangat-hangatnya di jagad perblogan kan? So pastilah sudah pada tahu, bahkan mungkin kang Rohman merupakan yang paling belakangan nih.

 

Anda : Emang apaan Kang?

Aku   : Itu tuh soal pada nge post bikin PR di blog?

Anda : PR? Page Rank Maksudnya?

Aku   : Kaya nya sih bukan, Pekerjaan Rumah kalii. soalnya pada pada nge post nya kan dari Rumah..hehehe

Anda ; Ah si akang ada ada aja.

 

Itulah kutipan dari hasil percakapan antara aku dan anda hasil rekayasa kang Rohman yang suka ngarang-ngarang pembicaraan padahal tidak pernah terjadi 

 

Terus terang kang Rohman sedang stress berat nih karena dapet PR dari mas iwan free 7 serta pak Briptu_PRIE79. yang jadi persolaan adalah kalau PR kan musti di kerjain di Rumah, sedangkan posisi kang Rohman sekarang sedang ada di Kantor, jadinya ngga bisa deh kalo bikin PR, paling bisa juga bikin Pekerjaan Kantor (PK)… desigggg

 

Aduhhh. biar tidak semakin ngaco nih, langsung saja ah bikin PK nya ( eh PR dhenk ) . Berikut 10 PR jawaban saya:

 

  1. Dilahirkan di kota Bandung pada tanggal 15 april 1980 dari seorang ibu yang sangat mulia di mata saya. Sedikit menyedihkan jika flash back ke masa lalu, umur 6 tahun sudah di tinggal pergi untuk selama nya oleh ayah tercinta . Hidup di bawah garis kemiskinan merupakan hal yang harus di jalani setiap hari pada waktu itu. Anak ke 5 dari 6 bersaudara.
  2. Sudah punya istri yang cantik dan telah di karuniai 2 orang puteri.
  3. Sedikit cahaya terang menghampiri karena ada seorang lelaki mulia yang ikhlas membiayai ku sekolah hingga tamat STM.
  4. Keseharian sekarang sebagai teknisi audio video di authorized sony Jakarta.
  5. Seorang penipu ulung di dunia maya. Emang kenapa? kata orang-orang yang komentar, saya seorang SUHU alias MASTER di dunia blog, padahal kenyataannya hanya seorang newbie yang hanya hoby mencet-mencet keybord lalu mem publish nya di blog. Nah karena sekarang anda sudah tahu bahwa saya adalah hanya penipu, silahkan hentikan memanggil saya SUHU atau MASTER blogger karena saya hanya seorang newbie.
  6. Sedikit gampang tersinggung dan kurang bisa bekerjasama dengan orang lain, orangnya tidak supel dan kurang bisa bergaul. Bekerja sendiri adalah keindahan yang biasa di nikmati.
  7. Cita-cita yang sedang di mimpikan sekarang adalah menjadi Profesional Blogger ( hiks… bagai pungguk merindukan bulan…. Ngaca dulu donk) seperti rekan blogger lain yang sudah terlebih dahulu sukses di dunia online.
  8. Blogger sombong yang jarang blogwalking serta jawab komentar karena terlalu sibuk buat nyari duit buat anak-anaknya makan.
  9. Game favourite adalah main Alien Shooter untuk yang Survive, tapi tidak pernah bisa tamat karena selalu mati di bagian kerbau biru semua.
  10. Olah raga favoutite ku adalah renang, suka main catur dan ngenet sampai ketiduran di meja komputer.

 

 

Duhhh… rupanya ini adalah pengalaman terburuk saya selama ngeblog. Tiba-tiba ketika harus menulis 10 PR, otak saya tidak bisa bekerja dengan baik. Please jangan ada yang minta lagi di buatkan PR. Mengingat masa lalu adalah seperti menghampiri hantu yang begitu menyeramkan.

 

Terima kasih buat teman-teman yang masih perduli ke kang Rohman. Maaf mas Iwan free 7, tulisan saya jadi aneh begini.

 

Duh, siapa lagi nih yang belum bikin PR ya? coba ah ke Kang Jaloe, Jovie, BambangXP, Ade Sanusi, Bon Jovi, Koko, Bani risset, Agung, Kang Noval, Taufik AlMubarak, kalo oom kayanya  udah ya om. Trus siapa lagi nih? duh ko otak saya jadi macet begini nih…aaaahhhhh sebel banget.

 

Eh terima kasih juga untuk anthony dan rekan rekan yang lain yang tidak bisa saya sebutkan satu-satu, kometar saja di bawah yah biar pada nongol namanya.

 

Buat yang mau bikin PR, katanya harus mengikuti aturan berikut :

 

1. Each blogger must post these rules
2. Each blogger starts with ten random facts/habits about themselves
3. Bloggers that are tagged need to write on their own blog about their ten things and post these rules. At the end of your blog, you need to choose ten people to get tagged and list their names.
4. Don’t forget to leave them a comment telling them they’ve been tagged and to read your blog.

 

 

Akhirnya postingan ini selesai juga,  Maaf jika postingannya sedikit aneh dari biasanya.

Senin, 22 September 2008

Menghilangkan Icon Obeng dan Tang / Quick edit Blogger

Menanggapi pertanyaan dari beberapa blogger… hehehe… kang Rohman serasa jadi konsultan blogger saja ya kalau posting biasanya pake kata-kata tersebut 4 soalnya “ Your Questions is my inspiration” pertanyaan anda adalah inspirasiku. Jadi rahasia kenapa blog ini masih bisa bertahan sampai sekarang adalah karena masih ada yang bertanya ke kang Rohman. So, tentu saja ide untuk posting selalu ada. Eh..eh.. ko…gitu sich.. la ko  jadi ngelantur nih, kembali ke judul posting ini ah.

Apa sih maksud dari judul posting ini, sepertinya agak aneh? begini nih teman-teman, jika kita sedang mengedit template dan melihat hasilnya maka pada sudut-sudut element akan terlihat icon bergambar obeng dan tang. berikut contoh screenshotnya :

 

quick-edit

 

Icon tersebut di sebut juga dengan icon Quick Edit atau dengan kata lain untuk mengedit secara cepat. Fungsinya jika kita ingin melakukan editing terhadap elemen tersebut tinggal klik saja icon nya dan kita bisa langsung mengeditnya. Icon tersebut sebenarnya hanya bisa di lihat apabila kita sedang login ke blogger saja, sedangkan pengunjung yang lain tidak bisa melihat icon tersebut.

Namun ternyata ada beberapa blogger yang tidak suka dengan kehadiran icon tersebut dan ingin menghapusnya. Apakah kita bisa  menghapus icon tersebut? Jawabannya tentu saja bisa, dan sangatlah gampang karena kita hanya melakukan perintah agar icon itu tidak di munculkan dengan hanya manambahkan sedikit kode pada kode CSS template kita. Ingin tahu kodenya seperti apa, nih ini dia kodenya, coba pasang saja di Style Sheet CSS anda :

 

.quickedit{
display:none;
}

 

Mudah sekali bukan? atau masih bingung. Ok deh, ini dia cara lengkapnya :

 

  1. Login ke blogger dengan ID anda tentunya.
  2. Klik  Tata Letak.
  3. Klik tab Edit HTML.
  4. Cari kode seperti ini :

     

    ]]></b:skin>

     

  5. Copy paste kode berikut persis di atas kode yang tadi :

     

    .quickedit{
    display:none;
    }

     

  6. Klik tombol Simpan template.

  7. Selesai.

 

 

Selain langkah di atas, sebenarnya masih ada yang harus anda lakukan yaitu silahkan ucapkan “ Selamat tinggal Obeng dan Tang…dadaaahhhhh “ hehehe….

 

Selamat mencoba!

Minggu, 21 September 2008

Tanya Jawab seputar Template magazine 2

Bagi anda para pengguna Template Magazine 2 yang Kang rohman launching pada postingan ini, ada kabar baik bagi anda. Postingan kali ini kang Rohman akan membahas tentang beberapa hal yang berhubungan dengan template tersebut. Jadi jangan khawatir anda akan kelimpungan dalam hal memakai template itu. Berikut adalah beberapa pertanyaan yang sering di tanyakan ke kang Rohman.

Tanya :

Bagaimana cara mengupload Template Magazine 2 ke blogger?

Jawab :

Pertama, silahkan download dulu templatenya di sini! atau di sini! File yang anda download pertama kali adalah masih dalam bentuk file zip, oleh karena itu anda perlu mengekstraknya dengan tool ekstraktor misal seperti winzip atau winrar. Setelah di ekstrak, maka akan ada satu folder silahkan di open saja. Dalam folder tersebut ada beberapa buah file yaitu file yang memuat gambar-gamabar, file xml, serta file readme.

File gambar, adalah memuat gambar-gambar background untuk template tersebut, silahkan di upload ke hosting gambar tempat anda biasa menyimpan gambar. Kemudian ambil URL gambar tersebut untuk nanti menggantikan alamat gambar yang kang rohman gunakan pada template tersebut,  ini di maksudkan agar tidak terlalu banyak yang menggunakan sumber gambar yang kang rohman gunakan, karena jika terlalu banyak yang memakainya maka nanti server gambar yang kang Rohman gunakan akan down sehingga template anda akan terlihat sangat jelek karena background gambarnya hilang.

Ketika anda mengupload file xml ke blogger, kang rohman sarankan untuk tidak menggunakan browser FireFox 3, karena menurut pengalaman pribadi kang rohman ketika mengedit template menggunakan firefox 3 sering terjadi error, sedangkan memakai browser yang lain tidak ada masalah. hal lain yang tak kalah penting ketika mengganti template adalah sebelum mengganti template, backup lah terlebih dahulu widget-widget anda. belum tahu bagaimana cara membackup widget? silahkan baca di sini! Untuk cara mengganti template, silahkan baca di sini!

 

Tanya :

Bagaimana cara membuat fungsi Read more (baca selengkapnya) ?

 

Jawab :

Untuk membuat fungsi Read more / Baca selengkapnya, silahkan baca di sini! atau di sini! 

satu catatan kecil : kode di bawah ini

 

<div class='post-body'>

 

itu sama saja dengan kode :

 

<div class='post-body entry-content'>

 

Jadi jangan bingung tujuh keliling ya!

 

Tanya :

Bagaimana cara mengganti header dengan gambar buatan sendiri?

 

Jawab :

Bagian header template ini di buat dalam dua kolom, yaitu samping kiri dan kanan. Untuk header yang asli adalah kolom yang sebelah kiri, yang kanan bisa anda masukan apa saja. Untuk membuat header banner yang di header, silahkan buat banner berukuran 420 X 100 pixel, misal seperti gambar ini :

 

magazine-2

 

Di sarankan mempunyai background hitam karena background headernya berwarna hitam. jika bannernya sudah di buat, silahkan ikuti langkah-langkah berikut :

Login ke blogger >> Tata Letak >> Elemen Halaman >> klik tulisan Edit Pada kolom header nya >> Klik tombol browse.. >> masukan banner yang tadi anda buat >> pilih selain judul dan keterangan >> Klik tombol SIMPAN >> Selesai. Perhatikan ilus trasi gambar berikut :

 

elemen-header

 

edit header

 

Tanya ;

Bagaimana cara mengedit menu navigasi yang ada di header?

 

Jawab :

Untuk mengedit menu navigasi yang ada di bawah header, berikut adalah langkahnya :

Login >> Tata Letak >> Edit HTML >> Cari kode yang seperti ini :

 

<div id='nav'>
<ul>
<li><a href='/'>home</a></li>
<li><a href='#'>edit-me</a></li>
<li><a href='#'>edit-me</a></li>

<li><a href='#'>edit-me</a></li>

<li><a href='#'>edit-me</a></li>
</ul>
</div>

 

Silahkan ganti tanda pagar dengan link yang anda inginkan, ganti pula tulisan edit-me dengan tulisan yang ingin muncul pada menu navigasi tersebut, misal :

 

<li><a href='http://www.blosgpottutorial.com'>Blog tutorial</a></li>

 

Jangan lupa untuk klik tombol SIMPAN TEMPLATE. selesai.

Mungkin itu saja untuk sementara, semoga tidak ada pertanyaan lain lagi.

NB : template ini akan di launching dalam beberapa pilihan warna lho. So, don’t miss it my friends.

Senin, 15 September 2008

Membuat Sidebar Dalam Kotak-Kotak Terpisah

Setelah berlibur selama dua hari ke kampung halaman, akhirnya hari ini terpaksa harus balik lagi ke tempat biasa kang Rohman mencari rezeki, sedih memang karena harus selalu terpisah dari keluarga. By the way, mungkin memang sudah suratan untuk jauh dari mereka, * ah kenapa harus mengeluh ya, mending syukuri saja apa yang telah tuhan berikan kepada saya *. Biar tidak mengeluh terus, lebih baik mijit-mijit papan keyboard saja barangkali akan keluar suatu tulisan yang di minati para sahabat semua.

Setelah membaca beberapa pertanyaan yang ada, rupanya banyak sekali yang tertarik untuk membuat sidebar atau pun kotak posting terlihat dalam bentuk kotak-kotak terpisah seperti yang tampak pada screenshot di bawah ini :

sidebar-kotak

 

Dari gambar di atas terlihat bahwa setiap widget yang di masukan baik itu sidebar ataupun posting akan terlihat dalam kotak sendiri-sendiri yang katanya lebih menarik dan terlihat lebih rapih. Bagaimanakah cara membuat layout seperti itu? ini sangatlah mudah, terutama bagi anda yang sudah familiar dengan yang namanya kode CSS namun tentu saja sangat sulit bagi meraka yang belum mengenalnya. Jadi, dalam tutorial kali ini sepertinya kang Rohman tujukan bagi mereka yang sedikiit familiar dengan kode CSS.

Tekniknya simpel, yaitu anda tinggal memberi warna yang berbeda antara background widget dengan background di mana widget itu berada, kemudian beri jarak antara widget yang satu dengan yang lain dengan menggunakan perintah “margin” dalam hal ini margin-bottom (margin bawah), dan agar lebih terkesan kotak, maka widget tersebut di beri perintah border. Bingung? hehehehehe……. kacian dech loe, minum obat bingung dulu gih biar bingungnya hilang.

Dimanakan kode wiget itu berada? setiap template tentunya berbeda satu sama lain, sehingga kang Rohman pun tidak bisa mematok kode itu harus bagaimana, namun sebagai contoh kang Rohman ambil Template minima. Di dalam template minima, kode widgetnya adalah seperti ini :

 

.sidebar .widget, .main .widget {
  border-bottom:1px dotted $bordercolor;
  margin:0 0 1.5em;
  padding:0 0 1.5em;
}

 

 

Jadi untuk mengetahui di manakah kode widget itu? jawabnya yang ada kata-kata widget nya (bener ngga? hehehe..). Namun dalam kasus di atas, ada dua kode widget yang di definisikan sama yaitu sidebar widget (halaman sidebar) dengan main widget (halaman posting) sehingga kedua widget tersebut akan selalu sama. Agar lebih flexibel dalam proses pengaturan widget, sebaiknya  kode tersebut kita buat terpisah, sehingga kodenya jadi seperti ini :

 

.sidebar .widget{
  border-bottom:1px dotted $bordercolor;
  margin:0 0 1.5em;
  padding:0 0 1.5em;
}

 

.main .widget {
  border-bottom:1px dotted $bordercolor;
  margin:0 0 1.5em;
  padding:0 0 1.5em;
}

 

Dengan kode di atas, maka anda bisa lebih berexplorasi. Ok para sedulur semua, kita fokus satu satu dulu yaitu ke widget sidebar. Untuk memberikan kesan sidebar widget mempunyai kotak yang terpisah-pisah anda bisa membuat variasi kode seperti ini (contoh saja) :

 

.sidebar .widget{

background:#fff;
  border:1px dotted #6c6b6b;
margin:0 0 1.5em;
  padding:0.5em;
}

 

Arti kode di atas kurang lebih seperti ini : warna background akan putih, garis mengelilingi widget sebesar 1 pixel (sehingga terkesan terlihat kotak), jarak ke bawah antara widget yang satu dengan yang lain sebsar 1.5em, dengan nilai padding (pemberi sela) sebesar 0.5em.

Dengan  memodifikasi seperti kode di atas saja, anda sudah punya sidebar dengan bentuk kotak-kotak terpisah. Apakah kode-kode tersebut mutlak? oh tentu saja tidak, berbagai variasi bisa anda ciptakan, misal memberi widget tersebut dengan background gambar, grid atau lain sebagainya, ini tidak lepas dari kreatifitas anda masing-masing.

Bagaimana dengan nasib main widget? main widget itu untuk mengatur widget posting, jadi tinggal kreasikan saja seperti halnya sidebar widget, simpel kan? hihihi…. ah cape nih ngetiknya, mudah-mudahan saja mengerti, soalnya saya juga bingung nih cara penyampaian yang mudah di mengerti seperti apa, mudah-mudahan bisa di mengerti dech.

 

Satu yang pasti, lebih banyak yang bingung daripada yang mengerti. Di jamin….. halal.

Kamis, 11 September 2008

Membuat Read more Plus Judul Artikel

Semenjak kang Rohman mengganti template dengan yang baru, ada sedikit yang berbeda dari sebelumnya. Apaan tuh? yang beda adalah kang Rohman menambahkan sedikit variasi pada link Baca selengkapnya ( Read more ) menjadi Lanjut membaca plus “Judul Artikel”. Variasi ini terinspirasi dari blog milik mas eko. Walaupun notabene blog mas eko menggunakan mesin wordpress, kang Rohman mempunyai pemikiran bahwa hal itu bisa juga di lakukan pada mesin blogger yang Kang Rohman gunakan. Setelah melakukan sedikit percobaan, akhirnya berhasil juga deh…. hehehe… seneng aku.

Rupanya ada dari pembaca blog ini yang ingin tahu tentang trik tersebut. Oleh karena itu pada posting kali ini, Kang Rohman mencoba untuk menuliskannya, walaupun setelah melakukan blog walking ternyata ada dari teman-teman blogger lainnya yang telah memposting trik ini terlebih dahulu, ah biarin saja itung-itung nambahin keyword buat mbah google..hihihi.

Perlu anda ketahui terlebih dahulu bahwa trik ini khusus di tujukan bagi anda yang telah menggunakan trik Read more seperti postingan Kang Rohman yang di sini. Jika pada postingan tersebut, kode read more yang di pasang adalah seperti ini :

 

<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>Selengkapnya...</strong></a></p>

</b:if>

 

Maka anda perlu mengubahnya menjadi seperti ini :

 

<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/></p>

<strong><a expr:href='data:post.url'>Lanjut membaca   &#8220;<data:post.title/>&#8221; &#160;&#187;&#187; </a></strong>

</b:if>

 

Jangan lupa untuk menekan tombol SIMPAN TEMPLATE untuk mengakhirinya. Mudah sekali bukan?

 

Selamat mencoba!

Senin, 08 September 2008

Tips Menghilangkan Pesan Pencarian Blogger

Jika anda melakukan pencarian di blog, baik itu melalui mesin pencari yang di pasang pada blog tersebut atau melalui label ataupun arsip blog, maka biasanya di atas halaman pencarian akan muncul pesan seperti ini :

pesan-pencarian 

Rupanya ada blogger yang tidak suka dengan kehadiran pesan ini dan menanyakan ke kang Rohman, apakah pesan ini bisa di hilangkan atau tidak? jawabannya tentu saja bisa, dan sangat mudah sekali. anda cukup menambahkan sedikit kode pada style sheet CSS anda. Kodenya seperti ini :

.status-msg-wrap{
display:none;
}

Kalau anda sudah memasang kode tersebut, niscaya pesan pencarian yang biasanya muncul akan malu-malu untuk menampakkan diri lagi. Aihhh.. kang Rohman suka bingungin dech, kasih tau donk cara lengkapnya bagaimana, masa gitu doank? hihihi.. bingung yach, ya sudah, saya kasih cara lengkapnya. Berikut langkah-langkah untuk menghilangkan pesan pencarian di blogger :

  1. Sign in ke blogger dengan ID anda.
  2. Klik Tata Letak.
  3. Klik tab Edit HTML.
  4. Klik tulisan Download Template Lengkap. silahkan di backup dulu biar aman.
  5. Cari kode seperti ini ]]></b:skin>
  6. simpan kode berikut di atas kode yang tadi :

     

    .status-msg-wrap{
    display:none;
    }

     

  7. Klik tombol Simpan Template.
  8. Selesai.

Jika anda sudah melakukan langkah-langkah di atas, maka langkah selanjunya tinggal ucapkan “bye bye dech loe”.

 

Cobain dech biar seru!

Sabtu, 06 September 2008

Elemen Halaman Mempunyai Fungsi Scroll

Menanggapi salah satu pertanyaan dari pembaca blog ini tentang “bagaimana cara membuat elemen halaman yang mempunyai fungsi scroll seperti milik kang Rohman tentang Blog Tutorial untuk pemula yang ada di bagian atas blog ini?” Jawabannya boleh di bilang sederhana, sebab untuk membuat halaman seperti itu tidaklah harus membuat kode html yang sangat banyak, melainkan hanya sedikit kode untuk membuatnya. Penasaran seperti apa kodenya, ini dia yang di maksud.

Untuk membuat halaman seperti itu, anda hanya membuat kode seperti ini :

<div style="overflow:auto;width:300px;height:200px;padding:10px;border:1px solid #eee">

isi halaman

</div>

Contoh :

 

<div style="overflow:auto;width:300px;height:200px;padding:10px;border:1px solid #eee">
<ol>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/bikin-blog.html"> Panduan membuat blog</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/cara-setting-blog.html">Cara setting blog</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/memilih-template.html">Memilih template</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/mengatur-hurup-dan-warna.html">Mengatur huruf dan warna</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/cara-memposting-artikel.html">Cara memposting artikel</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-read-more-1.html">buat Read more pada template klasik</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-text-area.html">Cara membuat Text Area</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-menu-dropdown.html">Cara membuat menu dropDown</a><li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/upload-gambar-dan-foto-profile.html">cara Upload foto</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-link-1.html">Cara membuat Link(1)</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-link-2.html">Cara membuat Link(2)</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-marquee.html">Cara membuat marquee (text berjalan)</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-refresh.html">Cara membuat efek Refresh</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/kode-html-tampil-di-posting.html">Kode HTML tampil pada postingan</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/masalah-posting-artikel.html">Masalah posting artikel</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/yahoo-messenger-emoticons.html">Simbol Yahoo! Emoticons</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/blogger-emoticons.html">Simbol Blogger Emoticons</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/pasang-jam-blog-di-sidebar.html">Cara Pasang jam </a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/membuat-banner-animasi.html">Cara membuat banner animasi</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/pasang-buku-tamu-di-sidebar.html">Cara membuat buku tamu</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/tutorial-html.html">HTML Tutorial</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/download-gratis.html">Free Download</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/membuat-foto-animasi.html">Foto animasi</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/pasang-statistik-tarcker.html">Cara pasang Statistik &amp; Tracker</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/ie-firefox-dalam-satu-komputer.html">Perlunya IE dan FireFox</a></li>
</ol>
</div>

 


Maka hasilnya akan seperti ini  :


 



 


Sedikit saya terangkan agar sedikit jelas.


 


Didalam kode tersebut, yang berperan besar adalah kode yang ada dalam style. Dengan style itulah kita bisa membuat apa yang kita inginkan. Berikut adalah perintah-perintah yang di pakai :


 


overflow:auto; » kode ini agar tercipta scrolling atau penggulung halaman apabila isi dari halaman tersebut sudah melampaui batas tinggi atau lebar yang telah di tentukan.


width:300px; »  adalah lebar bidang yang di inginkan, dalam hal ini adalah sebesar 300 pixel, nilai ini tentunya di sesuaikan dengan keinginan atau di sesuaikan dengan lebar sidebar yang ada. namun, agar selalu sesuai dengan sidebar maka sebaiknya memakai nilai 100% (width:100%).


height:200px; »  adalah tinggi bidang yang di inginkan, nilai ini bisa di ubah sesuai keinginan, misal jadi 250px atau nilai yang lainnya.


padding:10px; »  adalah kode pembuat jarak agar tulisan yang ada dalam halaman tersebut tidak menabrak dinding halaman, nilai ini tentu saja bisa di ubah sesuai keinginan. misal : padding:5px;


border:1px solid #eee  » agar bidang tersebut terlihat ada kotaknya, jika anda tidak menginginkan ada terlihat kotaknya, maka tinggal di hapus saja.


 


Selain kode-kode tersebut, tentu saja anda bisa menambahkan berbagai variasi sesuai dengan keinginan, misalkan backgroundnya berbentuk gambar, fontnya yang berbeda atau apa saja sesuai dengan keinginan anda.


Isi dari halaman tersebut tentu saja bukan hanya berisi link seperti yang kang Rohman contohkan, anda bisa mengisinya dengan yang anda inginkan. Misalkan tulisan biasa, gambar, iklan atau apa saja.


Saya masih bingung di mana nyimpen kode di atasss? hiksss…. seperti biasanya, anda tinggal masuk ke halaman dashbord » Rancangan » Elemen Halaman » Tambah Gadget » Pilih untuk JavaScript/HTML » Masukan kodenya » Simpan » selesai.


 


Selamat bereksperimen !

Rabu, 03 September 2008

Cara membuat Contact form / Kontak Kami

Akibat dari Kang Rohman memasang fasilitas kontak kami di blog ini, maka banyak sekali email masuk yang menanyakan bagaimana cara membuat contact form seperti itu. Hmmm.. gimana ya? lupa lagi dhenk, soalnya dulu tidak saya catat langkah-langkah nya… sebentar ya Kang Rohman ingat-ingat dulu .

Sebelum anda memasang kontak form di blog, ada baiknya mempertimbangkan baik dan buruknya terlebih dahulu. Salah satu kebaikan atau kelebihan dari mamasang fasilitas kontak form yaitu mempermudah pengunjung untuk mengirimkan pesan ke anda. Lalu kekukarangan atau keburukannya yaitu karena sangat mudahnya orang mengirimkan pesan, maka anda harus bersiap-siap kebanjiran email di inbox anda dan tentunya anda harus meluangkan waktu untuk membalasnya, betul tidaaakk? dan sekaian saja Kang Rohman mohon maaf kepada pengirim email yang belum sempat kang Rohman balas, karena banyak sekali email yang masuk sehingga belum sempat kang Rohman jawab semuanya.

Dimanakah kita bisa mendapatkan kontak form? di luar sana banyak sekali website yang menyediakan fasilitas ini, selain yang berbayar ada juga yang gratisan. Dan Kang Rohman sebagai  peramal masa depan sudah tahu isi kepala anda, pasti ingin tahu yang gratisan bukan? o’o….. kamu ketauan… suka gratisan… karna dirimu sama dengan aku . Web penyedia kotak form secara gratisan antara lain http://www.emailmeform.com, http://kontactr.com, http://www.zoho.com dan banyak lagi yang lainnya.

Kontak form yang kang Rohman pergunakan adalah kontak form dari http://www.emailmeform.com, dan agar seragam maka tutorial yang akan kang rohman terangkan adalah tentunya dari web ini. Masih ingin lanjut? berikut adalah langkah-langkah membuat sebuah kontak form :

 

  1. Silahkan kunjungi situs http://www.emailmeform.com.
  2. Arahkan pandangan anda ke sebelah kanan atas monitor.
  3. Klik pada tulisan Sign up for free.
  4. Isilah form yang ada dengan data diri anda :

     

    First Name : » isi dengan nama depan anda. Misal : jaka.

    Last Name  : »  isi dengan nama belakang anda. Misal : tingkir.

    Username   : » isi dengan username yang di inginkan. Misal : jaka25.

    Password    : » isi dengan kata kunci yang di inginkan. Misal : juralitjungkel.

    Retype Password : » isi dengan kata kunci yang tadi di isikan. Misal : juralitjungkel.

    Your Email  : » isi dengan alamat email anda. Misal : jakatingkir25@yahoo.com.

     

  5. Klik tombol Sign up.

  6. Setelah muncul tulisan terima kasih, silahkan cek email yang tadi di masukan oleh anda untuk memeriksa email verifikasi.

  7. Buka email kiriman dari EmailMeForm yang bertajuk Your new account information.

  8. klik link yang di berikan di email tersebut atau kalau tidak bisa, copy alamat URL tersebut lalu paste di address bar browser internet anda untuk melakukan verifikasi bahwa email yang tadi di masukan adalah benar-benar milik anda.

  9. Setelah proses verifikasi selesai, silahkan klik tulisan click here untuk menuju halaman akun kontrol panel anda.

  10. Alihkan perhatian anda ke sebelah kanan monitor. Klik tulisan Create new form.

  11. Ada beberapa form yang perlu di sisi :

     

    Web form Name : » isi dengan nama yang anda inginkan, atau biarkan saja (di sana sudah tertera Contact Webmaster).

    Recipients Emails : » isi dengan alamat email yang akan menerima pesan.

    Spam Email address : » isi dengan alamat email yang di inginkan untuk menerima pesan spam (email sampah, email iseng doank, email iklan, dll) atau kosongkan saja bila tidak mau menerima pesan email spam.

    Thank you page : » isi dengan alamat URL yang memuat tulisan terima kasih, contoh postingan yang ini. Atau jika bingung, tulis saja alamat blog anda.

    Number of fields : » biarkan 4 saja.

     

  12. Klik tombol next yang ada di sebelah kanan.

  13. Ada beberapa field name yang bisa di ganti sesuai keinginan, misal : Your Name jadi Nama, Your Email Address jadi alamat Email, dst. Atau biarkan saja seperti itu.

  14. Klik tombol next yang ada di sebelah kanan.

  15. Klik tombol next lagi.

  16. Silahkan isi dengan keinginan anda ( hehehe… cape kalau nerangin yang ini) atau biarkan saja seperti itu.

  17. Klik tombol next lagi.

  18. Klik tombol next lagi.

  19. Akan di perlihatkan contoh tampilan kontak form yang tadi di buat oleh anda.

  20. Klik tombol Finish.

  21. Klik tulisan Get the HTML codes.

  22. Copy kode yang ada di text area, di bawah tulisan Copy and paste this HTML code into your page. Lalu paste pada notepad atau text editor lainnya.

  23. Selesai.

 

 

Untuk membuat sebuah halaman kontak kami, anda tinggal membuat sebuah postingan seperti biasa. Untuk memasukan kode yang tadi di dapat dari EmailMeForm, anda pindah dulu dari menu compose ke Edit HTML lalu paste di situ. publish dech. Beres.

 

Selamat berbingung ria bagi yang masih bingung.

Twitter Delicious Facebook Digg Stumbleupon Favorites More