Cara buat "Readmore" pada Blogger

Banyaknya permintaan mengenai cara buat readmore membuat saya tetap
mengharuskan artikel ini ditulis. walaupun tutorial cara buat readmore sudah
banyak ditulis oleh rekan blogger, sayangnya penjelasan yang diberikan kadang
tidak mudah dimengerti dan malah membuat bingung, untuk itu tidak ada salahnya saya juga menulis
artikel ini sebagai pelengkap agar mempermudah blogger baru bisa lebih mengerti
cara membuat readmore serta cara penggunanan kode readmore pada
posting.

Mungkin rekan blogger yang baru mulai membuat blog masih bingung apa itu readmore?
Readmore adalah pemenggalan kalimat pada posting suatu halaman, Pemenggalan
halaman posting biasanya ditandai dengan "Read More", "Next",
"Baca
Selanjutnya", "Baca berikutnya", "Selengkapnya" atau apalah
namanya :).
Readmore biasanya digunakan untuk menandai bahwa kalimat pada posting
masih mempunyai kelanjutan, dan juga berguna mempersingkat halaman posting yang
panjang. Pengen tau cara buatnya?

Contoh ReadMore :

Pernah menemukan pesan seperti diatas?...jika pernah jangan panik, ini hanya pesan pemberitahuan dari blogger kalau layanan sedang melakukan perbaikan maintenance pada server. pesan ini hanya berlangsung kurang lebih beberapa menit setelah itu akan normal kembali. Semoga informasi ini membantu :)Readmore.. »

Untuk membuat readmore ikuti langkah dibawah ini :

Langkah Pertama:

Buka Template - Edit HTML - Berikan
tanda centang pada "Expand widget template"

Langkah Kedua:

Jangan Lupa backup blogger dengan mengklik "dowlnoad template lengkap"

Langkah Ketiga:

Cari kode dibawah ini:

<div
class='post-header-line-1'/> <div class='post-body'>

Tips :
Untuk mempermudah pencarian kode diatas sebaiknya ikuti tips berikut
ini. pertama kamu buka program text editor misalnya notepad.exe ( Pada MS
Windows tekan menu Start -> Proggram -> Accessories ->
Notepad) kemudian kopy/paste kode HTML tadi ke notepad. kemudian pada
notepad pilih Menu Edit -> Find. pada box find masukan kode ini <div class='post-header-line-1'/> kemudian
klik tombol Find next. (jika masih gak ketemu terpaksa kita melakukan
pencarian secara manual)

Jika sudah menemukan kode diatas, Copy-Paste kode dibawah ini kemudian
letakan kode tersebut dibawah kode diatas.

 

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

<style>.fullpost{display:inline;}</style>

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

<b:else/>

<style>.fullpost{display:none;}</style>

Kemudian dibawah kode diatas kita akan menemukan
kode:

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

Lakukan Copy-Paste kode dibawah ini dibawah code
diatas

<a expr:href='data:post.url'>Readmore

»»</a>

</b:if>


 

Tips: Kode
Readmore diatas bisa ganti dengan kalimat sendiri (contoh "Baca
Selanjutnya", "Baca berikutnya", "Selengkapnya")

Kode selengkapnya jika dilihat akan tampak sebagai berikut:

<div class='post-header-line-1'/>

<div class='post-body'>

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

<a expr:href='data:post.url'>Readmore

»»</a>

</b:if>

<div style='clear: both;'/>

Jika kita mengedit langsung pada halaman blogger Edit HTML dan semua kode diatas
sudah dilakukan perubahan, jangan lupa disimpan ya :)

Ini jika kita menggunakan Text Editor Notepad : Setelah melakukan pengeditan kode pada notepad, lalu hapus semua kode yang
ada pada halaman edit blogger, kemudian masukan seluruh kode pada notepad tadi
dengan cara copy/paste) Sampai disini pengeditan kode selesai, jangan lupa
disimpan.

Langkah Empat

Setelah kode diatas disimpan kita kembali dan masuk ke tab Pengaturan
-> Format -> cari "Post Template" Kemudian pada kotak masukan kode
dibawah ini

<div class="fullpost">

</div>

Jangan lupa disimpan :)

Langkah Kelima :

Disini saya akan menjelaskan cara penggunaan readmore pada halaman posting.
Ketika kita melakukan posting pertama kali kita akan melihat kode:

<div class="fullpost">

</div>

ingat jangan hapus kode diatas karena kode tersebut merupakan kode yang akan
kita gunakan dalam pemenggalan posting nantinya.

Sebagai contoh lihat cuplikan kalimat dibawah:

Tips of the day merupakan tips singkat yang akan disampaikan kepada pengunjung seriap hari, Tips ini bisa berisi apa saja, bisa berupa Tips Bisnis, Tips memasak, Tips merawat mobil, Tips money online, Tips bercinta atau apalah terserah :), Asal jangan tips blogging karena dah punya om hehehe (emang siapa om ya :). (Dini rencana text yang akan dipenggal) Sebenarnya Tips of the day disini cuma istilah saja...tips yang akan kita buat nanti bukan disampaikan setiap hari melainkan tips ini akan berganti ketika pengunjung melakukan refresh atau reload pada halaman blog.

Bagaimana cara pemenggalan kode diatas? caranya tinggal kamu
lihat 2 kode pemenggalan kalimat dibawah (ingat kode hanya bekerja pada
halaman editor posting)

