Kesulitan bahan untuk menulis di blog Anda? Buntu 'ilham' alias kosong inspirasi untuk update blog Anda? Tidak usah kuatir. Anda bisa nulis dalam waktu 10 menit setiap hari sambil makan siang di warteg (asal warteg-nya pake internet). Tidak usah pake ilham atau mood-mood-an segala. Tulis dg mudah dg cara praktis berikut ini:
1. Kunjungi salah satu blog yg Anda tahu.
2. Baca posting terbaru atau artikel yg Anda anggap menarik.
3. Login ke blog Anda, dan tanggapi tulisan di blog sebelah tsb. Panjang respons terserah Anda, satu atau dua paragraf, atau 10 paragraf tidak masalah. Blog kan milik sendiri.
4. Selesai. Lakukan hal yg sama setiap hari, setiap Anda online.
Oh ya, jangan lupa memuat live-link artikel yg Anda respons untuk menarik perhatian blogger yg ditanggapi. Cara buat live-link blog atau live-link artikel di blog lihat di sini. ***
http://kolom-mario.blogspot.com
Selasa, 18 September 2007
Sabtu, 08 September 2007
Membuat Read More Pada New Blogger
Untuk membuat "read more" atau juga kita bisa menggantinya dengan baca lanjutannya (terserah kita mau buat apa...) pada newbloggger template kita, hal pertama yang anda harus lakukan ialah memastikan "individual post page' -nya (permalink) dalam keadaan enable.
Ok kita mulai login dengan user blogger anda dan kemudian masuk ke Dashboard, Pilih blog mana yang akan diedit, kemudian klik SETTING, lalu ARCHIVING, dan pastikan pada bagian ENABLE POST PAGE settingnya pilih YES.
Langkah berikutnya klik template, (untuk menghindari hal-hal yang tidak diinginkan, sebaiknya backup dulu template lama anda) "DOWNLOAD FULL TEMPLATE" dan seandainya percobaan anda gagal anda akan bisa kembali ketemplate sebelumnya.
Kita lanjutkan, klik EDIT HTML, kemudian centang pada "Expand Widget Template", tunggu beberapa saat hingga tempalate ditampilkan secara penuh.
Pada template editor anda lihat kode berikut ini (agar tidak ribet copy paste dulu code HTML template anda kedalam Teks Editor, kalau saya biasanya menggunakan NotePad, dan pada menu find masukkan codenya untuk melakukan pencarian, setelah selesai edit anda hanya tinggal copy paste kembali kedalam template editor blogger anda)
<div class='post-body'>
setelah kode diatas taruh kode ini dibawahnya:
<!-- post summary hack begin -->
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<!-- post summary hack end -->
sekarang mari kita lihat kode berikutnya yang ada dibawahnya:
<p><data:post.body/></p>
letakkan kode ini dibawahnya:
<!-- post summary hack begin -->
<a expr:href='data:post.url'>Read More......</a>
</b:if>
<!-- post summary hack end -->
setelah meletakkan dua kode tersebut maka susunannya akan seperti ini:
<div class='post-body'>
<!-- post summary hack begin -->
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<!-- post summary hack end -->
<p><data:post.body/></p>
<!-- post summary hack begin -->
<a expr:href='data:post.url'>Read More......</a>
</b:if>
<!-- post summary hack end -->
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
Kode yang berwarna hitam adalah kode yang sudah ada didalam template dan yang berwarna hijau adalah kode yang baru saja anda tambahkan.
Satu langkah terakhir yang perlu anda lakukan ialah, ketika sedang menulis posting anda letakkan kode ini dimana anda mau memulai pemotongan posting anda:
<span class="fullpost">
dan pada akhir pos anda akhiri dengan tag ini:
</span>
Jika anda ingin lebih mudah Clik SETTING > FORMATTING dan pada POST TEMPLATE Masukkan kode ini:
Tulis Ringkasan Postingan Anda
<span class="fullpost">
Tulis Akhir Postingan Anda
</span>
Kemudian klik save setting!!
(oh ya anda bisa mengganti Read More..... menjadi Apapun terserah anda)
Setelah semuanya suda selesai anda lakukan klik SAVE TEMPLATE pada menu editor.
Selamat mencoba, smoga berhasil!! :)
http://telorceploq.blogspot.com
Ok kita mulai login dengan user blogger anda dan kemudian masuk ke Dashboard, Pilih blog mana yang akan diedit, kemudian klik SETTING, lalu ARCHIVING, dan pastikan pada bagian ENABLE POST PAGE settingnya pilih YES.
Langkah berikutnya klik template, (untuk menghindari hal-hal yang tidak diinginkan, sebaiknya backup dulu template lama anda) "DOWNLOAD FULL TEMPLATE" dan seandainya percobaan anda gagal anda akan bisa kembali ketemplate sebelumnya.
Kita lanjutkan, klik EDIT HTML, kemudian centang pada "Expand Widget Template", tunggu beberapa saat hingga tempalate ditampilkan secara penuh.
Pada template editor anda lihat kode berikut ini (agar tidak ribet copy paste dulu code HTML template anda kedalam Teks Editor, kalau saya biasanya menggunakan NotePad, dan pada menu find masukkan codenya untuk melakukan pencarian, setelah selesai edit anda hanya tinggal copy paste kembali kedalam template editor blogger anda)
<div class='post-body'>
setelah kode diatas taruh kode ini dibawahnya:
<!-- post summary hack begin -->
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<!-- post summary hack end -->
sekarang mari kita lihat kode berikutnya yang ada dibawahnya:
<p><data:post.body/></p>
letakkan kode ini dibawahnya:
<!-- post summary hack begin -->
<a expr:href='data:post.url'>Read More......</a>
</b:if>
<!-- post summary hack end -->
setelah meletakkan dua kode tersebut maka susunannya akan seperti ini:
<div class='post-body'>
<!-- post summary hack begin -->
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<!-- post summary hack end -->
<p><data:post.body/></p>
<!-- post summary hack begin -->
<a expr:href='data:post.url'>Read More......</a>
</b:if>
<!-- post summary hack end -->
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
Kode yang berwarna hitam adalah kode yang sudah ada didalam template dan yang berwarna hijau adalah kode yang baru saja anda tambahkan.
Satu langkah terakhir yang perlu anda lakukan ialah, ketika sedang menulis posting anda letakkan kode ini dimana anda mau memulai pemotongan posting anda:
<span class="fullpost">
dan pada akhir pos anda akhiri dengan tag ini:
</span>
Jika anda ingin lebih mudah Clik SETTING > FORMATTING dan pada POST TEMPLATE Masukkan kode ini:
Tulis Ringkasan Postingan Anda
<span class="fullpost">
Tulis Akhir Postingan Anda
</span>
Kemudian klik save setting!!
(oh ya anda bisa mengganti Read More..... menjadi Apapun terserah anda)
Setelah semuanya suda selesai anda lakukan klik SAVE TEMPLATE pada menu editor.
Selamat mencoba, smoga berhasil!! :)
http://telorceploq.blogspot.com
Cara Membuat Marquee
Apabila Anda melihat link atau teks yg bergerak di sidebar blog ini, itu namanya marquee (baca, marki). Program html marquee ini berguna bukan saja untuk menarik tamu yg datang agar memperhatikan apa yg tertulis di dalamnya tapi juga berfungsi untuk menghemat ruang (space) sidebar kita sehingga lebih efektif dan efisien. Bagaimana cara membuat marquee?
Cara membuatnya mudah. Cukup Anda copy dan paste code html berikut ke sidebar blog atau di manapun sesuai keinginan Anda:
Contoh Marquee untuk link (copy & paste dan ganti contoh link sesuai keinginan Anda):
1. Kode
2. Kode
Contoh Marquee untuk teks:
Catatan: Jangan lupa untuk menyelipkan kode
TIP PENTING : tag atau kode: direction="up" artinya tulisan/teks bergerak ke atas seperti di blog ini, jadi kode "up" bisa diganti dg "down" bila ingin link/teks bergerak ke bawah; dan ganti menjadi "left" supaya bergerak ke kiri dan "right" supaya bergerak ke kanan.
Salam nge-Blog!
http://kolom-mario.blogspot.com
Cara membuatnya mudah. Cukup Anda copy dan paste code html berikut ke sidebar blog atau di manapun sesuai keinginan Anda:
<MARQUEE align="center" direction="up" height="200" scrollamount= "2" onmouseover='this.stop()' onmouseout='this.start()' width="100%">(teks atau link tulis di sini)</MARQUEE>
Contoh Marquee untuk link (copy & paste dan ganti contoh link sesuai keinginan Anda):
<MARQUEE align="center" direction="up" height="200" scrollamount= "2" onmouseover='this.stop()' onmouseout='this.start()' width="100%">
<a href="http://afsyuhud.blogspot.com" target="new">- Blogger Indonesia -</a><br />
<a href="http://scholarshipz.blogspot.com" target="new">- International Scholarship -</a><br />
<a href="http://karirkerja.blogspot.com" target="new">- Job Vacancy Indonesia -</a><br />
<a href="http://infokerjas.blogspot.com" target="new">- Info Lowongan Kerja -</a><br />
<a href="http://infokerjas.blogspot.com" target="new">- Beasiswa Indonesia Scholarship -</a><br />
<a href="http://beasiswas.blogspot.com" target="new">- Informasi Beasiswa Indonesia -</a><br />
</MARQUEE>
1. Kode
<br /> adalah singkatan dari (line) break atau ganti garis, supaya setiap link tidak numpuk dalam satu baris. Bila jarak satu link dg link yg lain dianggap terlalu sempit, bisa ditambah dg kode <br /> lagi. Sesuai selera.2. Kode
target="new" atau target="_blank" berfungsi agar supaya tercipta window baru ketika ada yg mengklik link yg ada dalam marquee sehingga pengunjung tidak meninggalkan blog Anda.Contoh Marquee untuk teks:
<MARQUEE align="center" direction="up" height="200" scrollamount= "2" onmouseover='this.stop()' onmouseout='this.start()' width="100%">
Mengutip sebagian atau keseluruhan isi blog ini ke blog Anda dipersilahkan ASAL menyebut URL sumber tulisan dan/atau permanent link artikel yg dikutip.<br />
Komentar, saran atau pertanyaan dapat diajukan melalui bukutamu, kotak komentar blog atau email ke: mario.gagho-at-gmail.com.</MARQUEE>
Catatan: Jangan lupa untuk menyelipkan kode
<br /> untuk ganti garis atau paragraf.TIP PENTING : tag atau kode: direction="up" artinya tulisan/teks bergerak ke atas seperti di blog ini, jadi kode "up" bisa diganti dg "down" bila ingin link/teks bergerak ke bawah; dan ganti menjadi "left" supaya bergerak ke kiri dan "right" supaya bergerak ke kanan.
Salam nge-Blog!
http://kolom-mario.blogspot.com
Cara Buat Logo Dan Banner
Bagi yg bisa program photoshop, membuat banner dan badge/chicklet itu mudah. Bagi yg agak males latihan otak-atik photoshop seperti saya tidak usah kuatir. Di internet banyak penyedia program pembuat chicklet dan banner online secara gratis dan instan. Sebagai pembuka, logo atau chicklet adalah banner kecil yg biasa buat link-button seperti yg di sidebar blog saya. Sementara banner ukurannya lebih besar dan biasa ditaruh di header blog/website. Ikuti panduan buat logo/chicklet/banner berikut:A. Cara Membuat Chicklet
1. Kunjungi http://button.blogflux.com/
2. Di LEFT-BLOCK (bagian kiri atas) ada menu "Text", ganti tulisan "w3c" sesuai dg yg Anda inginkan. Contoh, tulis Blog;
3. Di RIGHT-BLOCK (bagian kanan atas) ada menu "Text", ganti tulisan "xhtml" dg yg sesuai dg keinginan Anda, contoh, "Tutorial"
4. Di GENERATE-BUTTON (bagian kanan bawah) klik tulisan Generate Button. Maka akan muncul chicklet seperti ini:
5. Nah, arahkan mouse ke gambar, klik kanan --> save picture as --> kasih nama file (contoh: blog-tutorial --> save di komputer Anda.
6. Setelah di saving di komputer, masukkan / upload gambar chicklet tsb di situs online seperti geocities.com atau googlepages.com. Dalam kasus saya, saya menyimpannya di http://mario.gagho.googlepages.com/ jadi alamat chicklet saya tsb. adalah http://mario.gagho.googlepages.com/ blog-tutorial.gif
7. Setelah tersimpan secara online, Anda bisa gunakan sesuai kebutuhan Anda seperti untuk linkbutton tukar link dg teman-teman blogger lain, atau sekedar buat pajangan di sidebar.
Tip: bentuk font dan background warna dapat dirubah sesuai selera. Tinggal klik menu "color" dan "background" di situs di atas.
B. Cara Buat Banner Online
1. Kunjungi situs http://cooltext.com/
2. Klik menu DESIGN A LOGO (bagian atas).
3. Di menu CHOOSE A LOGO DESIGN pilih gambar yg Anda suka, contoh, klik EMBOSSED.
4. Di menu LOGO TEXT saya tulis "Blog Tutorial"
5. Klik menu RENDER LOGO DESIGN (bagian paling bawah).
6. Save ke komputer, maka akan tampil gambar seperti di bawah ini:
7. Setelah itu upload ke geocities.com atau googlepages.com milik Anda. (lihat poin A.5 dan A.6).
Tip: Untuk memasang banner di header blog, pake kode berikut, jangan lupa ganti alamat link URL-nya dg URL Anda:
<a href="http://mario.gagho.googlepages.com/blogtutorial.jpg"><img src="http://mario.gagho.googlepages.com/blogtutorial.jpg" /></a>
Untuk contoh banner di header, lihat di blog ini.
Catatan:
Apabila Anda ingin tukar link pake chicklet/banner dg blog lain seperti blog ini (lihat di sidebar kanan atas), berikut contoh kodenya. Ganti alamat URL blog dan imagenya dg punya Anda.
<h2 class="sidebar-title"><b>Link to Us We'd Link You Back</b></h2>
<ul>
<img src="http://fatihsyuhud.googlepages.com/blog-indonesia.gif" border="0"></a>
<br />
<li>Copy the code below, insert in to your blog </li></font>
<br />
<textarea name="code" rows="4" cols="18"><a href="http://afsyuhud.blogspot.com" target="_blank"><img src="http://fatihsyuhud.googlepages.com/blog-indonesia.gif" border="0" alt="Blogger Indonesia"></a>
Salam ngukir blog! :)
http://kolom-mario.blogspot.com
Horizontal Blog Roll On New Blogger
Bila kita terbiasa menemukan blogroll (kumpulan tautan) dibagian footer (bawah), maka bagi pengguna layanan blogger baru kita akan menemukan penyajian yang berbeda. Perbedannya terletak pada pengurutannya yang kebawah. Bisa sangat tidak indah dipandang bila pengalokasiannya di bagian footer. Mungkin dari awal Blogger sengaja menyajikan widget ini untuk dipasang di sidebar. Maka tepatlah bila pengurutan tautannya menjadi terurut dari atas ke bawah. Bukan pengurutan abjad yang dimaksudkan disini. Hanya penyajian penampilan saja yang dimunculkan secara vertikal. Berikut visualisasi untuk lebih membantu mencerahkan.
Tampilan Vertikal
tampilan Horisontal
Untuk mendapatkan pengurutan yang horisontal di bagian footer, maka kita perlu melakukan penyetelan dibagian Edit HTML. Berikut langkah yang perlu dilakukan.
Langkah 1. Masuk ke bagian Edit HTML.
Tak lupa untuk mencentang kotak di samping Expand Widget Templates .
Cari kode berikut :
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
Perhatikan di bagian yang tertulis warna merah. Setelah menemukan bagian yang dimaksud, hapus kode-kode yang ditunjukan oleh warna merah di atas. Dan simpan.
Langkah 2. Upsss...tak ada langkah lagi...maaf :)
Tapi bagi yang ingin melangkah lebih jauh dengan menampilkan tautan di bagian ini menjadi berhuruf kecil, sila tengok bagian ini di bagian CSS. Masih sama dengan langkah sebelumnya, klik Edit HTML dan tak lupa centang expand widget.
#footer .widget {
background:url("http://www.blogblog.com/harbor/divider.gif") no-repeat center top;
margin:0;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
}
Nah perhatikan kembali kata yang tertulis warna merah. Ubah kata tadi dengan lowercase. Beres.
http://edittag.blogspot.com
Tampilan Vertikal
tampilan Horisontal
Untuk mendapatkan pengurutan yang horisontal di bagian footer, maka kita perlu melakukan penyetelan dibagian Edit HTML. Berikut langkah yang perlu dilakukan.
Langkah 1. Masuk ke bagian Edit HTML.
Tak lupa untuk mencentang kotak di samping Expand Widget Templates .
Cari kode berikut :
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
Perhatikan di bagian yang tertulis warna merah. Setelah menemukan bagian yang dimaksud, hapus kode-kode yang ditunjukan oleh warna merah di atas. Dan simpan.
Langkah 2. Upsss...tak ada langkah lagi...maaf :)
Tapi bagi yang ingin melangkah lebih jauh dengan menampilkan tautan di bagian ini menjadi berhuruf kecil, sila tengok bagian ini di bagian CSS. Masih sama dengan langkah sebelumnya, klik Edit HTML dan tak lupa centang expand widget.
#footer .widget {
background:url("http://www.blogblog.com/harbor/divider.gif") no-repeat center top;
margin:0;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
}
Nah perhatikan kembali kata yang tertulis warna merah. Ubah kata tadi dengan lowercase. Beres.
http://edittag.blogspot.com
Memilih Desain Blog
Desain atau template memang bukan segala-galanya bagi kesuksesan sebuah blog. Tetapi sembarang desain akan mengaburkan tujuan blog itu sendiri dan ujung-ujungnya berpengaruh terhadap kuantitas dan intensitas pengunjung yang dituju.
http://www.thegadgetnet.com
Tips dan pertimbangan dalam memilih desain blog — salah satu faktor yang membuat sebuah blog berhasil menciptakan komunitas pembacanya sendiri.
1. Identifikasi tujuan situs blog. Blog apa yang ingin Anda buat? Blog yang khusus tentang musik, film, kuliner, politik, gadget, travel, bisnis atau mode? Apapun tujuan Anda, yang penting rumuskan dulu dengan baik.
2. Identifikasi kebutuhan spesifik blog Anda. Jika tujuannya sudah dirumuskan, bisakah lebih Anda pertajam lagi? Misalnya, Anda ingin membuat blog tentang politik, fine, tapi apanya? Apakah jurnal tentang politik? Tokoh-tokoh politik — profilnya atau omongannya atau kutipannya? Referensi-referensi tentang ilmu politik? Semakin tajam, niche blog akan akan semakin kelihatan.
3. Identifikasi audiens Anda. Siapa pembaca yang Anda bidik? Mahasiswa? Akademisi? Umum? ABG? Ibu-ibu? Gamer?
4. Fokus tampilan blog. Apakah blog Anda akan lebih fokus pada teks atau gambar/foto/video? Jika yang akan dipilih adalah kombinasi, mana yang paling dominan?
Coba rumuskan kebutuhan visualnya.
- Topik “berat”. Blog dengan topik-topik serius seperti politik atau jurnal, desainnya bisa menggunakan tema-tema konservatif, elegan, simple dan seterusnya. Sebaiknya jangan memilih warna yang terlalu rame.
- Topik “sedang”. Misalnya untuk blog tentang travel atau kuliner, Anda bisa memilih desain-desain yang inspiratif plus warna-warna cerah. Pertimbangkan juga desain di mana foto-foto yang akan Anda pajang tetap “match” dengan karakter desainnya.
- Topik “ringan”. Blog tentang musik, game, anak muda dan seterusnya. Desain yang rame dan warna-warna ngejreng layak dipilih. Bisa menggunakan tema-tema ekstrem, unik atau “brutal”.
Pembagian “berat”, “sedang” dan “ringan” ini hanya sekadar contoh saja. Ini penting menjadi pertembangan. Sebab, jangan sampai blog dengan topik “berat” menggunakan warna yang ngejreng, sedangkan blog “ringan” menggunakan tema konservetif.
5. Pilih desain yang tepat. Ada ratusan — kalau bukan ribuan — template-template desain gratisan yang bertebaran di blogosfer: tinggal pilih dan jangan lupa sesuaikan tujuan dan pertimbangan di atas.
Berikut adalah beberapa penyedia blog template gratis :- http://www.bloggertemplates.org
- http://freetemplates.blogspot.com
- http://blogger-templates.blogspot.com
http://www.thegadgetnet.com
Rabu, 08 Agustus 2007
Widget Links
http://www.bloggersblog.com
Langganan:
Postingan (Atom)