Mereund Blog

Home » All posts

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

Menampilkan Gambar Profile dihalaman Hasil Pencarian Google

Bisa dipastikan robot Google sekalipun tidak mungkin bisa menentukan keaslian
suatu artikel, yang mungkin bisa tentu saja hanya penulis artikel itu sendiri.
Tapi dengan hadirnya fasilitas untuk menampilkan gambar Profile Anda dalam hasil
pencarian tentu ini akan menjadi cerita lain, selain terlihat bahwa Anda adalah
penulis sebenarnya dan itu juga menjadi kesan profesional buat Anda. Coba saja
Anda mencari artikel yang menarik di Google, Anda tentu akan melihat 10 hasil
pencarian pertama dan bisa dipastikan semuanya mempunyai judul yang hampir mirip
bahkan sama persis, lalu bagaimana jika di antara 10 hasil pencarian tersebut
terpajang wajah tampan Anda, tentu si pencari akan melirik Anda terlebih dahulu
walapun artikel blog Anda sendiri hanya berada pada urutan ke 6, itu karena
halaman Google sering berisi penuh dengan teks dan dengan demikian orang mungkin
akan tertarik lebih ke arah hasil yang memiliki beberapa elemen visual (foto
penulis) yang melekat padanya. Asalkan bukan artikel COPAS aja ya tar malah
malu2in, udah copas nampang pula hehehe

Cara menampilkan gambar Profile dihalaman hasil result Google:

CARA I:

1. Pertama, silahkan buat satu halaman "About me" di blog Anda, untuk
pengguna blogger Anda bisa membuatnya melalui halaman Statis Page atau bisa juga
menggunakan halaman Standar Post. Agar lebih mudah Anda bisa melihat halaman
"About me" milik saya
disini.

2. Buat satu Text Link yang mengarah ke halaman URL Profile Google+ Anda dan
jangan lupa menanamkan satu Tag rel="me" (ingat
hanya satu tag saja) dalam link tersebut.

<a href="https://plus.google.com/ID_Anda" rel="me">Agus Ramadhani</a>

3. Ini sangat penting, pastikan semua artikel diblog Anda terkait kehalaman
"About me". Caranya sangat mudah, Anda tinggal memasang saja link "About me" di
menu, saya sendiri memasangnya di halaman About dalam widget saya (lihat paling
bawah di blog ini ditandai dengan text link Read more
), dan pastikan Anda memasang Tag rel="author"
pada link tersebut.

<a href="http://www.blog-Anda.com/p/about-me.html"
rel="author">About me</a>

4. Langkah terakhir silahkan masuk ke halaman profile Google+ Anda disini
https://plus.google.com
dan tuju ke tombol "Edit Profile" kalau sudah silahkan tuju ke pengeditan
"Profile lainnya", biasanya Anda diminta untuk memasukan alamat blog Anda, nah disini Anda tinggal memasukan Link "About me" saja beserta
URL-nya.

Sampai tahapan ini sebenarnya sudah selesai dan biarkan google merayapi
halaman Anda terlebih dahulu. Perlu juga diketahui bahwa tidak ada jaminan
gambar anda akan tampil, semua tergantung analisa google itu sendiri setelah
merayapi halaman anda.

CARA II:

Cara yang kedua jauh lebih praktis dimana Anda tinggal
menambahkan satu badge icon profile saja, caranya silahkan langsung menggunakan
Profile Button Creator dialamat ini

http://www.google.com/webmasters/profilebutton

Pastikan cara kedua ini tidak berlaku jika Anda sudah menggunakan cara
pertama, jika tidak akan terjadi duplikat Profile Author.

Verifikasi Author

Agar gambar Profile Anda bisa tampil dan berjalan dengan sempurna sebaiknya
Anda perlu melakukan verifikasi dengan mengujicobanya terlebih dahulu.

1. Silahkan buka

Rich Snippets Testing Tool

2. Masukan salah satu link artikel (posting) Anda yang terbaru.

3. Jika tidak ada masalah maka gambar profile beserta nama Anda akan muncul
dan ditandai dengan nilai verifikasi yang bener.

Tips jika ada kesalahan

