Tingkatkan trafik blog Anda

Ingin menambah trafik blog? Banyak cara bisa dilakukan. Pada intinya, kita harus promosi di berbagai tempat dan kesempatan, baik di dunia maya maupun dunia nyata. Berikut ini, saya menjelaskan cara promosi secara otomatis, yang biasa disebut ping.

Silakan buka http://pingomatic.com/ lalu isi formulir di bawahnya. Ceklis semua service lalu klik Send Pings.

Tunggu sebentar, proses ping telah dilakukan.

Selain situs di atas, bisa juga menggunakan http://pingler.com/.

Proses ping sebagai berikut.

Jika artikel Anda berbahasa Inggris, cara ini saya rasa lebih bermanfaat. Kalau berbahasa Indonesia, siapa tahu ada yang nyasar.

Mengubah ukuran foto otomatis di photoshop

Ketika akan mengupload gambar ke internet, baik untuk keperluan artikel di blog, album foto di facebook, maupun yang lain, tentu akan lebih baik kita mengubah ukurannya supaya tidak memenuhi kapasitas hosting dan juga tidak terlalu berat ketika meguploadnya. Mengubah ukurannya, bisa menggunakan aplikasi Photoshop. Namun, kalau jumlahnya banyak, tentu saja bisa merepotkan.

Supaya pekerjaan lebih ringan, kita bisa memanfaatkan fitur Action. Dengan fitur ini, setelah kita merekam sebuah aksi, bisa dijalankan aksi yang sama pada gambar/foto yang lain.

Berikut ini, salah satu contohnya. Saya akan mengubah semua foto dengan tampilan horizontal dengan ukuran, resolusi, dan tempat penyimpanan yang sama. Caranya sebagai berikut.

Buka Action dengan menekan tombol Alt + F9. Atau, menu Window > Actions.

Klik ikon Create new set.

Ketik namanya lalu klik OK. Misalnya, horizontal. Penamaan bebas, tetapi disarankan dengan nama yang mudah diingat.

Klik ikon Create new action.

Kasih nama lalu klik Record.

Sampai saat ini, aktivitas kita di Photoshop akan direkam. Kali ini, saya akan mengubah ukuran dan resolusi foto. Klik kanan pada jendela salah satu foto lalu klik Image Size.

Ubah ukuran dan resolusi lalu klik OK.

Klik File > Save for Web & Devices.

Pilih ukuran yang diinginkan lalu klik Save.

Tentukan lokasi penyimpanan. Beri nama lalu klik Save.

Tutup foto yang sudah diubah.

Klik No.

Klik ikon Stop playing/recording pada Actions.

Sekarang, semua foto yang horizontal bisa diperlakukan hal yang sama dengan foto sebelumnya. Caranya, buka foto yang akan diubah. Klik Action 1 lalu klik Play selection.

Pekerjaan lebih ringan, bukan? Kita tidak perlu lagi mengubah satu per satu foto. Photoshop akan melakukannya secara otomatis. Untuk action lain, silakan dicoba sendiri.

Menghilangkan pesan An automated WordPress update has failed to complete

“An automated WordPress update has failed to complete - please attempt the update again now.” Pesan itulah yang muncul ketika gagal mengupdate otomatis pada WordPress. Terpaksa, harus update secara manual. Setelah update manual selesai, ternyata pesan tersebut tetap muncul di dashboard. Memang, tidak ada pengaruhnya apa-apa terhadap situs, tetapi pesan tersebut cukup mengganggu mata setiap kali membuka dasboard.

Pesan tersebut bisa dihilangkan dengan cara sebagai berikut.

Buka File Manager di cPanel atau bisa juga menggunakan FileZilla.

Hapus file .maintenace.

Setelah dihapus, pesan tersebut kini hilang.

Readmore sudah lama disediakan blogger

Sampai sekarang, masih banyak pengguna blogger yang belum sadar bahwa blogger sudah menyediakan fasilitas readmore (baca selengkapnya). Padahal, fasilitas itu sudah lama ada. Mungkin, karena ketika menulis artikel, menggunakan aplikasi lain seperti Windows Live Writer. Namun, meskipun seperti itu, sekali-kali hendaknya berkunjung ke dashboard blogger kita supaya apabila ada perubahan, bisa langsung mengetahui dan menggunakannya.