Tips of the day merupakan tips singkat yang akan disampaikan kepada pengunjung seriap hari, Tips ini bisa berisi apa saja, bisa berupa Tips Bisnis, Tips memasak, Tips merawat mobil, Tips money online, Tips bercinta atau apalah terserah :), Asal jangan tips blogging karena dah punya om hehehe (emang siapa om ya :). <div class="fullpost"> Sebenarnya Tips of the day disini cuma istilah saja...tips yang akan kita buat nanti bukan disampaikan setiap hari melainkan tips ini akan berganti ketika pengunjung melakukan refresh atau reload pada halaman blog.</div>

Jadi hasil posting pada halaman browser akan tampai sebagai
berikut:

Tips of the day merupakan tips singkat yang akan disampaikan kepada pengunjung seriap hari, Tips ini bisa berisi apa saja, bisa berupa Tips Bisnis, Tips memasak, Tips merawat mobil, Tips money online, Tips bercinta atau apalah terserah :), Asal jangan tips blogging karena dah punya om hehehe (emang siapa om ya :). Readmore »»

Selamat mencoba :) happy blogging

Sebagai pelengkap Baca juga artikel dibawah ini :

Rahasia (read more) waktu yang tepat memenggal tulisan halaman posting

Cara buat "Random Image Header" pada Blogger

Random image header pada blogger sebenarnya bisa kita ganti secara
otomatis setiap kali halaman di Refresh atau di Reload.  Tujuan tutorial
kali ini tentu tetap membuat blog kita tampil lebih bergaya dan punya warna
warni tersendiri. Selain membuat blog terlihat lebih hidup juga berguna
menghilangkan rasa bosan pengunjung ketika mengunjungi blog kita, agar blog
tidak monoton kita perlu menambahkan Random image header ini. pengen tau
cara buatnya..

 

Cara pasang image pada blogger:

 

Buka  Template -> Edit HTML

 

Cari kode <b:skin><![CDATA[

 

Kemudian Copy kode dibawah ini, letakan (paste) kode tersebut dibawah kode
diatas, kemudian simpan dan lihat hasilnya.

 

</script>

<script type='text/javascript'>

var gambar= new Array()

gambar[0]="http://alamat_url_gambar1"

gambar[1]="http://alamat_url_gambar2"

var acak=Math.floor(
2
*Math.acak());

document.write("<style>");

document.write("#header {");

document.write(' background:url("' + gambar[acak] + '") no-repeat top left ;');

document.write(" }");

document.write("</style>");

</script>

 

Gimana seandainya ada 5 atau lebih image?

 

</script>

<script type='text/javascript'>

var gambar= new Array()

gambar[0]="http://alamat_url_gambar1"

gambar[1]="http://alamat_url_gambar2"

gambar[2]="http://alamat_url_gambar3"

gambar[3]="http://alamat_url_gambar4"

gambar[4]="http://alamat_url_gambar5"

var acak=Math.floor(
5 *Math.acak());

document.write("<style>");

document.write("#header {");

document.write(' background:url("' + gambar[acak] + '") no-repeat top left ;');

document.write(" }");

document.write("</style>");

</script>

 

Info: http://alamat_url_gambar =>
ini merupakan alamat gambar, caranya
arahkan alamat URL dimana tempat gambar kamu disimpan

 

Selamat mencoba :)

Cara pasang icon komentar sebelum link "posting sebuah komentar"

Om gimana cara pasang icon komentar sebelum link
"posting sebuah komentar"?

Pertanyaan diatas pernah ditanyakan oleh sahabat blogger di shoutbox yaitu
bagaimana cara pasang icon komentar sebelum link "posting sebuah komentar"?
untuk menjawab pertanyaan ini agar gak bingung kamu bisa melihat gambar dibawah:

Dari gambar diatas bisa dilihat icon komentar ini sangat
berguna sekali. Kenapa kita perlu memasang icon ini, jujur..untuk standar
blogger link "posting sebuah komentar" sangat membingungkan apalagi jika link komentar tersebut nyempil dibawah komentar dan tidak kelihatan, agar
para pengujung dimudahkan memberi komentar ada baiknya icon ini kita pasang.



Ikuti langkah dibawah untuk memasang icon komentar:



Pertama:

Jangan lupa lakukan backup template



Kedua:

Masuk ke Template -> Edit html - > beri tanda cek pada Expand
Template Widget



Ketiga:

Cari kode Dibawah ini :

 <p class='comment-footer'>

<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
</a>

</p>

</b:if>

Kemudian sebelum tag </a> kita masukan kode dibawah
ini :



<b><font color='#444'>

<img alt='Buat sebuah Komentar' border='0' height='47' src='http://www.geocities.com/oom_directory/images/comments.gif'
width='61'/>

<data:postCommentMsg/></font></b>



Code diatas bisa kita edit sesuai keinginan, misalnya kita ingin mengganti icon
milik sendiri, caranya cukup ganti alamat Url yang berwarna merah diatas dan
ganti dengan alamat dimana icon tersebut disimpan.



Keempat:

Simpan dan lihat hasilnya

Informasi : Ada perubahan nama domain

Mulai hari ini alamat blog http://o-om.blogspot.com pindah ke
http://www.o-om.com
bagi sahabat yang sudah memasang banner link atau text link saya, tidak perlu menghapus linknya ya,
karena alamat URL lama masih berfungsi dan tetap akan menuju ke alamat URL yang baru.
namun jika sahabat mau meluangkan waktunya sedikit untuk mengubah nama url saya sangat berterima kasih sekali.

Bagi yang mau merubah link banner lama ke yang baru bisa gunakan kode dibawah
atau klik install link otomatis ke blogger:

<a href="http://www.o-om.com" target="_blank"><img border="0" alt="http://www.o-om.com" width="84" src="http://www.geocities.com/oom_directory/images/oom_link.gif" height="16"/></a>

<a href="http://www.o-om.com" target="_blank"><img border="0" alt="http://www.o-om.com" width="84" src="http://www.geocities.com/oom_directory/images/oom_link.gif" height="16"/></a>

Cara buat gambar menjadi kartun

IntoCartoon Pro V3.0 - Profesional Edition, merupakan software
yang dikhususkan untuk mengubah gambar biasa menjadi gambar kartun. Menurut saya
software ini cukup menarik di banding tools sejenis, ini bisa dilihat dari
tingkat kemudahan penggunaan dan kelengkapan pengaturan pada gambar yang akan
dibuat kartun, saat tulisan ini dibuat saya menggunakan versi 3.0 yang telah
direlease pada tanggal 1 November 2007. kunjungi situs-nya di

http://www.intocartoon.com/index.html 

New features:

. A new algorithm for color reduction.

. A new algorithm for sharping lines.

. A fast algorithm for blur.

. Added "Blur" to the Adjustments menu.

. Supports Microsoft Vista.

Ajarin dikit cara buatnya dong om? ok, cara cepat aja ya..om juga masih belajar
memaksimalkannya :)

