Membuat tulisan Readmore rata kanan

Bagi anda yang menggunakan sistem Readmore pada postingan anda, mungkin anda pernah mengalami masalah pada tulisan Readmore atau selengkapnya yaitu tidak bisa ditempatkan di sebelah kanan bawah pada posting. Hal ini biasanya terjadi jika anda mengatur perataan tulisan menjadi rata tengah atau justify. Memang itu bukan suatu masalah besar, tapi akan lebih terlihat bagus jika tulisan Readmore atau selengkapnya berada di bagian bawah kanan posting.

Bagi anda yang kesulitan menemukan caranya, maka tips berikut ini mungkin akan membantu anda. Namun trik ini mungkin hanya berfungsi pada sistem Readmore lama (Sekarang sudah ada readmore otomatis bawaan blogger).

Triknya sangat mudah yaitu dengan membuat suatu class pada bagian CSS dari template yang anda gunakan. Langkah pertama login ke Dashboard Blogger anda lalu klik Layout-Edit HTML dan centang pada Expand template widget. Selanjutnya cari kode ]]></b:skin> dan sisipkan kode berikut tepat diatasnya :

/* Read more Kanan
----------------------------------- */
.morekanan {
bottom:5px;
font-family:verdana;
font-size:80%;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:bold;
line-height:normal;
padding-right:10px;
text-align:right;
white-space:nowrap;
}

Selanjutnya carilah kode berikut pada template anda :

<p><data:post.body/></p>
<a expr:href='data:post.url'>Read More......</a>

Tulisan yang berwarna merah diatas bisa berbeda tergantung dari pengaturan awal anda. Anda cukup mengganti tulisan diatas menjadi seperti berikut:

<p><data:post.body/></p>
<a expr:href='data:post.url'><p class='morekanan'>&#187; Read More.... </p></a>

Simpan template anda dan lihat hasilnya. Tulisan Readmore atau Selengkapnya akan selalu berada di bagian bawah kanan dari postingan anda.

» More...

Tips aman membackup template sekaligus widget blog

Tips blogging kali ini yaitu seputar perlunya membackup template blog sekaligus dengan widget-widgetnya. Hal ini sangat penting terutama bagi anda yang sering mengutak-atik template atau senang berganti-ganti template.

Blogger sendiri menyediakan fasilitas untuk melakukan backup template ini yaitu dengan cara mendownload full template pada menu Layout-Edit HTML. Tapi cara ini sebetulnya masih kurang aman karena hanya dapat membackup struktur dari template tanpa membackup widget-widgetnya.

Lalu adakah cara aman untuk membackup template blog ini? Tentu saja ada, dan saya akan memberikan tipsnya. Sebetulnya saya menulis hal ini berdasarkan kejadian-kejadian yang saya maupun blogger-blogger lain alami yaitu adakalanya tiba-tiba tampilan blog kita hancur atau widget-widget hilang entah kemana. Biasanya ini terjadi setelah kita memodifikasi kode-kode HTML blog ataupun setelah melakukan penggantian template blog.

Ada dua cara yang menurut saya ampuh dan paling aman untuk membackup template blog yaitu dengan membuat duplikat blog asli kita atau secara manual membackup kode-kode widget dan template.

Membuat duplikat blog
Caranya buatlah sebuah blog baru dengan template dan widget sama persis dengan blog asli kita, jadi seolah-olah kita memiliki blog cadangan. Anda tentu saja tidak perlu mempublikasikan blog duplikat ini karena hanya untuk membackup saja. Anda juga tidak perlu membuat artikel, karena yang anda butuhkan hanyalah template dan widgetnya. Jadi jika sewaktu-waktu blog anda rusak anda masih punya salinan aslinya.

Menyimpan kode HTML template dan widget secara manual
Caranya anda cukup membuat salinan dari kode-kode widget dan template anda cukup dengan Notepad lalu simpan pada satu folder khusus. Lakukan backup ini secara berkala sesuai dengan perubahan-perubahan yang anda lakukan pada blog anda. Untuk membackup kode HTML blog caranya pada Dashboard klik Layout-Edit HTML lalu centang pada Expand template widget dan copy seluruh kode lalu simpan dengan notepad. Sedangkan untuk membackup widget, caranya pada Dashboard klik Layout-Page Elements dan klik Edit pada widget yang akan anda backup dan copy seluruh kodenya lalu simpan dengan menggunakan notepad. Lakukan pada semua widget atau gadget anda kecuali widget bawaan Blogger yang tidak memiliki kode-kode HTML.

» More...

Membuat menu sidebar unik dengan jquery