1. Pastikan Anda hanya menggunakan kedua tag rel="me" dan rel="author"
diatas satu kali saja jangan sampai ada duplikat.

2. Pastikan Anda benar-benar memasukan gambar Anda pada Profile Google+,
sebaiknya termasuk dengan Isi biodata Anda secara lengkap.

3. Pastikan halaman profile Google+ Anda benar-benar terkait dengan halaman
blog Anda, termasuk halaman About me tadi.

4. Google akan memilih thumbnail gambar dari halaman Profil Google+ Anda,
sebaiknya gunakan gambar yang sebenarnya dari diri Anda sendiri (bukan ikon).
Gambar harus terlihat baik bahkan ketika dikompresi menjadi gambar thumbnail
50x50.

Silahkan baca dokumentasi selengkapnya
disini

Semoga tutorial diatas berguna :)

Cara Memasang Tombol Google+ di Blogger

Saya yakin pembaca setia blog ini tidak kesulitan untuk memasang tombol Google+ (G+), tapi tidak semua juga mengerti caranya, terlebih yang baru
belajar ngeblog. Selain itu disini saya juga mencoba menjelaskan secara
rinci dari beberapa masalah yang kadang membuat tombol Google+ tidak bekerja
sebagaimana mestinya. Jadi silahkan luangkan waktu sejenak untuk belajar
tutorialnya dibawah ini:

Langkah memasang tombol G+ sangat mudah silahkan ikuti tutorial dibawah
ini

Silahkan memasang Script dibawah ini atas Tag </body>

<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>

Kemudian anda bisa memasang tombol G+ dimana saja dengan menambahkan kode
dibawah ini.

<g:plusone size="small"></g:plusone>

Cara memasang tombol G+ diatas sebenarnya sudah selesai, tapi jika anda ingin
menambahkan kode yang lebih rinci anda bisa mencoba beberapa script dibawah ini:

Tombol G+ dengan ukuran Standar (24 piksel)

<g:plusone></g:plusone>

Tombol G+ dengan ukuran Kecil (15 piksel)

<g:plusone size="small"></g:plusone>

Tombol G+ dengan ukuran Sedang (20 piksel)

<g:plusone size="medium"></g:plusone>

Tombol G+ dengan ukuran Tinggi (60 piksel)

<g:plusone size="tall"></g:plusone>

Tombol G+ Untuk HTML5

<div class="g-plusone" data-size="standard" data-count="true"></div>

Anda juga dapat membuat custom tombol G+ sendiri

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
  {"parsetags": "explicit"}
</script>
<script type="text/javascript">
  function renderPlusone() {
    gapi.plusone.render("plusone-div");
  }
</script>
<body>
  <a href="#" onClick="renderPlusone();">Render the +1 button</a>
  <div id="plusone-div"></div>
</body>

Custom Tombol G+ dengan URL khusus

<!-- customized for a specific address -->
<g:plusone href="https://plus.google.com/108442421331149025926"></g:plusone>

Untuk customize tombol G+ saya menyarankan anda memasukan url dari Google+ profile atau halaman (page) G+ yang sudah ada buat, lihat tutorialnya disini

Cara pasang Tombol G+ disebelah Tombol Facebook (dalam halaman posting)

Kode standar Google+ tidak bekerja pada postingan dalam lingkup halaman
home (index).

Pada halaman Posting dengan menggunakan kode

<G:Plusone/>
biasanya tidak terjadi masalah, tapi saat kalian mencoba memasang tombol G+ yang
ditujukan pada halaman post yang letaknya berada dalam halaman utama ini
biasanya bermasalah karena G+ setahu saya tetap akan mendeteksi sebagai halaman
index bukan sebagai halaman post. Untuk mengatasi masalah ini silahkan mencoba
menggunakan kode ini <g:plusone expr:href='data:post.url'/>

Sebenarnya G+ sendiri sudah menyedian Custom Badge yang bisa anda coba
langsung di alamat ini
disini atau
anda bisa melihat informasi Full API selengkapnya
disini

Jangan lupa bergabung dihalaman G+ saya:

Halaman Resmi Agus Ramadhani

Halaman Resmi o-om.com

Halaman Resmi
Zoomtemplate.com