4 langkah mudah membuat gambar biasa menjadi gambar kartun:

Pertama

Pilih Menu File -> Open -> pilih gambar yang akan dijadikan kartun



Kedua

Pilih menu Cartoon -> disini kamu bisa melakukan pengaturan sendiri pada
Into Cartoon atau langsung menggunakan bisa menggunakan 4 shortcut yang telah tersedia



Ketiga

Untuk pengaturan lebih lanjut kamu bisa pilih menu Adjustments kemudian pilih
salah satu pengaturan misalnya melakukan Contrast



Keempat

Apalagi ya..ya disimpan dah :)



Contoh gambar om yang dibuat kartun:

Gambar yang di ubah ke bentuk kartun





Gambar kartun mode Canvas

Gambar diatas tentu belum maksimal..yang menjadi keliatan bagus kan memang orangnya kren...huewwkkk..huewwkkk...PD BGT ya hehehe, om yakin kalian bisa mengedit lebih baik lagi :)



Software bisa di Download dialamat ini:

 

Download disini

 

Software sudah lengkap tinggal di install dan di pakai saja.
thanks

 

Widget Installer Generator for Blogger (V1.00 - Beta) by O'om

"Tool baru buatan oom, tool ini berguna untuk mempermudah membuat proses
widget installer pada blogger"




Pasti rekan sahabat sudah mengetahui button installer untuk blogger dimana button ini jika diklik
akan melakukan installasi otomatis ke blogger,
Saya yakin sebagian blogger sudah bisa membuat installasi ini,
namun bagaimana jika belum pernah berkenalan sama sekali dengan coding HTML atau
javascript? pasti akan bingung cara buat coding intallasinya. Nah untuk itu tool
"Widget Installer Generator for Blogger v1.00 - beta" saya ciptakan (saya buat).
Software ini bisa dikatakan sederhana namun manfaat dan kemudahan yang didapat
akan melebihi kesederhanaan tool ini. Agar mudah mempelajari tool ini saya buat
se User Friendly mungkin. Please... jangan kritik mengenai tampilan
ya..harap maklum tools ini saya buat dalam waktu singkat jadi terlihat
asal jadi :)

Apa saja kemudahan dalam tool ini :

1. Tanpa proses installasi yang rumit, hanya dengan melakukan ekstract dengan
program unzip (winzip atau winrar) tool nya langsung bisa dijalankan.

2. Karena file nya terhitung kecil hanya 1,1 MB (sudah termasuk VB6 runtime)
jadi bisa dibawa kemana saja dengan flash disc (apalagi yang main diwarnet).

3. Kemudahan yang lain bisa dicoba sendiri ya..saya bilang mudah karena saya
yang buat hehehe, namun belum tentu kalian juga bilang mudah but di coba aja
dulu.

4. Karena baru versi beta alias baru uji coba tentu masih banyak kekurangan,
jadi saya perlu masukan yang banyak dari teman semua.

5. Tools ini bisa digunakan secara offline, alangkah baiknya jika digunakan
ketika sedang online mengingat proses uji cobanya langsung ke blogger.



Cara Penggunaan Program:



Agar mudah saya jelaskan dengan gambar aja ya :)








Gambar 1

Ini merupakan judul witget yang nantinya akan tampak sesudah proses instalasi.
Kamu bisa memasukan kalimat apa saja yang sekiranya sesuai (contoh: Oom widget).
oh iya judul ini juga dapat diubah pengguna lain ketika melakukan instalasi ke
blogger, jadi sifatnya tidak permanent.







Gambar 2

Ini merupakan text dalam button caption, kamu bisa masukan kalimat apa saya (misalnya
"install link otomatis keblogger")







Gambar 3