Bicara masalah modifikasi blog memang tidak akan ada habisnya. Selalu saja ada hal-hal baru yang layak untuk di coba. Seperti pada posting kali ini, saya akan memberikan trik bagi anda yang suka memodifikasi tampilan blognya agar terlihat unik dan professional. Modifikasi kali ini yaitu menambahkan menu unik pada sidebar blog seperti yang bisa anda lihat di blog ini (silahkan hover mouse pada menu Kategori). Anda akan melihat animasi pada saat link di sorot mouse. Untuk melakukan animasi seperti itu memang tidak cukup hanya dengan kode CSS saja, untuk itu maka dibutuhkan Java script dan jquery.

Menu seperti ini biasanya ditemukan pada halaman website professional, dan setelah saya melakukan uji coba pada template blogger ternyata bisa berfungsi dengan baik. Berikut ini adalah langkah-langkah pembuatan menu tersebut.

Silahkan login ke Dashboard Blogger anda, dan buka jendela Edit HTML. Untuk berjaga-jaga, lakukan backup terlebih dahulu template anda. Selanjutnya carilah kode </head> dan sisipkan kode berikut ini tepat diatas kode </head>.

<script src="http://h1.ripway.com/err13z/jquerymenu/jquery.js" type="text/javascript"></script>
<script src="http://h1.ripway.com/err13z/jquerymenu/menu.js" type="text/javascript"></script>

Langkah berikutnya carilah kode ]]></b:skin> lalu sisipkan kode berikut di atasnya.

/* Sidebar jQuery Menu
-----------------------------------------*/
#navigation{
width: 215px; /* Lebar menu */
}
#navigation ul{
list-style: none;
}
#navigation ul li{
height: 24px;
border-bottom: 1px solid #ccc;
}
#navigation ul li a{
text-indent: 20px;
padding: 5px 0;
display: block;
height: 14px;
text-decoration: none;
color: #434343; /* warna huruf */
background-image: url(http://h1.ripway.com/err13z/jquerymenu/bull.png);
background-repeat: no-repeat;
background-position: 2px 6px ;
}
#navigation ul li a:hover{
background-color: #4E5E00; /* warna background hover */
background-image: url(http://h1.ripway.com/err13z/jquerymenu/bull.png);
background-repeat: no-repeat;
background-position: 10px 6px ;
color: white; /* warna huruf hover */
}
/* Akhir sidebar Menu */

Sesuaikan parameter yang saya beri keterangan pada kode di atas dengan template anda lalu simpan. Langkah selanjutnya klik tab Page elements dan tambahkan sebuah gadget lalu pilih HTML/Java script. Beri judul atau title lalu masukkan kode dibawah ini pada kotak script dan simpan.

<div id="navigation">
<ul>
<li><a href="http://eris-agustian.blogspot.com/">Home</a></li>
<li><a href="http://eris-agustian.blogspot.com/">Profil</a></li>
<li><a href="http://eris-agustian.blogspot.com/">Contact</a></li>

<li><a href="http://link seterusnya..">Title..</a></li>

</ul>
</div>

Ganti url dan title sesuai kebutuhan anda. Anda bisa menambahkan daftar menu sesuai keinginan anda cukup dengan menambahkan link dan title seperti contoh di atas. Anda dapat menempatkan widget menu ini sesuai keinginan anda. Simpan dan lihat hasilnya..selamat bereksperimen..

» More...

Tips mudik: Membuka Shoutmix dengan ponsel

Lebaran telah tiba, sebagian dari anda pasti melaksanakan mudik dan harus meninggalkan kegiatan rutin sebagai seorang blogger yaitu mengupdate blog dan blogwalking mengunjungi teman-teman blogger yang lain. Kalau mengupdate blog mungkin dapat dilakukan dengan cara menjadwal posting secara otomatis, namun untuk melakukan blogwalking mungkin akan sedikit sulit. Tapi tahukah anda bahwa ada cara mudah membuka Shoutmix pada blog kita atau pun pada blog orang lain hanya dengan ponsel tanpa perlu membuka blognya. Lumayan untuk sekedar mengecek pesan yang masuk atau untuk menuliskan pesan pada blog teman kita.

Hal yang paling anda perlukan untuk melakukan trik ini tentu anda harus memiliki ponsel yang memiliki fitur gprs sebagai sarana koneksi ke internet. Tapi saat ini hampir semua tipe ponsel sudah mendukung gprs tersebut. Untuk hasil terbaik saya sarankan anda menggunakan Opera mini sebagai browser pada ponsel anda. Yang kedua anda harus mengetahui user ID dari Shoutmix yang akan anda buka. Untuk mengetahui user ID dari Shoutmix sangatlah mudah, bukalah blog yang ingin anda ketahui ID-nya pada PC, lalu sorotkan kursor mouse pada tombol Refresh pada widget Shoutmix yang ingin anda ketahui User ID-nya. Kemudian lihat pada status bar dibawah browser dan catat link yang muncul.