Bagaimana menggunakan fasilitas readmore di blogger?

Silakan tulis artikel seperti biasa lalu letakkan kursor pada awal paragraf yang akan dipenggal. Klik Insert jump break.

Akan keluar garis putus-putus di antara paragraf yang akan ditampilkan dengan paragraf yang akan dipenggal. Klik PUBLISH POST.

Hasilnya seperti ini.

Mudah, bukan? Tidak perlu repot-repot mengubah/menambah kode HTML untuk membuat readmore. Jika ingin membuat readmore otomatis, silakan baca di sini.

Highlight syntax pada blogger

Sering memasukkan kode pada artikel blogger? Kalau ya, Anda bisa membedakannya dari tulisan lain menggunakan syntaxhighlighter. Dengan demikian, si pengunjung bisa sedikit memahami tentang kode tersebut. Contohnya seperti berikut ini.

Cara membuatnya sebagai berikut.

• Salin kode di bawah ini lalu paste sebelum kode ]]></b:skin>.

.dp-highlighter
{
 font-family: "Consolas", "Monaco", "Courier New", Courier, monospace;
 font-size: 12px;
 background-color: #E7E5DC;
 width: 99%;
 overflow: auto;
 margin: 18px 0 18px 0 !important;
 padding-top: 1px; /* adds a little border on top when controls are hidden */
}

/* clear styles */
.dp-highlighter ol,
.dp-highlighter ol li,
.dp-highlighter ol li span 
{
 margin: 0;
 padding: 0;
 border: none;
}

.dp-highlighter a,
.dp-highlighter a:hover
{
 background: none;
 border: none;
 padding: 0;
 margin: 0;
}

.dp-highlighter .bar
{
 padding-left: 45px;
}

.dp-highlighter.collapsed .bar,
.dp-highlighter.nogutter .bar
{
 padding-left: 0px;
}

.dp-highlighter ol
{
 list-style: decimal; /* for ie */
 background-color: #fff;
 margin: 0px 0px 1px 45px !important; /* 1px bottom margin seems to fix occasional Firefox scrolling */
 padding: 0px;
 color: #5C5C5C;
}

.dp-highlighter.nogutter ol,
.dp-highlighter.nogutter ol li
{
 list-style: none !important;
 margin-left: 0px !important;
}

.dp-highlighter ol li,
.dp-highlighter .columns div
{
 list-style: decimal-leading-zero; /* better look for others, override cascade from OL */
 list-style-position: outside !important;
 border-left: 3px solid #6CE26C;
 background-color: #F8F8F8;
 color: #5C5C5C;
 padding: 0 3px 0 10px !important;
 margin: 0 !important;
 line-height: 14px;
}

.dp-highlighter.nogutter ol li,
.dp-highlighter.nogutter .columns div
{
 border: 0;
}

.dp-highlighter .columns
{
 background-color: #F8F8F8;
 color: gray;
 overflow: hidden;
 width: 100%;
}

.dp-highlighter .columns div
{
 padding-bottom: 5px;
}

.dp-highlighter ol li.alt
{
 background-color: #FFF;
 color: inherit;
}

.dp-highlighter ol li span
{
 color: black;
 background-color: inherit;
}

/* Adjust some properties when collapsed */

.dp-highlighter.collapsed ol
{
 margin: 0px;
}

.dp-highlighter.collapsed ol li
{
 display: none;
}

/* Additional modifications when in print-view */

.dp-highlighter.printing
{
 border: none;
}

.dp-highlighter.printing .tools
{
 display: none !important;
}

.dp-highlighter.printing li
{
 display: list-item !important;
}

/* Styles for the tools */

.dp-highlighter .tools
{
 padding: 3px 8px 3px 10px;
 font: 9px Verdana, Geneva, Arial, Helvetica, sans-serif;
 color: silver;
 background-color: #f8f8f8;
 padding-bottom: 10px;
 border-left: 3px solid #6CE26C;
}

.dp-highlighter.nogutter .tools
{
 border-left: 0;
}