Url banner atau logo bisa kamu masukan sebagai logo indentitas pemilik installer
ketika pengguna lain melakukan installasi pada blognya, sebenarnya gak terlalu
berguna sih. tapi jika dirasa perlu kamu bisa memasangnya. yang harus diingat
kamu harus mengalamatkan ke url dimana gambar kamu disimpan secara online.







Gambar 4

Nah ini agak rumit sedikit..yang jelas kamu harus ngerti code html yang akan
dimasukan dalam paket installasi. tidak usah berpikir telalu jauh..cukup
Copy/Paste aja kodenya misalnya code link banner punya mu..beres khan :)

Sebenarnya disini letak utama tools ini..bagi kamu yang
udah ngerti code Html/Javascript kamu bisa memasukan code apa saja kedalam paket
kode installasi..bisa berupa link gambar, alamat code widget milikmu misalnya
"link banner" , "recent comment" , "recent post" , "Alamat RSS Feed " dan
lain-lain, kalo mau sekalian aja script google adsense punyamu kali aja ada yang
mau pasang di blognya :)





Gambar 5

Disini kamu dapat mengatur letak text dan button misalnya rata tengah , rata
kanan dan...kayanya ga usah jelasin ya, saya yakin kamu udah mengerti.





Gambar 6

Kamu dapat menambah text tambahan diatas button installasi, text ini akan
memberikan informasi kepada pengunjung mengenai apa yang akan mereka installasi.
Selain itu saya tambahkan beberapa standar pengaturan text Html agar lebih rapi,
disini saya sertakan juga pilihan pada text.







Gambar 7

Disini proses paket intallasi dibuat, jika sudah melakukan proses text input,
settings warna dan pengaturan yang lain kamu dapat menekan langsung tombol ini
untuk membuat widget installer.





Gambar 8

Bersihkan -> Hanya digunakan untuk meng clear semua text yang ada dalam semua
textbox dengan satu tombol.





Gambar 9

Sebelum kamu melakukan Copy/Paste coding installer pada blog ada baiknya kamu
melihat hasilnya terlebih dahulu jika ada kesalahan atau kurang sreg kamu bisa
memperbaikinya codenya.





Gambar 10

Sebelum dipasang pada blog sebaiknya kamu bisa mencoba dulu proses instalasi nya,
untuk mencoba proses instalasi saya menggunakan engine Internet Explorer. cara
mencobanya cukup mudah, cukup klik aja button installer yang dibuat, trus kamu
akan masuk kedalam proses login pada blogger.





Gambar 11

AKHIRNYA SELESAI...tinggal kamu Copy/Paste codenya pada blog mu.





Gambar 12

Jika kamu masih bingung cara menginput dan setting kamu dapat meng-klik tombol
ini..jika ingin membersihkan klik tombol bersihkan.

 

Contoh hasil :

Ini contoh dibuat dengan Installer generator

<a href="http://o-om.blogspot.com" target="_blank"><img border="0" alt="http://o-om.blogspot.com" width="84" src="http://www.geocities.com/oom_directory/images/oom_link.gif" height="16"/></a>

Ini contoh dibuat dengan Installer generator

<script style="text/javascript" src="http://www.geocities.com/oom_directory/recentpost.txt"></script><script style="text/javascript">var numposts = 5;var showpostdate = true;var showpostsummary = true;var numchars = 100;var standardstyling = true;</script><script src="http://o-om.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script>

Ini contoh dibuat dengan Installer generator

<script style="text/javascript" src="http://www.geocities.com/oom_directory/recentcomments.txt"></script><script style="text/javascript">var numcomments = 5;var showcommentdate = true;var showposttitle = true;var numchars = 80;var standardstyling = true;</script><script src="http://o-om.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script><br />

 

Cara download dan Installasi :



Sebenarnya tool ini berukuran
sangat kecil cuma 23 kb dalam format zip, karena dibuat dengan Visual basic 6.0
jadi kamu harus punya VB runtime untuk menjalankan software ini..gak usah dipikirin om sudah masukin dalam satu paket jadi tinggal download aja.

Untuk downlaod tool dibawah pilih salah satu yang mana kamu suka.

install blogger.zip (1MB)

Catatan : Tools ini jauh dari kesempurnaan..dan
mungkin ada kesalahan dalam koding jadi laporkan kepada saya jika menemukan
error ke oom.avaco[at]gmail[dot].com

Tools ini bebas kamu sebarluaskan
bersama artikelnya (Gratis)...Copy/paste aja sesuka kamu....asal jangan lupa
code sumbernya ya :). Thanks



- SELAMAT MENCOBA, HAPPY BLOGGING -

 

Pasang icon smile (emoticon) di blogger

Pengguna blogger pasti udah mengetahui icon smile yang banyak
digunakan oleh pengguna wordpress atau pengguna blog lain, dimana setiap ada
kode teks icon smile maka kode tersebut akan berganti dengan icon smile secara
visual. Namun sayangnya blogger tidak support untuk icon smile ini..Ups
jangan berkecil hati..banyak jalan menuju roma, semua pasti ada solusinya.

Coba lihat contohnya di blog ini, setiap ada penulisan text
yang mengacu kepada code smile pasti akan berubah secara visual. Sebagai contoh,
saya mengetikan icon senyum :) dan tertawa :D dan ketika saya tersipu malu :$
yang jelas Icon smile ini akan tampil pada semua text yang ada pada blog kita di
manapun letaknya (Nb: bukan dalam shoutbox, link dan gambar), yang paling menguntungkan icon smile ini dapat memberikan
keterangan emoticon pengujung ketika sedang memberikan komentar :o.