Link yang muncul akan seperti ini www1.shoutmix.com/?userID, nah anda hanya perlu mencatat user ID-nya saja. Untuk menggunakannya, buka browser ponsel dan pilih go to url lalu masukkan alamat www.shoutmix.com/?userID. User ID akan berbeda-beda pada tiap blog, jadi anda perlu mencatat ID shoutmix yang sering anda kunjungi. Sebetulnya trik ini juga berlaku pada browser di PC anda. Bagaimana ada yang tertarik untuk mencoba? Saya tunggu komentar anda...

» More...

Daftar blog direktori lokal dan non-lokal

Pada tulisan sebelumnya yaitu Tips promosi blog untuk meningkatkan trafik terdapat satu poin yang menyarankan anda agar mendaftarkan blog anda ke beberapa blog direktori baik lokal maupun non-lokal. Nah pada tulisan kali ini saya ingin berbagi daftar blog direktori tersebut baik lokal maupun non-lokal yang sebaiknya anda mendaftarkan blog anda.

Dengan mendaftarkan blog anda ke blog direktori, maka mesin pencari seperti Google akan lebih mudah menemukan blog anda sehingga akan meningkatkan trafik blog anda. Memang anda harus meluangkan sedikit waktu anda untuk mendaftar, tapi sekali anda terdaftar maka manfaatnya akan sangat terasa bagi kemajuan blog anda.

Inilah daftar beberapa blog direktori tersebut:

http://indonesia-blogger.com/
http://yuk.ngeblog.web.id/
http://www.topseratus.com/
http://www.blogtoplist.com/
http://www.blogcatalog.com/
http://www.bloghub.com/
http://www.dignow.net/
http://blogs.top.org/
http://www.blogdigger.com/
http://www.blogtopsites.com/
http://topofblogs.com/
http://blog-indonesia.com/
http://feedcat.net/
http://www.bloghints.com/
http://www.bloghub.com/
http://www.dmegs.com/
http://www.bloggingfusion.com/
http://www.totalblogdirectory.com/
http://dir.blogflux.com/
http://www.wilsdomain.com/
http://www.bloggapedia.com/
http://www.bestblogs.org/
http://www.spillbean.com/
http://www.submitblognow.info/
http://blogannounce.info/
http://www.blogarama.com/
http://www.blog-directory.org/
http://portal.eatonweb.com/
http://www.bloglisting.net/
http://www.topblogarea.com/
http://blogs.botw.org/
http://www.blogadr.com/
http://www.bloggernity.com/
http://friend.webkios.info/
http://www.google.com/press/blogs/directory.html
http://www.quickblogdirectory.com/
http://www.domaining.in/Computers/Weblogs/
http://blogville.us/
http://www.search4blogs.com/bloggers/index.php
http://www.blogpoint.com/
http://www.superblogdirectory.com/
http://www.blogrankings.com/
http://www.herblogdirectory.com/
http://www.masternewmedia.org/rss/top55/
http://www.blogdirs.com/
http://www.weblogalot.com/
http://www.blogzoop.com/
http://www.blogged.com/
http://www.bloguniverse.com/
http://www.bloggeries.com/
http://www.blogdirectory.org.uk/
http://www.article99.com/blogs/
http://www.irishblogdirectory.com/
http://www.blogs-collection.com/
http://www.bloglisting.org/
http://www.addurlblog.com/
http://ontoplist.com/
http://topofblogs.com/
http://blogskinny.com/
http://www.blogtoplist.com/
http://blogroll.net/
http://www.blogratedirectory.com/
http://www.blogrankers.com/
http://www.blogupdate.org/
http://www.2-review.com/
http://www.myblog2u.com/
http://www.mynewblog.net/
http://www.blogengage.com/
http://www.lsblogs.com/
http://www.photarium.com/
http://www.britblog.com/
http://dir.yahoo.com/news_and_media/blogs/
http://www.dofollowblogs.com/
http://www.blogscanada.ca/
http://www.gayblogdirectory.com/
http://wikiblogdirectory.com/
http://www.blogsweet.com/
http://www.myblogdirectory.net/
http://www.topbloglists.com/
http://www.blogio.net/
http://www.myblog2u.com/
http://www.blogtagstic.com/
http://www.ablogin.com/
http://www.blogwebdirectory.com/
http://www.conseillemoi.net/
http://www.geoblogdirectory.com/
http://www.delightfulblogs.com/
http://www.blogsbycountry.com/
http://www.photoblogdirectory.net/
http://www.top100bloggers.com/
http://www.expat-blog.com/

Semoga bermanfaat...

» More...