.dp-highlighter.collapsed .tools
{
 border-bottom: 0;
}

.dp-highlighter .tools a
{
 font-size: 9px;
 color: #a0a0a0;
 background-color: inherit;
 text-decoration: none;
 margin-right: 10px;
}

.dp-highlighter .tools a:hover
{
 color: red;
 background-color: inherit;
 text-decoration: underline;
}

/* About dialog styles */

.dp-about { background-color: #fff; color: #333; margin: 0px; padding: 0px; }
.dp-about table { width: 100%; height: 100%; font-size: 11px; font-family: Tahoma, Verdana, Arial, sans-serif !important; }
.dp-about td { padding: 10px; vertical-align: top; }
.dp-about .copy { border-bottom: 1px solid #ACA899; height: 95%; }
.dp-about .title { color: red; background-color: inherit; font-weight: bold; }
.dp-about .para { margin: 0 0 4px 0; }
.dp-about .footer { background-color: #ECEADB; color: #333; border-top: 1px solid #fff; text-align: right; }
.dp-about .close { font-size: 11px; font-family: Tahoma, Verdana, Arial, sans-serif !important; background-color: #ECEADB; color: #333; width: 60px; height: 22px; }

/* Language specific styles */

.dp-highlighter .comment, .dp-highlighter .comments { color: #008200; background-color: inherit; }
.dp-highlighter .string { color: blue; background-color: inherit; }
.dp-highlighter .keyword { color: #069; font-weight: bold; background-color: inherit; }
.dp-highlighter .preprocessor { color: gray; background-color: inherit; } 

• Salin kode berikut lalu paste sebelum kode </head>.

• Terakhir, salin kode berikut lalu paste sebelum kode </body>.

<!-- Add-in Script for syntax highlighting -->

<script language='javascript'>

dp.SyntaxHighlighter.BloggerMode();

dp.SyntaxHighlighter.HighlightAll('code');

</script>

• Simpan perubahan kode tersebut. Sekarang, setiap akan posting kode, klik bagian html, lalu atur kodenya seperti berikut ini.

<pre name="code" class="cpp">

Kode Anda di sini

</pre>

Menonaktifkan klik kanan di blogger

Mencegah orang lain menjiplak hasil karya memang susah. Selama hasil karya kita publikasikan, meskipun diproteksi, tetap saja bisa dilakukan. Meskipun demikian, setidaknya dengan proteksi, orang lain tidak bisa langsung menyalin isi dari blog/website kita. Salah satu caranya adalah dengan mendisable (menonaktifkan) klik kanan. Bagi yang terbiasa copy-paste dengan klik kanan, tentu hal ini sedikit merepotkan.

Jika Anda ingin memasang fasilitas ini di blogger, bisa dicoba dengan cara berikut.

• Klik Design.

• Klik Add a Gadget.

• Klik + pada HTML/JavaScript.

• Salin kode berikut.

<script language=javascript>

<!-- http://www.spacegun.co.uk -->

var message = "function disabled";

function rtclickcheck(keyp){ if (navigator.appName == "Netscape" && keyp.which == 3){ alert(message); return false; }

if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2) { alert(message); return false; } }

document.onmousedown = rtclickcheck;

</script>

• Paste di kotak HTML/JavaScript lalu klik Save.

• Coba buka blog lalu klik kanan. Akan ada pesan seperti gambar berikut.

Jika ada artikel menarik di blog orang lain, usahakanlah untuk tidak copy-paste, melainkan menulis kembali dengan gaya tulisan sendiri. Lama-kelamaan, Anda pasti mahir menulis. Be Creative! Jangan Cuma Copy-Paste.

Menampilkan tombol sharing di artikel blog

Makin ke sini, kita diberi kemudahan menggunakan blogger. Kalau sebelumnya cukup repot menyisipkan kode html/javascript untuk menambah fungsionalitas, kini sedikit demi sedikit blogger sudah menyediakannya. Misalnya, memenggal artikel atau tombol sharing. Kali ini saya akan mencoba memasang tombol sharing pada setiap artikel.

• Masuk ke halaman Design.

• Klik Edit pada bagian Posting Blog.

• Klik Show Share Buttons lalu klik Save.

Hasilnya seperti ini.

Memasang gadget donasi di blog

Butuh dana untuk pengembangan blog? Mungkin ada baiknya Anda menampilkan widget donasi. Salah satunya dari Paypal. Tentu saja, blog yang sekarang sudah harus menarik dan banyak pengunjungnya. Kalau tidak menarik dan pengunjungnya sedikit, mungkin tidak akan dimintasi donatur.

• Cara membuatnya sebagai berikut. Buka https://giving.paypallabs.com/authenticate/review lalu login dengan akun Paypal Anda.
• Klik Create new widget.

• Atur widget sesuai kebutuhan.

• Klik Post Widget pada Step 2. Setelah kodenya muncul, salin ke gadget blog Anda.

Setelah dipasang, di blog Anda akan tampil seperti ini.

Cara cepat membuat daftar isi di blogger

Sebenarnya, banyak cara untuk membuat daftar isi di blogger. Banyak juga yang sudah menulis tatacaranya. Kalau saya, seperti biasa, memilih cara yang instan dan cepat saja. Cukup memasukkan url blog dan tunggu proses sampai selesai. Selanjutnya, tinggal pasang di blog. Bagaimana caranya?

• Buka link ini lalu masukkan url blog Anda. Lakukan pengaturan seperlunya. Klik Start.

• Tunggu proses sampai selesai.

• Tinggal dipilih formatnya mau yang mana. Jika ingin ditampilkan berupa link, klik view pada Download HTML sitemap.

• Jika Anda tidak memiliki tempat penyimpanan di internet, bisa menggunakan url yang diberikan di address bar untuk dipasang di blog.

Jika punya, download format HTML lalu upload ke tempat penyimpanan seperti pada blog ini saya menyimpan di www.sudarmaster.com.

Harga blog saya hampir 100 juta?

Bagi yang memiliki website, mungkin pernah berpikir ingin menjualnya. Namun, selalu bingung menentukan harga yang pantas untuk website tersebut. Apa saja parameternya? Saya pun sampai sekarang belum tahu. Namun, ada sebuah situs yang bisa membantu untuk menentukan atau memprediksi harga website kita. Situs tersebut menghitung nilai sebuah website, dengan parameter: titik halaman harian, pungunjung harian, peringkat di seluruh dunia, peringkat di Indonesia, jumlah halaman, tautan eksternal, dan lain-lain.

Kalau Anda mau mencoba, silakan ikuti langkah berikut.

Buka situs ini lalu masukkan url web Anda. Klik Nilai.

Kisaran harga website Anda akan ditampilkan. Anda bisa menampilkan banner harga di website dengan menyalin kode yang diberikan.

Nilainya sesuai harapan Anda atau tidak, Anda sendiri yang menentukan. Situs ini hanya alat bantu bagi yang tidak memiliki acuan mengenai harga sebuah website. Jika Anda punya referensi lain tentang nilai sebuah website, silakan sharing di sini.

Membuat top menu di blogger

Kebetulan template yang saya gunakan sudah memiliki top menu. Sebenarnya, bisa saja kita membuat top menu pada blog yang belum memilikinya.

Sebelum Anda mengikuti langkah-langkah di bawah ini, sebaiknya salin dulu semua kode ke notepad untuk menyesuaikan dengan template Anda, baik ukuran, warna, dan sebagainya. Kalau sudah, silakan ikuti langkah di bawah ini.

• Salin kode berikut lalu paste di atas ]]></b:skin>.

/* navbar

================== */

#bg_nav {

background: #0e3300;

width: 770px;

height: 29px;

font-size: 11px;

font-family: Arial, Tahoma, Verdana;

color: #caf99b;

font-weight: bold;

margin: 0px auto 0px;

padding: 0px;

border-top: 1px solid #0e3300;

border-bottom: 1px solid #0e3300;

overflow: hidden;

}

#bg_nav a, #bg_nav a:visited {

color: #FFFFFF;

font-size: 11px;

text-decoration: none;

text-transform: uppercase;

padding: 0px 0px 0px 3px;

}

#bg_nav a:hover {

color: #FFFFFF;

text-decoration: underline;

padding: 0px 0px 0px 3px;

}