3 langkah mudah pasang icon smile di blogger :

1. Masuk ke template > edit HTML > Expand Widget Templates
dan cari kode dibawah ini:



]]></b:skin>



2. Jika sudah ketemu copy code javascript di bawah, dan letakan dibawah kode ini
]]></b:skin>



<script src='http://louislim2.googlepages.com/addSmiley.js
' type='text/javascript'/>



3. Simpan dan lihat hasilnya.

Icon smile ini akan tampil secara otomatis pada blog kita
setiap kali kita mengetikan standar kode dari icon tersebut.

Standar kode smile yang bisa digunakan :

:) or :-)

:D or :-D

:$ or :-$

:( or :-(

:p or :-p

;) or ;-)

:k or :-k

:@ or :-@

:# or :-#

:x or :-x

:o or :-o

 

Special thanks for Louiss Lim. Sumber :
http//bloggingsecret.net

 

Lupa password blogger?

Apa yang terjadi ketika login ke blogger namun lupa password blogger dan
nama user? pasti kita akan panik setengah mati. padahal sudah berusaha mencoba
berbagai katakunci namun hasilnya tetap saja nihil, ups sabar-sabar jangan panik
pasti ada solusinya. pengen tau caranya lihat dibawah ini.



Cara mendapatkan kembali passoword dan user name di blogger:

1. Masuk aja ke
http://www.blogger.com/forgot.g

2. Ada dua pilihan untuk mendapatkan kembali password dan username, disini saya
hanya menjelaskan cara pertama yaitu menggunakan alamat url blogger/blogspot.

3. Langkah selanjutnya kita tinggal ikuti instruksi yang ada (karena
menggunakan bahasa indonesia saya tidak menjelaskan caranya secara mendetail,
saya yakin kalian semua pasti bisa)




Catatan: Informasi alamat url blog akan dikirim kealamat email (gmail),
jika dalam beberapa waktu informasi tidak muncul dalam inbox, coba cek di folder
spam. Nah pada email yang diterima kita akan melihat beberapa informasi penting,
diantaranya jika kita lupa nama sandinya tinggal klik link dibawah kalimat "Apabila
lupa sandi Anda, Anda dapat me-reset dengan meng-klik link ini:" kemudian
akan muncul halaman bantuan password, masukan kode verifikasi sesuai dalam
gambar, kemudian klik "dapatkan kembali password". hal yang harus diperhatikan
bahwa informasi password akan dikirim ke alamat email sekunder ketika pertama
kali mendaftar.



Semoga bermanfaat, happy blogging :)

Editor ODP dmoz tolak google adsense

Entah bener apa tidak, salah satu gagalnya mendaftar ODP
DMOZ disebabkan terpasangnya google adsense pada blog. Hal ini saya
ketahui ketika sahabat blogger meenghubungi saya lewat yahoo messanger yang
mengatakan bahwa dia telah menerima email yang berisi pesan bahwa blognya tidak
dapat terdaftar di OPD karena terdapat google adsense



Hal yang membingungkan apa bener gara-gara adsense situs atau blog kita ditolak,
karena ketika saya mendaftar ke ODP DMOZ blog saya memang bersih dari adsense, untuk
masalah penolakan  ini saya tidak berani memberikan opini yang salah,
karena saya sendiri bukan ahli adsense apalagi sebagai ahli SEO.

Melihat dari kenyataan yang ada memang ada kejanggalan, yang
saya lihat dihalaman peraturan ODP DMOZ tidak ada sedikitpun yang menyinggung masalah
adsense, padahal google juga
meminjam direktori odp DMOZ untuk memaksimalkan search enginenya, terlihat janggal bukan kalo sampai odp menolak
google adsense atau saya sendiri belum mengetahui hal ini??



Untuk menjawab hal ini apakah sahabat blogger pernah mengalami hal diatas? jika ada, saya sangat senang
menerima sumbangsih maupun mengalaman kalian mendaftar di ODP DMOZ. Atas
semua masukannya saya ngucapin terima kasih.

 

Cara konversi dan optimasi gambar dengan cepat

blogger yang sangat mencintai kecepatan loading
page tentu memperhatikan masalah ukuran gambar, Kenapa hal ini perlu
diperhatikan? karena menurut beberapa penelitian, jika load page terlalu lama
dan berat kita akan kehilangan 10% dari jumlah pengunjung setiap detiknya dan
setelah 5 detik berikutnya kemungkinan blog atau wesite kita akan dilupakan
pengunjung. Karena loading yang cukup lama ini lah akan memberikan kesempatan
pungujung untuk berpindah ke website atau berpindah kealamat blog yang lain.
untuk itu jangan sampai gambar yang berukuran jumbo merugikan kecepatan loading
page kita, walaupun ukuran gambar yang besar tetap digunakan alangkah 
baiknya kita berusaha mengoptimalkan gambar tersebut dengan cara melakukan
konversi dan optimasi.



Untuk mengatasi hal diatas DynamicDrive
telah membuat layanan "online image optimizer" agar konversi gambar
bisa dilakukan dengan mudah dan cepat tanpa harus mempunyai tools image offline,
apa lagi jika kita sedang online diwarnet yang minim dengan tools konversi
gambar. tentu hal ini akan memberikan kemudahan dan kecepatan dalam melakukan
konversi dan optimasi pada gambar yang akan digunakan.



