Mereund Blog

Home » Archives for September 2012

Rilis Template Gratis MiMspot

Setelah beberapa lama tidak berhadapan dengan pengkodean Blogger™, akhirnya Optimasi Blog mengeluarkan template gratis yang diberi titel “MiMspot”. Template ini didistribusikan gratis & terkesan minimalis serta sederhana dengan — default — berwarna putih. Nah, apabila Anda melihat demonstrasi yang menampilkan warna latar berbeda, hal itu disebabkan pengkodisian kode yang sengaja dibuat oleh penulis. Berikut adalah tampilan, demo, serta taut untuk mengunduh template MiMspot.

Tolong, jangan dihapus atau dirubah atau ditambah dengan atribut “no-follow” taut kredit yang mengarah ke Optimasi Blog. Jangan lupa sharing & tambahkan juga +1 pada posting ini, apabila mendatangkan manfaat bagi Anda dan/atau para blogger lain dengan mengklik sharing-button (email, blog this, facebook, twitter).

Untuk beberapa kesukaran dalam menerapkan MiMspot pada blog Anda, kami menyediakan juga trik serta tips pada taut demo di atas. Sedangkan jika permasalahannya terletak pada taut unduh, Optimasi Blog menyediakan alternatif melalui Google Drive di http://docs.google.com/open?id=0B0_GO4QFa5MfYWFhWGNza1g4RkE

Pembaharuan (05 Nopember 2012): Perbaikan pada tampilan penelusuran berdasarkan arsip, Kustomisasi elemen status-msg-wrap, penambahan title serta CSS halaman error404, orientasi schema.org blog, blogposting, dan bredcrumbs.

Berikut contoh markah yang dimasukkan dalam menu pengaturan → Search Preferences → Custom Page Not Found.

<div class="error404">
  <h2>Halaman Tidak Ditemukan</h2>
  <div class="clear"></div>
  <div class="noimg">
    <span>Error <strong>404</strong></span>
  </div>
  <div class="errorInfo">
    <p>Maaf, halaman yang Anda cari tidak ada dalam arsip kami atau telah dipindahkan. Mungkin pencarian atau <a href="#" title="Halaman Arsip">melihat arsip</a> akan membantu menemukan posting terkait.</p>
    <form action="/search" id='searchform' method='get'>
      <label class='assistive-text' for='q'>Search:</label>
      <input class='field' id='q' name='q' placeholder='Search…' type='text'/>
      <input class='submit' id='searchsubmit' name='submit' type='submit' value='Search'/>
    </form>
  </div>
</div>

Masih digarap: desain responsif (tampilan pada layar yang berbeda) dengan menggunakan manual CSS media query.

Mendaftarkan Situs Web atau Blog ke Google, Yahoo dan Bing

Jika Anda membaca beberapa posting sebelumnya, seperti Cara Mendaftarkan Blogger di Google Search Engine, Cara Mendaftar Blogger di Search Engine Yahoo & MSN, serta Search Engine Baru dari Microsoft. Sebaiknya menggunakan rekomendasi posting ini sebagai pembaharuan dari ketiga posting yang telah disebutkan di atas.

Ketika sebuah situs web atau blog telah siap untuk dipublikasikan, maka yang perlu dilakukan adalah mendaftarkannya ke beberapa mesin pencari. Hal ini dilakukan untuk memudahkan indeks mesin pencari pada situs web atau blog tersebut, sehingga ketika pengguna mengetikkan kata kunci diharapkan situs web atau blog yang didaftarkan — termasuk posting — akan muncul dalam hasil pencarian. Meskipun dalam kondisi lain, tidak semua pengunjung berasal dari hasil penelusuran pada mesin pencari. Nah, supaya tidak mengambang, langsung saja kita ulas tentang cara mendaftar situs web atau blog ke beberapa mesin pencari sesuai dengan tema/judul posting.

Mendaftarkan Situs Web atau blog ke Google

Klik tautan berikut untuk menuju ke halaman Google Webmaster Tools
Login dengan menggunakan akun Google Anda.