#navleft {

width: 440px;

float: left;

margin: 0px;

padding: 0px;

}

#navright {

width: 200px;

font-size: 11px;

float: right;

margin: 0px;

padding: 6px 5px 0px 0px;

}

#navright a img {

border: none;

margin: 0px;

padding: 0px;

}

#nav {

margin: 0px;

padding: 0px;

list-style: none;

}

#nav ul {

margin: 0px;

padding: 0px;

list-style: none;

}

#nav a, #nav a:visited {

background: #0e3300;

color: #FFFFFF;

display: block;

font-weight: bold;

margin: 0px;

padding: 8px 15px 8px 15px;

border-left: 1px solid #000000

}

#nav a:hover {

background: #729e51;

color: #FFFFFF;

margin: 0px;

padding: 8px 15px 8px 15px;

text-decoration: none;

}

#nav li {

float: left;

margin: 0px;

padding: 0px;

}

#nav li li {

float: left;

margin: 0px;

padding: 0px;

width: 150px;

}

#nav li li a, #nav li li a:link, #nav li li a:visited {

background: #729e51;

width: 160px;

float: none;

margin: 0px;

padding: 7px 30px 7px 10px;

border-bottom: 1px solid #000000;

border-left: 1px solid #000000;

border-right: 1px solid #000000;

}