Langkah-langkah melakukan Konversi dan Optimasi gambar :

1. Klik
http://tools.dynamicdrive.com/imageoptimizer/

2. Kemudian akan ada 2 pilihan yaitu apakah kita akan mengkonversi gambar dari
alamat url atau melakukan konversi pada gambar yang tersimpan dalam komputer.

3. Jika kita memilih konversi gambar dari komputer pilih "Conver to"

4. Pilih format yang akan kita konversi misalnya gif ke jpg, jpg ke gif atau gif
ke png dan sebaliknya, jika kita tidak ingin mengubah apapun kita dapat memilih
"same as input type"

5. Selanjutnya jangan lupa beri tanda centang pada "Show all Result"

6. Langkah terakhir pilih "optimize" untuk melakukan optimasi dan
konversi pada gambar, jika sukses maka akan muncul hasil konversi yang kita
inginkan

7. Pada jejeran gambar kita dapat memilih hasil optimasi gambar yang menurut
kita terbaik, tentunya dengan size gambar terkecil. Untuk menyimpan gambar, kita
cukup mengarahlan mouse ke gambar lalu klik kanan pada mouse dan "save image
as.."

Tampilan tools image optimazi:





Contoh hasil konversi dan optimasi pada gambar:

Catatan : ukuran gambar yang akan di optimasi
tidak lebih dari 300 KB.

Pencarian (Search Engine) di Blogger dengan Flat Button Style dan Flat Textbox Style

"Cara buat Search engine di blogger"

Search Engine pada blogger merupakan proses pencarian untuk memudahkan
mengunjung mencari suatu artikel sesuai dengan kata kunci yang digunakan.
Walaupun sudah banyak yang mengetahui cara pembuatannya namun kali ini saya
memberikan sentuhan yang berbeda dari yang standar, yaitu menampilkan dengan
gaya Flat Button Style dan Flat Texbox Style.

Pengen tau cara buatnya ikuti langkah dibawah ini:

1. Pada Template -> Element Halaman -> Tambahkan sebuah Elemen Halaman ->
HTML/JavaScript

Copy/Paste code dibawah ini

<form action="http://NAMABLOG.blogspot.com/search"
method="get">

<input class="textinput" name="q" size="37" type="text"/>

<input value="search" class="buttonsubmit" name="submit" type="submit"/></form>

Jangan lupa ganti warna merah dengan alamat blog sobat,
dan jangan lupa disimpan :)

2. Langkah kedua pada Template -> Edit HTML

Copy/Paste code dibawah ini pada jajaran kode CSS pada blogger, kalo masih
bingung cari kode body {  lalu setelah
tanda akhiran body ada tanda  } 
letakan saja dibawah kode tersebut. jangan lupa disimpan. dan lihat hasilnya :)

.buttonreset {

color: #333;

background-color: #f3f3f3;

border: 1px solid #999;

padding: 1px;

}



.buttonsubmit {

color: #333;

background-color: #f3f3f3;

border: 1px solid #999;

padding: 1px;

}



.textinput {

color : #333;

background-color: #ffffff;

border: 1px solid #999;

padding: 1px;

}

Hasilnya akan tampak seperti dibawah ini

 

Contoh menggunakan Flat Style

Contoh tampilan standar tidak menggunkan Flat Style

Selamat Mencoba and happy blogging :)

Cara buat daftar tabel seluruh posting (Show Table of Contents)

"Cara buat Show Table of Contents di Blogger"

Mempunyai daftar tabel seluruh posting atau lebih keren
dengan nama "Show Table of Contents" pasti mempunyai nilai plus tersendiri, 
selain mempermudah pengunjung dalam menjelajahi isi blog, cara ini juga dapat memberikan kecepatan pencarian dibandingkan dengan menggunakan box search atau mencari suatu artikel berdasakan label. Kode yang akan kita gunakan menggunakan
javascript yang sedikit telah saya modifikasi, semula hasil tampilan bahasa kode ini mengunakan bahasa
inggris dan terlihat kurang familiar, jadi saya modifikasi saja menggunakan bahasa
indonesia dan telah saya tambahkan beberapa icon biar terlihat lebih fresh :). Pengen tau cara buatnya ikuti tutorial dibawah ini.

Tampilan link sebelum di klik







Tampilan daftar seluruh posting

Langkah Pembuatannya sebagai Berikut:




Langkah Pertama:

Jangan lupa Backup template Blog sobat

Langkah Kedua:

Kemudian Tambahkan sebuah Element halaman -> HTML/Javascript



Copy/Paste code dibawah ini



<div id="toclink"> <a href="javascript:showToc();"> <img
border="0" src="http://www.geocities.com/oom_directory/images/add2.png"/><font
color="#808000"><b> Lihat Semua Daftar Posting</b></font></a>

</div>

<script style="text/javascript" src="http://www.geocities.com/oom_directory/blogtoc.js"></script>

<script src=" http://namablogo.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=999&callback=loadtoc"></script>

Jangan lupa ganti dengan alamat blog sobat pada kode warna merah diatas

Jangan lupa disimpan :)

Kemudian Tambahkan sebuah element halaman
yang baru -> HTML/Javascript



Copy/Paste code dibawah ini



<div id="toc"></div>



Jangan lupa disimpan :)