Jika Anda pengguna Blogger™, maka akan tampak satu atau lebih situs Blogger™ yang Anda kelola. Namun jika belum ada, klik tombol “Add a Site” dan tambahkan URL situs web atau blog yang akan didaftarkan. Eksekusi dengan menekan tombol “Continue”.

Ketika situs web atau blog Anda sudah berada dalam daftar Google Webmaster Tools, klik tombol “Manage Site” di samping situs web atau blog yang ingin Anda kelola. Kemudian pilih “Verify this site”.
Selanjutnya akan ditampilkan halaman Recommended method, umumnya metode verifikasi menggunakan Meta tag. Apabila metode verifikasi Meta tag tidak terlihat, klik “Alternate methods”.
Salin tag HTML yang muncul & ikuti langkah-langkah sesuai petunjuk layar. Biarkan tampilan layar pada halaman ini tetap hidup (on).
Buka tab baru pada peramban & masuk ke akun situs web atau blog Anda.
Tempel Meta tag pada template, yaitu memasukkan kode meta di antara <head>…</head> atau pada Blogger™ letakkan saja di atas <b:skin><![CDATA[/*. Simpan perubahan template.

Kembali ke Google Webmaster Tools, klik “Verify”.
Selanjutnya, menambah sitemap seperti pada gambar di bawah ini. Pilih situs web atau blog yang ingin ditambahkan sitemapnya dengan mengklik “Optimization” → “Sitemaps”.

Untuk Blogger™ — atau situs lain — masukkan “sitemap.xml” (huruf kecil & tanpa tanda petik).
Jika Anda masih ragu-ragu, klik tombol “Test Sitemap”. Setelah yakin, klik tombol “Submit”.

Mendaftarkan Situs Web atau blog ke Yahoo & Bing

Sesuai rilis berita di Webmaster Center Blog Bing dikatakan bahwa Bing Webmaster Tools sekarang akan menampilkan data yang terintegrasi dengan Yahoo dalam wilayah dan laporan tertentu. Mengingat usaha gabungan merupakan Aliansi Penelusuran, maka sangat masuk akal untuk menampilkan data yang relevan dari kedua mesin dalam akun webmaster. Jadi jangan heran ketika Anda melakukan submit situs melalui Yahoo akan diarahkan ke Webmaster Tools Bing.

Sebaiknya terlebih dulu Anda telah memiliki akun di Bing, seperti hotmail dan sebagainya. Kemudian klik tautan berikut untuk menuju ke halaman Bing Webmaster Tools. Anda tinggal memasukkan URL (Uniform Resource Locator) situs web atau blog pada “Add a Site”, kemudian eksekusi dengan menekan tombol “Add”. Selanjutnya, proses verifikasi & submit sitemap akan dilalui dengan langkah yang mudah.

Sitemap Blogger™, dilakukan dengan menambahkan sitemap.xml di belakang URL, contoh: h**p://namablog.blogspot.com/sitemap.xml. Ini juga merupakan pembaharuan dari posting yang berjudul Submit Sitemap Blogger.com di Google Webmaster Tools dan Solusi Submit Sitemap di Webmaster Tools.

Toyota Fortuner SUV Terbaik

SUV (Sport Utility Vehicle) merupakan jenis kendaraan penumpang yang digabungkan dengan kemampuan membawa penumpang & juga barang dengan kelincahan truk pickup. Biasanya mobil yang digolongkan sebagai SUV dilengkapi dengan penggerak 4 (empat) roda agar bisa digunakan off-road, salah satunya: Fortuner.

Ketika menyebut Fortuner pasti akan terbayang sebuah sosok SUV yang tak hanya berkesan kokoh tapi juga maskulin dan sporty. Ya, Superstar ini sejak rilis perdananya memang punya aura spesial buat model SUV kelas menengah.
Seperti apa itu? Apa lagi kalau bukan soal desain yang aktual — baik dari sisi eksterior maupun interior — membungkus bawaan teknis mobil ini sebagai sebuah kendaraan yang di Indonesia, tak hanya hadir untuk memenuhi kebutuhan konsumen akan mobil multi-medan.
Majalah MOTOR, 10 Desember 2008. Hal. 36 – 37

Ketangguhan Fortuner untuk menjelajahi berbagai medan telah teruji dengan menjadi official car dalam Fastron Euroasia Expedition 2011 Jakarta – Rome. Perjalanan ini merupakan sebuah ekspedisi lintas benua Asia dan Eropa yang menempuh jarak sejauh 27.000 km melintasi 23 negara dan sekitar 60 kota dengan berbagai kondisi suhu & medan. Tim ekspedisi berisikan 16 orang yang mengendarai empat mobil dilepas dari Gedung Pertamina Jakarta. Hal ini tidak menjadi sesuatu yang khusus, karena memang pada dasarnya berbagai produk mobil yang dikembangkan oleh Toyota telah menggunakan teknologi canggih & tepat guna bagi mesin, keselamatan, serta kenyamanan.

Panjang yang mencapai 4.705 mm dan lebar 1.840 mm membuat interior Fortuner cukup lega Serta mampu menampung 7 (tujuh) penumpang tanpa terasa sempit. Meskipun panjang, tapi Fortuner menunjukkan kemampuannya bergerak lincah, baik di dalam kota maupun di luar kota. Kombinasi antara torsi besar yang didapat di putaran rendah & kemudi yang ringan, membuat pengendara lebih percaya diri dalam mengendarai Fortuner. Bantingan suspensi double wishbone di bagian depan, serta 4-ink lateral rod di bagian belakang, membuat mobil ini mengayun lembut namun tetap stabil & meyakinkan saat menikung. Tak jauh beda ketika diajak untuk bercengkrama dengan ‘lubang-lubang jalanan’, Fortuner dengan ground clearance yang tinggi — ukuran ban 265/65 R17 — tentu tidak kesulitan melewatinya.

Kombinasi yang menarik juga diperlihatkan pada sistem pengereman. Cakram berventilasi pada bagian depan & tromol dengan leading-trailing di bagian belakang — walaupun berbodi ‘bongsor’ — Fortuner tetap aman dan nyaman saat dikendarai. Penggunaan teknologi sistem injeksi bahan bakar elektronik pada Fortuner bensin & common rail pada Fortuner diesel dengan kapasitas tangki 65 liter membuat konsumsi bahan bakar tidak boros (irit), walaupun dikendarai dengan sedikit agresif.

Meskipun Fortuner telah memiliki tampilan yang menarik, namun jika ingin tampil sedikit lebih beda & bergaya dapat dilakukan melalui opsi aksesori lansiran Toyota Genuine Accessories (TGA) yang sudah dilengkapi juga dengan garansi 1 (satu) tahun atau 20.000 km.

Untuk sebuah SUV penjelajah — secara keseluruhan — performa Fortuner sudah terbilang cukup memuaskan. Apalagi ditambah dengan pengendaraan kokoh, roda besar, ground clearance tinggi, penampilan gagah, interior mewah, dan ruang lega, Fortuner adalah pilihan yang sangat menarik karena menggabungkan ketangguhan & kenyaman. Hal ini tidaklah berlebihan jika dilihat dari rilis resmi PT. Toyota Astra Motor, 6 September 2012.

Tren pertumbuhan permintaan pelanggan terhadap Fortuner 4×2 semakin meningkat signifikan pada tahun ini, di mana sepanjang Januari – Juli 2012 saja, total penjualannya sudah mencapai 11.720 unit. Sehingga, sejak diluncurkan pertama kali di Indonesia pada 2005 hingga Juli 2012, Fortuner 4×2 membukukan total penjualan 59.904 unit.
Pencapaian Fortuner Diesel pada tahun ini bahkan melebihi pencapaian 1 tahun penuh di tahun lalu. Sepanjang Januari – Juli 2012, Fortuner Diesel sudah membukukan penjualan 9.277 unit atau lebih tinggi dibandingkan dengan catatan selama 1 tahun pada 2011 sebanyak 9.211 unit. Total penjualan Fortuner Diesel sejak 2005 hingga Juli 2012 adalah 39.187 unit.
PT. Toyota Astra Motor

Video aksi “Grand New Fortuner VN Turbo” engine 2KD-FTV 2.5 Liter D-4D Common Rail with VN Turbo (VNT) and Intercooler.

Dengan membaca & melihat ulasan di atas, maka nyatalah bahwa Fortuner merupakan SUV terbaik serta layak untuk menjadi rekomendasi bagi para pecinta SUV (Sport Utility Vehicle). Jadi mengapa harus sungkan ketika mau bilang “WOW”.

Kustomisasi Setelan pada Preferensi Penelusuran

Posting kali ini akan memberikan informasi tentang beberapa pengaturan pada preferensi penelusuran yang mungkin layak untuk diketahui oleh para blogger. Adapun beberapa pengaturan yang telah disebutkan di atas menggunakan tampilan terbaru Blogger™, sedangkan untuk tampilan lama, kemungkinan akan kehilangan akses menu pengaturan ini.

Tag meta: “Description”

Apabila narablog menggunakan item ini untuk menerjemahkan deskripsi blog, maka penggunaan baris kode tag meta di antara <head> … </head> berikut, tidak diperlukan lagi.

<meta content='deskripsi tentang blog Anda' name='description'/>

Kesalahan & pengalihan

Halaman Tidak Ditemukan

Istilah kerennya “Error404” atau page not found. Item ini berfungsi untuk melakukan kustomasi pada halaman yang tidak ditemukan ketika pengguna mengetikkan atau mencari alamat tertentu dalam blog. Defaultnya struktur pengkodean “halaman tidak ditemukan” akan berada dalam <div class='status-msg-wrap'> … <div>. Berikut merupakan contoh sederhana pengisian pada form “halaman tidak ditemukan”.

<h2>Halaman Tidak Ditemukan</h2><p>Maaf, halaman yang Anda cari tidak ada dalam arsip kami atau telah dipindahkan. Silakan klik tautan di bawah ini untuk kembali ke halaman depan.</p><a style="text-decoration:none;" href="h**p://namablog.blogspot.com/">Beranda</a>

Pengalihan (redirect)

Manfaat dari penggunaan pengaturan ini adalah mengalihkan alamat halaman tertentu ke alamat lain dalam blog yang sama. Pengalihan dilakukan — pada dasarnya — berhubungan erat dengan halaman yang tidak ditemukan dalam blog oleh karena telah dihapus, dipindahkan, dan/atau perubahan struktur permalink oleh pemilik blog. Contoh pengalihan dapat kita lihat sebagai berikut:

h**p://namablog.blogspot.com/2009/06/xxxxxx.html

Kemudian dialihkan ke alamat:

h**p://namablog.blogspot.com/2012/09/yyyyyyy.html

Sebagai tambahan, pengecekan terhadap tautan-tautan yang berkontribusi menimbulkan kesalahan dapat dilihat melalui menu “kesalahan perayapan” pada perkakas webmaster.

Perayap dan pengindeksan

Peringatan! Gunakan dengan hati-hati. Penggunaan yang tidak tepat dari fitur tersebut dapat mengakibatkan blog Anda diabaikan oleh mesin telusur.

robots.txt

Kustomisasi robots.txt dapat dimanfaatkan untuk mencegah perayapan mesin telusur terhadap halaman-halaman tertentu. Lebih jelas tentang robots.txt dapat dibaca pada posting About /robots.txt berdasarkan taut rekomendasi Blogger™. Contoh pengisian pada robots.txt:

User-agent: *
Disallow: /search/label/review
Disallow: /p/daftar-mesin-pencari.html
Disallow: /2011/06/ancala-real-estate.html
Sitemap: http://optimasi-blog.blogspot.com/sitemap.xml

Disallow akan memberitahukan kepada robot agar tidak mengunjungi halaman-halaman tersebut, dengan kata lain tidak dimasukkkan kedalam pengindeksan.

Sebagai tambahan, pengecekan terhadap tautan-tautan yang berkontribusi menimbulkan kesalahan dapat dilihat melalui menu “kesalahan perayapan” pada perkakas webmaster.

robots header tags

Berbagai pilihan yang dapat kita gunakan untuk kustomisasi robots header tags, dimana contoh pengaturannya — Optimasi Blog — seperti yang terlihat pada gambar di bawah ini.

Simpulan

Dengan mengetahui dan memahami kustomisasi pengaturan pada preferensi penelusuran setidak-tidaknya dapat menambah wawasan kita tentang bagaimana melakukan pengisian terhadap item-item tersebut. Dan tidaklah keliru jika kita juga memanfaatkannya — karena pada dasarnya memang telah dipersiapkan oleh pihak Developer — untuk lebih mengoptimalkan situs web/blog bermesin Blogger™ yang kita kelola.

Secara khusus untuk “robots header tags” menunjukkan bahwa persepsi saya selama ini salah besar untuk memasukkan markah di bawah ini sebagai robots header tags.

<meta content='INDEX, FOLLOW' name='robots'/>

Mengapa dikatakan salah besar? karena walaupun markah tersebut tidak dimasukkan pada template blog, ia telah ada lebih dulu atau merupakan default “robots header tags”.

Secara tidak langsung posting ini juga merupakan pembaharuan dari beberapa posting sebelumnya, seperti Memasang meta tags dan manfaatnya, Cara pasang title dan meta tags agar blog lebih SEO friendly, dan Tips search engine optimization (SEO) pada Blogger.com.

Jika narablog mempunyai pendapat lain mengenai kustomisasi pengaturan pada preferensi penelusuran, mari kita diskusikan pada kolom komentar.

Hilangnya Taut Hapus pada Komentar

Pernah mengalami “hilangnya taut hapus/delete (item-control)” pada sistem threaded comment Blogger™? Mungkin pula kawan-kawan sudah menemukan solusinya, dengan menambahkan CSS tertentu seperti:

.item-control {
display: inline;
}

Atau ketika kita rajin memeriksa pengkodean elemen sesuai dengan bawaan peramban kesayangan, maka akan diperoleh seperti di bawah ini.

span.blog-admin,
span.pid-xxx {
display:inline;
}

<span class="item-control blog-admin pid-xxx"><a o="d" target="_self" href="http://www.blogger.com/delete-comment.g?blogID=xxx&postID=xxx">Hapus</a></span>

Namun kendala yang dihadapi, ketika pengguna lain mengunjungi blog/situs kita ternyata “taut hapus/delete” itu masih menempel ‘kaya perangko’ pada komentar. :) Walaupun jika di klik oleh pengunjung tidak akan menimbulkan efek akan terhapusnya komentar yang ditarget. Padahal “taut hapus/delete” pada sistem komentar Blogger™ seharusnya diperuntukan bagi admin & tentu saja termasuk ‘sang empu’-nya komentar.

Hilangnya “taut hapus/delete” disebabkan raibnya hak (authorization) admin untuk melakukan sunting (edit) & hapus (delete) secara otomatis ketika blog/situs tampil penuh (tampilan sebenarnya) pada layar peramban. Dimana otorisasi tersebut diwujudkan dalam bentuk CSS (authorization.css) yang terintegrasi dengan bundle.css (embeded). Sedangkan hilangnya hak (authorization) tersebut, sangat dimungkinkan karena admin blog menghilangkan fungsi Navbar. Betul tidak? Bukan sok pintar, gan tapi hanya sekedar sharing.

Nah, untuk mengujinya coba munculkan kembali navbar bawaan Blogger™. Jika agak lupa dengan kode navbar, coba perhatikan markup berikut.

  <b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no'>
<b:widget id='Navbar1' locked='true' title='Navbar' type='Navbar'/>
</b:section>

Kemudian lacak ke halaman posting yang ada komentarnya. Yah, tidak kelihatan “pro” dong tampilan blog saya! Intinya ketika widget navbar dihilangkan atau mengkonfigurasi navbar menjadi off, maka “taut hapus/delete” akan hilang pula. (red: CMIIW)

Pengecualian, apabila widget navbar kita sembunyikan dengan menambahkan selector tertentu atau diapit dengan menggunakan CSS inline, misalnya:

<div class='fake'>
  <b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no'>
<b:widget id='Navbar1' locked='true' title='Navbar' type='Navbar'/>
</b:section>
</div>
<div class='clear'></div>

atau

<div style='display:none;margin:0;padding:0;height:0;'>
  <b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no'>
<b:widget id='Navbar1' locked='true' title='Navbar' type='Navbar'/>
</b:section>
</div>
<div class='clear'></div>

Dimana pengkodean CSS .fake sama dengan gaya penulisan kode CSS inline pada contoh di atas (warna merah). Sedangkan <div class='clear'></div> bersifat opsional, kode tersebut berfungsi untuk membersihkan elemen agar tidak tumpang tindih dengan baris kode di bawahnya atau lainnya. Dengan atribut serta nilai seperti di bawah ini.

.clear {
clear: both;
display: block;
height: 0;
overflow: hidden;
visibility: hidden;
width: 0;
}

Untuk Blogger™ peletakkan standar kode CSS berada antara <b:skin><![CDATA[ dan ]]></b:skin>. Jadi “taut hapus/delete” pada sistem threaded comment Blogger™ akan muncul, jika admin menyertakan widget navbar — walaupun ditampilkan secara sembunyi-sembunyi — dalam blognya.

Pilih mana, taut hapus/delete ada atau tidak ada?

Fitur Blogger Konfigurasi Navbar Off

Tentu narablog telah tahu sebelumnya, tentang cara atau trik blogger untuk menyembunyikan dan/atau menghilangkan navbar Blogger™? Bisa dengan menggunakan CSS — seperti display: none;, visibility:hidden; — atau dengan cara memasukkan HTML  di antara <head>…</head> atau sesudahnya. Semua hal tersebut mungkin dilakukan oleh karena ingin menampilkan ‘wajah blog’ agar lebih profesional serta aksesibel.

Saya & Anda mungkin telah acap kali membaca, bahkan menulis berbagai cara menghilangkan navbar Blogger™. Sama kondisinya ketika orang mulai mempelajari & menulis tutorial mengenai sistem komentar bersarang (threaded comment) pada Blogger™. Informasi-informasi tersebut tidak luput dari pantauan pihak pengembang (Developers), sehingga hasil pantauan tersebut menjadi rekomendasi untuk lebih memantapkan performa Blogger™ di masa mendatang.

Beralih ke topik pembicaraan tentang navbar Blogger™. Sekarang narablog tidak perlu lagi mencari atau mempelajari cara yang rumit, kalau tujuannya hanya untuk menghilangkan navbar Blogger™. Oleh karena Blogger™ telah menambah kebutuhan itu dengan beberapa langkah yang mudah.

Pertama, Login ke akun Blogger™ & pilih “Layout” (tata Letak) pada blog yang akan dikonfigurasi tampilan navbar-nya. Selanjutnya akan ditampilkan halaman layout, seperti pada gambar berikut.

Kedua, Pastikan widget navbar sudah include dalam template. Ketika layout telah menampilkan widget, tinggal klik edit (lingkaran merah) dan muncul pop-up (jedela kecil) untuk memilih konfigurasi navbar.

Ketiga, Pilih opsi terakhir “Off” & jangan lupa disimpan. Pengaruhnya, otomatis kita juga akan menghilangkan taut quick edit pencil (gambar pensil), widget item control (gambar kunci dan obeng), serta hilangnya taut hapus/delete pada komentar walaupun sedang dalam keadaan login.

Happy blogging :)