#nav li li a:hover, #nav li li a:active {

background: #0e3300;

padding: 7px 30px 7px 10px;

}

#nav li ul {

position: absolute;

width: 10em;

left: -999em;

}

#nav li:hover ul {

left: auto;

display: block;

}

#nav li:hover ul, #nav li.sfhover ul {

left: auto;

}

• Salin kode di bawah ini lalu paste di bawah widget id='Header1'. Setiap template bisa berbeda. Jika tidak ditemukan, cari yang mirip secara manual.

<div id='bg_nav'>

<div id='navleft'>
<div id='nav'>
<ul>
<li><a href='http://www.sudarma.info/'>home</a></li>
<li><a href='http://facebook.com/sudarma.sopian'>My Facebook</a></li>
<li><a href='http://templates.sudarmaster.com/'>Free Template</a></li>
<li><a href='http://blogkuring.com/'>Blogkuring</a></li>
</ul>
</div>
</div>

<div id='navright'>

<form action='http://www.sudarma.info/search' id='searchform' method='get' name='searchform'>
<input id='s' name='q' type='text' value=''/> <input id='searchsubmit' type='submit' value='Go'/> </form>

    </div>

</div><!-- akhir bg_nav -->

• Klik SAVE TEMPLATE.

Template blogger polos

Jika Anda sangat mengandalkan tulisan, mungkin tidak ingin terlalu ramai diisi gadget pada tampilan blognya. Pengunjung akan langsung fokus ke tulisan yang Anda publikasikan. Kalau pun ingin menambahkan gadget, bisa ditempatkan di bawah template.

Saya mencoba memodifikasi template blogger yang sangat sederhana. Tidak ada gadget di sisi template, melainkan di bawah. Selain itu, artikel otomatis dirangkum (readmore otomatis), sehingga tidak perlu repot mengaturnya bila artikel yang dipublikasikan cukup panjang.

Jika diperlukan, Anda juga bisa mengubah id Twitter di halaman Layout template, serta banner iklan. Jika tidak diperlukan, bisa Anda buang.

Jika tertarik menggunakannya, silakan download di sini. Sebelum menggunakannya, silakan lihat contoh penggunaannya di blog ini.

Rangkuman pengalaman ngeblog, saya bukukan

Akhir tahun 2006 saya membuat blog ini. Namun, dibiarkan begitu saja. Baru April 2008 mulai aktif menulis. Bongkar pasang template, gadget, dan modifikasi telah dilakukan. Mungkin akan terus dilakukan sampai menemukan atau bahkan mampu membuat tampilan sendiri yang lebih nyaman dilihat.

Semuanya saya tulis dan kumpulkan dalam beberapa artikel. Akhirnya, memenuhi kriteria menjadi sebuah buku. Jika Anda tertarik membacanya, silakan beli buku ini di toko buku Gramedia terdekat. Informasi harga, bisa dilihat di sini.