Langkah ketiga:



Langkah selanjutnya buka Template -> Edit Html



Copy/paste code dibawah ini pada deretan CSS code atau kalo masih bingung cari
code <b:skin><![CDATA[/*  lalu paste aja
dibawah kode tersebut



/* Show Table of Contents

-----------------------------------------

*/

#toc {

border: 0px solid #78B749;

background: #ffffff;

padding: 5px;

width:500px;

margin-top:10px;

}

.toc-header-col1, .toc-header-col2, .toc-header-col3 {

background: #cccccc;

color: #444;

padding-left: 5px;

font-weight:bold;

width:250px;

}

.toc-header-col2 {

width:75px;

}

.toc-header-col3 {

width:125px;

}

.toc-header-col1 a:link, .toc-header-col1 a:visited, .toc-header-col2 a:link,
.toc-header-col2 a:visited, .toc-header-col3 a:link, .toc-header-col3 a:visited
{

font-size:95%;

text-decoration:none;

text-align: Left;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #cccccc;

}

.toc-header-col1 a:hover, .toc-header-col2 a:hover, .toc-header-col3 a:hover {

font-size:95%;

text-decoration:underline;

text-align: left;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #cccccc;

}



.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 {

padding-left: 5px;

text-align: left;

font-size:95%;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #cccccc;

}

Langkah Terakhir:

Yup! udah selesai jangan lupa disimpan dan lihat hasilnya :)

Selamat mencoba and Happy Blogging :)

Kode sumber

http://beautifulbeta.blogspot.com/2007/04/blogtoc-widget-released.html

Tips menambah informasi pada "Pesan Formulir Komentar"

Sudah tahu khan betapa ribetnya melakukan proses
komentar pada blogger, tidak masalah jika kita memang pengguna blogger, namun
bagi pengunjung awam apalagi baru pertama kali membuka komentar blogger pasti akan
sedikit kebingungan terutama pada pilihan Account Blogger. Untuk menghidari
kebingungan terebut, sebaiknya kita sedikit memasukan informasi tambahan pada Pesan
Formulir Komentar agar informasi tersebut bisa sedikit membantu bagi pengguna
awam agar tidak bingung pada informasi pilihan yang akan dipilih.



Caranya membuatnya :

1. Masuk pada tab Pengaturan -> Komentar -> tuju ke "Pesan
Formulir komentar"

2. Tulis Informasi apa saja untuk memudahkan pemberi komentar, jangan lupa ya
tag html yang digunakan hanya berupa <b>, <i>, <a>

3. Jangan lupa disimpan dan lihat hasilnya.

Lebih mudahnya lihat Gambar dibawah:

 

Atau Copy/Pate aja code dibawah ini:

<b>Informasi Pilihan Identitas:</b>

<b>Google/Blogger :</b> Khusus yang punya Account Blogger.

<b>Lainnya :</b> Jika tidak punya account blogger namun punya alamat Blog atau
Website.

<b>Anonim : </b>Jika tidak ingin mempublikasikan profile anda (tidak disarankan).

Link Banner Exchange untuk blogger

"oom kenapa cuma pasang text link? saya khan udah pasang link banner oom"

Permintaan maaf om kepada rekan blogger semua untuk masalah link banner (Cat:
Link Banner ya bukan Link Text). Bukannya om tidak mau pasang Link
banner kalian, tapi alasan yang om terapkan cukup kuat, ya..om sangat
mencintai kecepatan. jadi bayangkan kalo semua banner om pasang bisa tambah
lambat n berat nantinya. maaf ya atas ketidakadilan ini :)



Untuk itu dimohon pengertiannya...om tidak akan memasang link banner
tapi hanya Link text. om ngucapin terima kasih dan
tanks sebanyak-banyaknya telah

mempercayakan blog ini untuk dijadikan bahan tutorial buat sahabat semua. sekali
lagi thanks

 

Tampil sempurna disemua browser

Setelah bekerja keras melakukan penelitian di "oom
laboratory" yang terletak di jantung kota yogyakarta tepatnya di kamar tidur hehehe akhirnya dari sekian banyak pengeditan yang dilakukan pada layout blog ini bisa
tampil sempurna di semua web browser, memang masih ada sedikit perbedaan
terutama pada penggunaan code javascript tapi hal ini tidak terlalu mencolok.
jadi gak ada lagi kata-kata "tampil terbaik dengan IE atau Firefox".



Mengapa om melakukan hal yang kurang kerjaan ini, jelas ini berpengaruh besar
terhadap pengunjung jika mereka menggunakan web browser yang berbeda. Tidak
semua pengunjung hanya menggunakan browser IE atau firefox, om sendiri sangat
mencintai Mozilla Flock sebagai favorite browser, jadi sebisanya kita memberikan
tampilan yang terbaik dan support dengan semua web browser.



Uji coba yang di lakukan terutama pada 6 browser terkenal:

Internet Explorer V6.0.2900.2055





Mozilla FireFox V2.0.0.9





Mozilla Flock V1.0





Mozilla V5.0





Safari V3.0.3





Opera V9.00

Nah dari uji coba tersebut jelas terlihat tidak ada perbedaan dalam tampilan khan :) kalo masih gak jelas pake kaca pembesar ya :)

Cara pasang jam di blogger

Banyak sekali sahabat blogger baru yang menanyakan bagaimana
cara pasang jam di
blogger, aksesoris ini ternyata banyak juga peminatnya terutama kau hawa yang
sangat mengetahui akan arti kecantikan yang akan dituangkan dalam sebuah
blog. Jujur om sangat tidak menyarankan untuk memasang jam pada blog kalian,
selain bikin lambat page load juga kurang terlalu berguna, coba baca artikel om
sebelumnya

17 Tips agar halaman blog tampil Profesional. Walaupun sudah banyak para
blogger yang mengetaui cara pasang jam ini tapi tidak begitu bagi blogger pemula
yang baru memulai membuat blog tentu perlu tahapan dan bimbingan jadi gak ada
salahnya untuk memasang aksesoris ini jika dirasa berguna :). Layanan gratis
aksesori jam sangat banyak, namun kali ini om hanya menjelaskan cara pasang jam menggunakan layanan gratis
dan paling banyak digunakan
http://www.clocklink.com/



Langkah-langkah pasang jam di blogger sebagai berikut:

1. Klik alamat http://www.clocklink.com/


2. Kemudian pilih tab Gallery atau klik aja disini

http://www.clocklink.com/gallery.php 

3. Pilih Gallery sesuai selera atau tema blog, misalnya sobat memilih animal lalu klik link
"animal" tersebut

4. Pilih gambar yang ingin sobat gunakan, lalu klik "view html" dibawah gambar jam.

5. Kemudian akan keluar halaman box lisensi dari layanan ClockLink, pilih aja
tombol "Accept"

6. Pada halamat box selanjutnya kalian dapat memilih salah satu code, sebaiknya pilih kode yang atas.

7. Copy atau Simpan kode yang telah dipilih untuk sementara waktu

8. Lalu kembali masuk kehalaman blogger, pilih Elemen halaman -> Tambahkan sebuah
Elemen Halaman -> pilih HTML/JavaScript -> lalu Copy/Paste code tersebut, dan jangan
lupa disimpan

9. Selesai :) dan lihat hasilnya.



Contoh jam :

 

Selamat mencoba dan happy Blogging :)

Blogger Backup Utility (VB.Net open source)

"Blogger Backup Utility

v1.0.7.16 merupakan tools Open Source, jadi kita bisa mempelajari source codenya
secara langsung"

Pada posting sebelumnya Oom telah membahas mengenai cara melakukan backup
blogger, bagi yang belum membaca bisa lihat
disini.
Selain menggunakan cara sebelumnya, alternatif lain yang bisa kita gunakan yaitu
menggunakan tools Blogger Backup Utility yang beralamat pada
http://www.codeplex.com/bloggerbackup . Saat
pertama kali mencoba tools ini tenyata cukup mudah, saya yakin kalian tidak akan
kesulitan. tools ini masih tersedia dalam versi beta yaitu

v1.0.7.16 Beta Release (8/11/2007 8:30AM PDT). Penasaran? bisa download
tools-nya disini

Tools ini bersifat open source yang dibuat oleh

gduncan411 jadi kalian yang hobi sebagai programmer bisa mempelajari sorce
codenya secara langsung. Kalo tidak salah menggunakan bahasa VB.net jadi
kalian harus menginstall Visual basic Net jika ingin mempelajarinya kodenya.
jika masih bingung dengan codenya bisa tanyakan om secara langsung ya. mungkin
om bisa sedikit membantu. Source codenya bisa di download

disini

Untuk melakukan proses backup caranya cukup mudah:

Cara I :

1. Pada tab Log into Blogger to get and add your blogs pilih Available blogs klik combobox lalu pilih [Add/Update/Remome
Blogs]

2. Masukan User ID dan Password blogger

3. Klik button Log into Blogger and Get Blogs

4. Ada beberapa pilihan setting yang bisa kita gunakan , misalkan hanya
melakukan backup pada tanggal tertentu.

5. Untuk proses backup tinggal klik button Backup Posts, begitu juga
sebaliknya jika kita ingin mengembalikan data yang sudah di backup tinggal klik
button Restore Posts

Cara II:

1. Pada tab Or manualy Add a blogger blog

2. Masukan Title blog

3. Masukan Alamat blog

4. masukan alamat feed url

5. Kemudian Klik Add Blog

Auto save from blogger

Autosave merupakan fasilitas yang digunakan untuk menyimpan posting otomatis dari blogger, Tentu fasilitas ini
cukup berguna ketika sesuatu hal yang kita tidak inginkan terjadi misalkan
listrik mati, browser craches atau komputer shutdown secara otomatis oleh virus.
Fasilitas baru ini bekerja ketika kita membuat posting baru, maka blogger
otomatis akan menyimpan perubahan dalam waktu beberapa menit.

Jika kita tidak sedang bekerja pada halaman posting kita bisa meng-clik "publis
Post" untuk menyimpan sebagai draft atau clik "Return to list of post" jika ingin mengembalikan draft dan kembali ke halaman posting.

Namun auto save tidak dapat bekerja jika kita sudah melakukan
publish posting ke blog:

Note: Autosave does not occur when you are editing posts that have
previously been published to your blog. This keeps your readers from seeing your
edits until you're done with them. When editing a published post, you can click
"Publish Post" to republish the changes to your blog, or click "Save as Draft"
to unpublish the post and turn it into a draft.

Dari keunggulan auto save tersebut sayangnya fasilitas ini tidak bisa memberikan pilihan turn off service jika kita tidak ingin menggunakannya. thanks