Cara Mengganti Template Blog

Cara Mengganti Template Blog | Tutorial Blog

Template blog atau website adalah desain halaman blog / website beserta seluruh komponennya seperti gambar, stylesheet, dsb, baik berupa file statis maupun file dinamis yang berupa program atau aplikasi yang berjalan sebagai aplikasi web.

Dulu saya pernah bikin postingan mengganti template blog, namun karena sekarang Blogger menggunakan Tampilan Baru, jadi saya bikin lagi tutorialnya yang baru.

Di blogger Sobat dapat mengganti template blog anda secara leluasa sesuai dengan selera dan keinginan sobat. Anda dapat menggunakan template buatan Anda sendiri untuk blog anda, bisa juga anda mengganti template blog dengan template dari penyedia template gratis. Namun, jika sobat masih belum bisa dalam membuat template, pihak blogger sendiri sudah menyediakan beberapa template yang bisa anda pilih.

Berikut ini cara mengganti Template dengan template yang disediakan blogger :

1. Login ke blogger.
2. Pada Dashboard Blogger pilih Blog yang ingin anda ganti templatenya.
3. Klik Template.
   
4. Klik tombol Sesuaikan.
   
5. Klik pada pilihan template yang tersedia.
6. Anda dapat melakukan pengaturan tampilan pada menu di sebelah kiri.
7. Jika sudah cocok dengan salah satu template, klik Terapkan ke Blog.
   
8. Selesai.

Untuk mengganti template dengan template dari penyedia template gratis, berikut caranya :

• Download template yang ingin di gunakan.
• Ekstrak file yang di download tadi, karena file yang akan kita upload ke blogger hanya file yang berekstensi .xml.
• Login ke Blogger.
• Klik Template.
• Klik Cadangkan/Pulihkan yang ada dibagian atas kanan.
• Untuk jaga-jaga backup template Anda terlebih dulu, klik Unduh Template Lengkap.
• Klik tombol Browse, pilih file template yang tadi telah diekstrak.
• Kemudian klik tombol Unggah.
• Tunggu sampai proses selesai. Setelah itu lihat hasilnya pada Blog Sobat.

Untuk lebih jelasnya silakan baca Cara Mengganti Template.

Sekian tutorial tentang Cara Mengganti Template Blog.

Mempublish posting Google+ ke Twitter

Mempublish posting Google+ ke Twitter | Tutorial Blog

Google+ memang belum menshare API Google+ sehingga para developer belum dapat mengembangkan aplikasi untuk menghubungkan atau melakukan autopost dari Google+ ke social media lain, namun sobat dapat mengakalinya dengan menggunakan layanan tertentu yang memungkinkan sobat untuk Mempublish postingan Google+ ke Twitter.

Aplikasi yang saya maksud adalah ManageFlitter, Aplikasi ini sebenarnya tidak menggunakan API, melainkan berlangganan posting user di Google+ dan meneruskannya menjadi tweet di Twitter.

Buat Sobat yang ingin mencobanya silakan ikuti tutorial berikut :

• Masuk ke manageflitter.com.
• Klik Try it for FREE.
  
• Klik Connect to Twitter, lalu sign in dengan akun twitter sobat.
  
• Pilih Free, klik Select Plan.
  
• Klik Dashboard.
  
• Pada Google+ To Twitter, klik Turn on/off Google+ sharing
  
• Hubungkan dengan Google+ anda. Masukkan url id Google +, pastikan akhiri dengan /posts.
  
  Url ID Google Plus dapat dilihat pada halaman profil Google+. Copy url ID pada bagian address bar. Setelah mendapatkan urlnya + diakhiri /posts.
• Klik Start Sharing.
  
• Jika sudah berhasil Anda akan melihat tampilan seperti berikut.
  
• Setelah proses selesai, maka post/status Google+ akan terkirim secara otomatis ke Twitter sebagai tweet. Pastikan post G+ anda di set ke public karena ManageFlitter hanya akan memposting post yg demikian.

Selamat mencoba dan semoga berhasil Mempublish posting Google+ ke Twitter

Cara Mengganti Template

Cara Mengganti Template | Tutorial Blog

Tutorial kali ini kita bahas cara untuk Mengganti Template Blog dengan template dari penyedia template gratis, karena selain menggunakan template standart dari blogger, Sobat juga dapat mengganti template blog anda dengan template dari penyedia template, sebelumnya download terlebih dahulu template yang ingin Sobat gunakan, untuk daftar Situs Penyedia Template Blog Gratis, silakan baca di sini : Situs Penyedia Template Gratis.

Berikut tutorial untuk mengganti template dengan template dari Situs Penyedia Template Gratis :

• Download template yang ingin di gunakan.
• Ekstrak file yang di download tadi, karena file yang akan kita upload ke blogger hanya file yang berekstensi .xml.
• Login ke Blogger.
• Klik pada blog yang akan di ganti templatenya.
• Klik pada Template.
  
• Klik Cadangkan/Pulihkan yang ada dibagian atas kanan.
  
• Untuk jaga-jaga backup template Anda terlebih dulu, klik pada Unduh Template Lengkap.
  
• Klik tombol Browse, pilih file template yang tadi telah diekstrak.
  
• Kemudian klik tombol Unggah.
  
• Tunggu sampai proses selesai. Setelah itu lihat hasilnya pada Blog Sobat.

Selamat mencoba dan semoga berhasil mengganti template Blog Anda.

Memasang Widget Google Plus

Memasang Widget Google Plus | Tutorial Blog

Google Plus merupakan salah satu media promosi yang paling efektif untuk meningkatkan traffic blog, karena itu akan lebih baik jika kita memasang widget Google plus di blog kita, jika semakin banyak orang di circle atau lingkaran sobat, maka semakin banyak pula link yang mengarah pada postingan sobat, dan itu sangat berpengaruh pada SEO.

Untuk dapat memasang widget Google Plus, terlebih dulu sobat harus meng-Upgrade Profile Blogger Ke Profile Google Plus. Jika sudah sobat dapat mengikuti langkah berikut ini :

• Login ke Blogger
• Klik Tata Letak > Tambah Gadget.
• Lalu pilih Pengikut Google +.
  
• Save dan lihat hasilnya

Untuk Memasang Widget Google Plus melayang (floating), sobat dapat mengikuti tutorial berikut :

• Login ke Blogger
• Klik Template > Edit HTML.
  
• Klik Lanjutkan.
  
• Beri centang pada Expand Template Widget.
  
• Cari kode ]]></b:skin>, lalu letakan kode berikut diatas kode ]]></b:skin>
  
  #gplus { position:fixed;_position:absolute; bottom:0px; right:0px; clip:inherit; _top:expression(document.documentElement.scrollTop+ document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
• Selanjutnya cari kode </body> dan letakkan kode berikut di atasnya :
  
  <div id='gplus'>
  KODE WIDGET
  </div>
  Ganti KODE WIDGET dengan kode badge Google +.
  Untuk mendapatkan kode badge Google + silakan klik developers.google.com
• Terakhir klik Simpan Template dan lihat hasilnya di blog sobat.

Silakan di coba Sob,,, Semoga Berhasil.

Memasang Tombol Share +1

Langsung saja Sob, berikut cara pasang tombol share G+1 :

• Login ke Blogger
• Klik Tata Letak > Tambah Gadget.
• Lalu pilih Tombol +1.
  
• Save dan lihat hasilnya.

Untuk Memasang Widget Google Plus melayang (floating), silakan ikuti tutorial berikut :

• Login ke Blogger
• Klik Template > Edit HTML.
  
• Klik Lanjutkan.
  
• Beri centang pada Expand Template Widget.
  
• Cari kode </head> lalu letakkan kode berikut diatasnya.
  
  <script src='http://apis.google.com/js/plusone.js' type='text/javascript'/>
  untuk Blog berbahasa indonesia gunakan kode berikut.
  
  <script type="text/javascript" src="http://apis.google.com/js/plusone.js">

    {lang: 'id'}

  </script>
• Cari kode ]]></b:skin>, lalu letakan kode berikut diatas kode ]]></b:skin>.
  
  #g_one { position:fixed;_position:absolute; bottom:0px; right:0px; clip:inherit; _top:expression(document.documentElement.scrollTop+ document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
• Selanjutnya cari kode </body> dan letakkan kode berikut di atasnya :
  
  <div id='g_one'>
  <g:plusone size='tall'/>
  </div>
• Terakhir klik Simpan Template dan lihat hasilnya di blog sobat.

Segitu aja Sob, semoga bermanfaat...

Serene Blogger Template

Serene Blogger Template | Tutorial Blog

Template Features

Platform Type	Blogger / Blogspot
Nama Template	Serene Blogger Template
Description	Serene Blogger Template adalah template blogger gratis dengan sidebar di sebelah kanan,  minimalist, simple, dengan motif sederhana.
Template Author	http://wadahtutorial.blogspot.com/
Instructions URL	Cara Mengganti Template

Cornert Blogger Template

Cornert Blogger Template | Tutorial Blog

Template Features

Platform Type	Blogger / Blogspot
Nama Template	Cornert Blogger Template
Description	Cornert Blogger Template adalah template blogger gratis dengan sidebar di sebelah kanan, simple, ringan dan motif yang sederhana.
Template Author	www.dotemplate.com
Instructions URL	Cara Mengganti Template

Menampilkan Share Buttons Bawaan Blogger

Share Buttons ini sangat bermanfaat buat blog karena dapat menjadi sarana bagi pengunjung untuk membagikan postingan kita ke situs-situs jejaring sosial. Share Buttons atau Tombol berbagi bawaan blogger terdiri atas Email, Blogger, Twitter, Facebook dan Google Plus.

Pada template hasil download biasanya tombol berbagi ini tidak di tampilkan, atau sengaja di hapus, karenanya kita harus melakukan beberapa langkah untuk menampilkan kembali share buttons bawaan blogger tersebut.

Buat sobat yang ingin menampilkan kembali share buttons bawaan blogger tersebut, silakan ikuti tutorial berikut:

• Login ke blogger.com
• Pada dashboard blogger, pilih Template.
• Klik pada Edit dibagian bawah posting blog.
  
• Beri centang pada Tampilkan Tombol Berbagi, lalu klik Simpan.
  

Silakan cek di blog sobat, jika share buttonsnya masih belum ada silakan lanjutkan ke langkah berikut :

• Klik pada Template. Sebaiknya Backup Template sobat terlebih dahulu.
• Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
• Beri tanda centang pada Expand Template Widget.
• Cari kode <data:post.body/>, jika ada dua pilih yang kedua, lalu letakkan kode berikut di bawahnya :
  
  <div class='post-share-buttons'>
  <b:include data='post' name='shareButtons'/>
  </div>
  Sobat juga bisa meletakkan kode tersebut dibawah kode <div class='post-footer-line post-footer-line-1'/>, terserah anda mau meletakkan di mana.
• Simpan Template, dan cek blog sobat.

Jika share buttons masih belum muncul, lanjutkan lagi ke langkah berikut :

• Cari kode dibawah ini :
  
  <b:includable id='shareButtons' var='post'>
  
  bla,, bla,, bla,,,
  
  </b:includable>
• Ganti dengan :
  
  <b:includable id='shareButtons' var='post'>
    <b:if cond='data:top.showEmailButton'><a class='goog-inline-block share-button sb-email' expr:href='data:post.sharePostUrl + &quot;&amp;target=email&quot;' expr:title='data:top.emailThisMsg' target='_blank'><span class='share-button-link-text'><data:top.emailThisMsg/></span></a></b:if><b:if cond='data:top.showBlogThisButton'><a class='goog-inline-block share-button sb-blog' expr:href='data:post.sharePostUrl + &quot;&amp;target=blog&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=270,width=475\&quot;); return false;&quot;' expr:title='data:top.blogThisMsg' target='_blank'><span class='share-button-link-text'><data:top.blogThisMsg/></span></a></b:if><b:if cond='data:top.showTwitterButton'><a class='goog-inline-block share-button sb-twitter' expr:href='data:post.sharePostUrl + &quot;&amp;target=twitter&quot;' expr:title='data:top.shareToTwitterMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToTwitterMsg/></span></a></b:if><b:if cond='data:top.showFacebookButton'><a class='goog-inline-block share-button sb-facebook' expr:href='data:post.sharePostUrl + &quot;&amp;target=facebook&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=430,width=640\&quot;); return false;&quot;' expr:title='data:top.shareToFacebookMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToFacebookMsg/></span></a></b:if><b:if cond='data:top.showOrkutButton'><a class='goog-inline-block share-button sb-orkut' expr:href='data:post.sharePostUrl + &quot;&amp;target=orkut&quot;' expr:title='data:top.shareToOrkutMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToOrkutMsg/></span></a></b:if><b:if cond='data:top.showDummy'><div class='goog-inline-block dummy-container'><data:post.dummyTag/></div></b:if>
  </b:includable>
• Simpan Template, dan cek blog sobat.

Jika sampai langkah ini share buttons masih belum muncul juga, Ane ga tau lagi tu template maunya apa?!?

Happy Blogging...

TB-Neat Blogger template

Template Details :

Platform Type	Blogger / Blogspot
Nama Template	TB-Neat Blogger template
Deskripsi	TB-Neat Blogger template adalah template blogger gratis dengan sidebar di sebelah kanan dengan motif sederhana, auto readmore, dan social profiles.
Template Author	http://wadahtutorial.blogspot.com/
Instruksi URL	Cara Mengganti Template

TB-Nofx Blogger Template

Kali ini saya ingin berbagi template gratis, TB-Nofx Blogger Template. Template ini bukan template yang keren, karena saya menjaga kesederhanaan pada template ini, namun template ini tergolong ringan karena hampir tidak menggunakan image.

Template Features :

Platform Type	Blogger / Blogspot
Nama Template	TB-Nofx Blogger Template
Template Author	http://wadahtutorial.blogspot.com/
Instructions URL	Cara Mengganti Template

Menghapus / Menghilangkan Navbar Blogger

Navbar (navigation bar) default dari blogger biasanya terletak pada bagian paling atas dari sebuah blog. Navbar ini sering kali di hapus oleh para blogger karena di anggap memiliki kode yang tidak valid atau error, di samping stylenya yang kurang memuaskan bagi para blogger.

Pada tutorial ini saya akan share cara untuk menghilangkan navbar blogger tersebut ataupun hanya sekedar menyembunyikannya saja.

Berikut salah satu caranya :

• Masuk ke akun blogger anda
• Klik pada Template. (jangan lupa backup dulu template anda, untuk menghindari sesuatu yang tidak diinginkan).
• Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
• Beri tanda centang pada Expand Template Widget.
• Cari kode ]]></b:skin>, lalu letakkan kode berikut diatas kode ]]></b:skin>
  
  #navbar-iframe {
  height:0px;
  visibility:hidden;
  display:none
  }
• Terakhir klik Simpan Template.

Pada langkah di atas sobat sudah menyembunyikan / tidak menampilkan Navbar bawaan Blogger, namun pada template blog sobat masih terdapat kode dari Navbar tersebut.

Untuk cara kedua Menghilangkan Navbar bawaan Blogger, Sobat dapat melakukan langkah di bawah ini :

• Sama seperti cara pertama. Masuk ke akun blogger anda
• Klik pada Template.
• Lalu klik Edit HTML dan klik Proceed / Lanjutkan.
• Beri tanda centang pada Expand Template Widget.
• Cari kode <body>, lalu letakkan kode berikut diatas kode <body>
  
  <script type='text/javascript'>
  <![CDATA[
  <!-- /*<body>*/ -->
  ]]>
  </script>
• Simpan Template Anda.
• Anda akan melihat gambar konformasi seperti di bawah ini.
  
• Klik Delete Widget untuk menghapus Navbar.

Jika Anda melakukan cara ini Anda juga akan menghapus Link Quick Edit gambar pensil, atau gambar kunci pas ama obeng di blog Sobat, namun cara ini sangat banyak mengurangi error pada blog.

Untuk cara ketiga dalam Menghapus / Menghilangkan Navbar Blogger, sama halnya dengan cara sebelumnya, cuma kode yang kita cari seperti dibawah ini :

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

Jika sudah ketemu, hapus kode tersebut lalu Simpan Template Anda.

Silakan Anda pilih cara mana yang Sobat gunakan untuk Menghapus / Menghilangkan Navbar Blogger.

Mengatasi Warning: At least one field must be set for HatomFeed

Warning: At least one field must be set for HatomFeed adalah salah satu pemberitahuan dari Rich snippets testing tools tentang kode blog Sobat yang kurang tepat.

Untuk memperbaikinya warning tersebut lakukan langkah dibawah ini :

• Masuk ke akun blogger anda
• Klik pada Template. (backup dulu template anda).
• Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
• Beri tanda centang pada Expand Template Widget.
• Tekan Ctrl + F di keyboard lalu cari kode hfeed, Sobat akan menemukan kode dibawah ini :
  
  <div class='blog-posts hfeed'>
• Kalau sudah ketemu hapus hfeed pada kode di atas, jadi hasilnya seperti ini :
  
  <div class='blog-posts'>
  Biasanya ada dua kode hfeed, hapus aja dua-duanya Sob.
• Terakhir klik Simpan Template, dan cek di Rich snippet tools.

Hanya itu tips dari saya tentang Mengatasi Warning: At least one field must be set for HatomFeed.

TBx2 Blogger Template

Template Features

Platform Type	Blogger / Blogspot
Nama Template	TBx2 Blogger Template
Deskripsi	TBx2 Blogger Template adalah template blogger gratis yang ringan,  simple, motif yang sederhana, dilengkapi dengan social profiles seperti Facebook, twitter, Google plus, dll.
Template Author	http://wadahtutorial.blogspot.com/
Instruksi URL	Cara Mengganti Template

Menampilkan Rich Snippet Rating Bintang 5

Rich Snippet Rating bintang berfungsi menampilkan Bintang lima untuk setiap artikel blog kita pada hasil pencarian di search engine Google, contohnya seperti gambar berikut Ini :

Sebenarnya saya belum mengerti betul apa kelebihan Rich Snippet, setidaknya pengaturan ini akan membuat hasil pencarian blog kita di Google tampak lebih professional karena dilengkapi rating meskipun itu buatan sendiri.

Untuk membuat Rich Snippet bintang 5, silahkan lakukan langkah berikut :

• Login ke blogger.
• Klik Template, Pilih Edit HTML dan lanjutkan.
• Setelah itu centang Expand Widget Template.
• Cari kode <data:post.body/>, gunakan Ctrl f pada browser anda untuk mencari.
• Tepat di bawah kode <data:post.body/> masukkan kode berikut
  
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div style='margin-top: 30px; font-size: 11px; color:#777;'>
    <div itemscope='' itemtype='http://data-vocabulary.org/Review'>
    <center>Judul: <span itemprop='itemreviewed'><data:post.title/></span>;  Ditulis oleh <span itemprop='reviewer'><data:post.author/></span>;  Rating Blog: <span itemprop='rating'>5</span> dari 5</center>
    </div>
    </div>
    </b:if>
  Jika ada 2 kode <data:post.body/>, letakkan di bawah keduanya.
• Terakhir klik Simpan Template

Untuk melakukan pengujian apakah pemasangan kode ini berhasil, silakan masuk ke halaman Google Rich Snippet Testing Tool. Pada halaman tersebut masukkan URL salah satu artikel anda ke dalam kotak yang bertuliskan "Enter a web page URL to see how it may appear in search results", Jika sudah memasukkan URL silahkan klik tombol Preview. Alat ini akan segera menampilkan contoh tampilan hasil pencarian blog anda di Google. Jika anda sudah melihat tampilan Rich Snippet yang disertai tanda bintang lima itu berarti pemasangan kode yang anda lakukan sudah berhasil.

Silakan di coba Sob, moga berhasil Menampilkan Rich Snippet Rating Bintang 5.

Eywo Blogger Template

Template Features

Platform Type	Blogger / Blogspot
Nama Template	Eywo Blogger Template
Description	Eywo Blogger Template adalah template blogger gratis yang ringan dengan 2 buah sidebar di sebelah kanan, space ads, minimalist, dan motif yang sederhana.
Template Author	http://wadahtutorial.blogspot.com/
Instructions URL	Cara Mengganti Template

Memperbaiki Missing Required Field "Updated"

Ketika saya cek blog ini di Webmaster Tools Rich Snippets Testing, ternyata terdapat peringatan Missing Required Field "Updated". Ini adalah pemberitahuan tentang kode time yang hilang atau kurang tepat, Ini cukup berpengaruh pada blog dan harus diperbaiki karena menyangkut verifikasi blog.

Buat sobat yang mengalami masalah yang sama, sobat dapat mencoba langkah di bawah ini untuk memperbaikinya :

• Masuk ke akun blogger anda
• Klik pada Template. (jangan lupa backup dulu template anda, untuk menghindari sesuatu yang tidak diinginkan).
• Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
• Beri tanda centang pada Expand Template Widget.
• Cari kode
  
  <abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr>
• Ganti kata 'published' dengan kata 'updated', seperti kode berikut :
  
  <abbr class='updated' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr>
• Simpan Template dan cek lagi di Rich Snippets Testing.

Selain cara di atas sobat juga bisa menggunakan cara lain untuk Memperbaiki Missing Required Field "Updated". misalnya menambahkan kode berikut :

<a class='updated' href='http://wadahtutorial.blogspot.com/' rel='bookmark'>Tutorial Blog</a>

Kode yang berwarna hijau ganti dengan alamat dan nama blog Sobat.

Letakkan kode tersebut diatas <b:if cond='data:post.hasJumpLink'> atau di bawah <div class='post-footer-line post-footer-line-1'> atau di bawah <div class='post-header-line-1'/>, terserah Sobat mau meletakkan dimana!!

Jika sudah silakan cek di Rich Snippets Testing Tools.

Segitu aja Sob, semoga bisa membantu dalam Memperbaiki Missing Required Field "Updated".

NofxSilver Blogger Template

NofxSilver Template adalah template blogger gratis. Sama halnya dengan TB-Nofx template, template ini merupakan template yang ringan, hanya warnanya saja yang saya rubah, namun tidak mengurangi kesan sederhana pada template ini.

Template Features :

Platform Type	Blogger / Blogspot
Nama Template	NofxSilver Blogger Template
Template Author	http://wadahtutorial.blogspot.com/
Instructions URL	Cara Mengganti Template

Memperbaiki Missing Required hCard "Author"

Sama halnya dengan Missing Required Field "Updated", peringatan yang satu ini juga sering di alami para blogger. Missing required hCard "author", Intinya ada kode yang kurang pada blog Sobat yaitu kode author yang tidak ada atau tidak tepat.

Untuk mengatasi Warning yang satu ini Sobat dapat mencoba langkah berikut :

• Login ke akun blogger anda
• Klik pada Template. (jangan lupa backup dulu template anda, untuk menghindari sesuatu yang tidak diinginkan).
• Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
• Beri tanda centang pada Expand Template Widget.
• Cari kode <b:if cond='data:post.hasJumpLink'>, dan letakkan kode berikut di atasnya.
  
  <div class='vcard' id='hcard-Madie Zha'>
  <span class='fn n'>
  <span class='given-name'><data:top.authorLabel/>
  <span class='fn'><data:post.author/></span></span>
  </span></div>
  Yang warna biru ganti dengan nama Sobat.
  *Sebenarnya sobat bisa meletakkan kode tersebut pada Post-header ataupun Post-footer, jadi tidak harus di atas <b:if cond='data:post.hasJumpLink'>.
• Terakhir Simpan Template dan cek blog sobat di Rich Snippets Testing.

Jika terdapat 2 warning seperti Missing required field "updated" dan Warning: Missing required hCard "author". Sobat dapat menggunakan kode berikut :

<div style='background-color: #F6F6F6; color: auto; border: 0px solid #eee; width:100%; margin: 0px; padding: 0.1px; font-family: Arial,Verdana,Sans-serif; font-size: small; text-align: left;'>
<div class='vcard' id='hcard-NAMA'>
<span class='fn n'> <span class='given-name'><data:top.authorLabel/>
<span class='fn'><data:post.author/></span></span></span></div>
 <a class='updated' href='http://wadahtutorial.blogspot.com/' rel='bookmark'>Nama Blog</a> Updated at: <abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></div>

Letakkan di atas <b:if cond='data:post.hasJumpLink'>. Lalu Simpan Template Anda.

Semoga berhasil memperbaiki Missing required hCard "author".

Mengatasi Missing Required Field "entry-title"

Warning: Missing required field "entry-title" adalah salah satu pemberitahuan dari Rich snippets testing tools tentang kode title blog Sobat yang kurang tepat. Untuk memperbaikinya ada beberapa cara, tergantung kode template yang sobat gunakan.

Untuk cara pertama, Sobat dapat melakukan langkah berikut :

• Masuk ke akun blogger anda
• Klik pada Template. (backup dulu template anda).
• Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
• Beri tanda centang pada Expand Template Widget.
• Tekan Ctrl + F di keyboard lalu cari kode hentry, Sobat akan menemukan kode dibawah ini :
  
  <div class="post hentry">
  <div class="post hentry uncustomized-post-template">
• Kalau sudah ketemu hapus kedua hentry pada kode di atas, jadi hasilnya seperti ini :
  
  <div class="post">
  <div class="post uncustomized-post-template">
• Terakhir klik Simpan Template, dan cek di Rich snippet tools.

Jika cara diatas tidak berhasil, silakan coba cara kedua :

• Masih di menu Edit HTML.
• Tekan Ctrl + F di keyboard lalu cari kode
  
  <h3 class='post-title.........' ></h3>
  Tergantung pada template blog Anda, blog Anda mungkin menggunakan tag H1 / H2.
• Ganti kode di atas dengan kode di bawah ini:
  
  <h3 class='post-title entry-title'>
• Simpan Template, dan cek di Rich snippet tools.

Hanya itu tips dari saya tentang Mengatasi Missing required field "entry-title".

Membuat Daftar Isi Label Tertentu

Pada kesempatan kali ini saya akan berbagi tentang tutorial membuat daftar isi berdasarkan salah satu label pada blog. Maksudnya gini, pada sebuah postingan biasanya kita tautkan pada sebuah Label, dan pada postingan yang lain kita menggunakan label yang lain, artinya terdapat beberapa label pada blog kita, dan kita ingin membuat daftar isi yang berisi hanya postingan dari salah satu label tersebut.

Untuk Membuat Daftar Isi Label Tertentu, Sobat dapat mengikuti tutorial berikut :

* Untuk Widget :

• Login ke dashboard blogger.
• Klik pada Tata Letak > Tambah Gadget.
• Pilih HTML/Java Script
  
• Lalu isikan kode berikut :
  
  <script src='http://html-scripts.googlecode.com/files/feedlabels.js'/></script>
  <script src="http://wadahtutorial.blogspot.com/feeds/posts/summary/-/Blogger Templates?max-results=10&alt=json-in-script&callback=recentpostslist"></script>
  Keterangan :
  wadahtutorial.blogspot.com ganti dengan alamat blog Sobat.
  Blogger Templates ganti dengan Label yang ingin ditampilkan.
  10 ganti dengan jumlah postingan yang ingin di tampilkan.
• Klik Save dan periksa blog Sobat.

* Untuk Halaman :

• Login ke blogger Anda, kemudian buat sebuah halaman dengan judul Daftar Isi.
• Kemudian klik pada tab Edit HTML.
  
• Lalu masukkan kode berikut :
  
  <div style="overflow:auto;height:450px;padding:10px;border:1px solid #eee">
  <script src='http://html-scripts.googlecode.com/files/feedlabels.js'/></script>
  <script src="http://wadahtutorial.blogspot.com/feeds/posts/summary/-/Blogger Templates?max-results=999&alt=json-in-script&callback=recentpostslist"></script>
  </div>
• Klik tombol Preview / Pratinjau untuk melihat hasilnya, jika sudah benar klik Publish Page / Tayangkan Laman. Lalu buka Blog Sobat dan lihat hasilnya…

Demikian tutorial kali ini, selamat mencoba dan semoga berhasil Membuat Daftar Isi Label Tertentu.

Elvetic Blogger Template

Template Features :

Platform Type	Blogger / Blogspot
Nama Template	Elvetic Blogger Template
Template Author	http://wadahtutorial.blogspot.com/
Instructions URL	Cara Mengganti Template

Memperbaiki Warning Rich Snippets Testing Tool

Rich Snippets adalah sebuah alat penguji yang memeriksa struktur data HTML dari template sebuah blog, pada saat kita melakukan pengujian dengan alat ini kadang ditemukan warning atau pesan kesalahan yang tentu saja akan lebih baik jika diperbaiki.

Ketika saya cek blog ini di Webmaster Tools Rich Snippets, ternyata terdapat beberapa peringatan, Artinya terdapat file yang di butuhkan hilang pada situs web, ini di anulir menjadi bentuk Peringatan / Warning!, karena tidak diketahui oleh fitur Rich Snippets yang terdapat di webmaster tools. Hal ini cukup berpengaruh pada sebuah blog, apalagi jika kita ingin menampilkan rating bintang atau photo profile Google+ pada hasil pencarian di search engine Google.

Agar blog kita lebih optimal tentu kita harus mengatasi hal tersebut, untuk itu kita akan sedikit merubah atau menambah kode pada template blog kita. Buat Sobat yang ingin mengetahui struktur data HTML dari template blog anda, silakan masuk ke Rich Snippets Testing tool, selanjutnya masukkan URL blog sobat, lalu lihat hasilnya apakah ada warning atau tidak, jika terdapat warning / peringatan sebaiknya sobat perbaiki.

Di bawah ini beberapa peringatan yang sering muncul saat test struktur data :

• Warning : Missing Required Field "Updated"
• Warning : Missing required hCard "author"
• Warning : Missing required field "entry-title"
• Warning : At least one field must be set for HatomFeed

Untuk memperbaiki beberapa peringatan tersebut, sobat dapat lihat pada artikel yang saya tulis dibawah ini:

• Memperbaiki Missing Required Field "Updated"
• Memperbaiki Missing Required hCard "Author"
• Mengatasi Missing Required Field "entry-title"
• Mengatasi Warning: At least one field must be set for HatomFeed

Semoga Artikel kali ini bisa bermanfaat buat Sobat dalam Memperbaiki Warning Rich Snippets Testing Tool.

Membuat Text Area dengan Tombol Highlight All

Membuat Text Area dengan Tombol Highlight All | Tutorial Blog

Tutorial kali ini saya akan coba berbagi tentang cara Membuat Text Area dengan tombol Highlight All. Dengan menggunakan Highlight All akan lebih memudahkan mengcopy kalimat/kode script yang ada di dalam text area.

Untuk membuatnya cukup mudah, silahkan copy kode dibawah ini :

<div>
<form name="copy">
<div align="center">
<input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Highlight All" /> </div>
<div align="center">
<textarea cols="20" name="txt" rows="4" style="height: 80px; width: 180px;" wrap="VIRTUAL">&lt;a href="http://wadahtutorial.blogspot.com/" rel="dofollow" target="_blank"&gt;Tutorial Blog&lt;/a&gt;</textarea></div>
</form>
</div>

Silahkan ganti tulisan yang berwarna biru dengan tulisan/ kode script yang anda inginkan. hasilnya akan seperti dibawah ini :

<a href="http://wadahtutorial.blogspot.com/" rel="dofollow" target="_blank">Tutorial Blog</a>

Sekian penjelasan singkat mengenai cara Membuat Text Area dengan tombol Highlight All.
Semoga bermanfaat . . .

Cara Mengetahui Duplikat Konten (Duplicate Content)

Duplikat Konten (Duplicate Content) dalam sebuah blog tentu sangat tidak bagus untuk SEO, karena duplikat konten dapat mengurangi kualitas hasil pencarian, akibatnya, kekuatan SERP suatu halaman blog di search engine menjadi lemah, karena itu kita perlu mengetahui apakah pada blog kita terdapat duplikat konten.

Perlu di perjelas bahwa duplikat konten yang saya maksud adalah konten yang ada pada blog kita, bukan duplikat konten dengan blog orang lain, maksudnya kesamaan konten antara postingan kita dengan postingan blog lain, biasanya ini terjadi karena kebiasaan copy paste. Jika ini terjadi tentu akibatnya akan lebih parah lagi, bisa-bisa blog kita di hapus oleh Google. jadi buat Copaser "berhati-hatilah dalam mengcopy artikel orang lain".

Untuk mengetahui duplikat konten yang ada di blog, kita dapat menggunakan Webmasters tools dari Google. Berikut caranya :

• Login ke Blogger.
• Masuk ke Webmasters tools
• Pilih blog yang ingin Sobat periksa.
  
• Klik Pengoptimalan > Penyempurnaan HTML.
  disana akan di beritahu laman yang bermasalah dan jumlahnya, lihat gambar.
  

Untuk mengoptimalkan SEO sebaiknya perbaiki kesalahan yang ada pada blog sobat, baik itu duplikat meta tag, duplikat meta deskripsi, ataupun masalah lainnya.

Sekian dulu artikel kali ini, untuk selanjutnya akan kita bahas Cara Mengatasi Duplikat Konten.

Trik Mempercepat Loading Blog

Untuk Mempercepat Loading Blog ada banyak cara yang dapat dilakukan, antara lain dengan cara mengkompress kode CSS/HTML biar ukurannya jadi lebih kecil, meng-Edit Template Supaya Valid XHTML, mengkompress Image supaya lebih optimize, dan lain-lain.

Untuk kali ini saya share cara yang lain, yaitu dengan menggunakan kode script yang dicoding secara khusus untuk mempercepat loading blog. dengan menggunakan kode script ini maka browser tidak akan membaca image/gambar di blog, sehingga dapat meringankan beban server dan mempercepat loading.

Berikut tutorial penggunaan kode script untuk mempercepat loading blog :

• Masuk ke akun blogger anda
• Klik pada Template. (jangan lupa backup dulu template anda, untuk menghindari sesuatu yang tidak diinginkan).
• Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
• Beri tanda centang pada Expand Template Widget.
• Cari kode </head> gunakan CTRL + F pada keyboard.
• Lalu letakkan kode berikut di atas kode </head>.
  
  <script charset='utf-8' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
  <script src='http://wadah-tutorial.googlecode.com/files/superload.js' type='text/javascript'/>
  <script charset='utf-8' type='text/javascript'> $(function() { $(&quot;img&quot;).lazyload({placeholder : &quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIJW4Nx0xhSVe3T8dtbZV-lO579vgFmj6d0oD5FdjzUfFtph22JKsrMH4PpYJwHTUsTjRXcGFnIZFk8qvMAuL9vLQIiJy7stcwDOnfBnl_D0m-xmWdIlg1dACjXpVS-tN9Z2QHYKdl7m4/&quot;,threshold : 200}); }); </script>
• Terakhir klik Simpan Template.

Sekarang lihat blog Sobat dan rasakan bedanya, semoga bermanfaat...

Mengatasi Duplikasi Deskripsi Meta

Duplikasi deskripsi meta pernah di alami blog ini, hal ini terjadi karena Google menemui deskripsi yang sama pada setiap halaman yg di crawl oleh Google spider pada laman blog ini, contoh :

Pada gambar diatas terdapat deskripsi yang sama, baik itu pada Homepage, halaman, maupun postingan, hal ini tentu tidak baik buat SEO, karena deskripsi yg sama dapat merusak relevansi pencarian, dan Google menganggapnya sebagai duplikasi konten, oleh sebab itu hal tersebut perlu kita perbaiki. Jika sobat belum tahu cara mengetahui duplikat konten silakan baca Cara Mengetahui Duplikat Konten.

Untuk memperbaiki masalah tersebut, langkah yang saya lakukan adalah sebagai berikut :

• Login ke akun blogger
• Klik pada Template.
• Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
• Beri tanda centang pada Expand Template Widget.
• Pada kode
  
  <meta content='Deskripsi'  name='description'/>
  <meta content='keyword1, keyword2, keyword3, ...' name='keywords'/>
  Sedikit saya tambah kode menjadi :
  
  <b:if cond='data:blog.url == data:blog.homepageUrl'>
  <meta content='Deskripsi'  name='description'/>
  <meta content='keyword1, keyword2, keyword3, ...' name='keywords'/>
  </b:if>
  Dengan begini meta description & meta keywords di tampilkan hanya untuk halaman utama (homepage).
• Terakhir klik Simpan Template.

Selain masalah diatas Duplikasi deskripsi meta juga bisa terjadi pada fungsi arsip, karna dalam sebuah arsip terdapat berbagai link dalam satu content , hal ini kadang juga di anggap sebagai duplikat konten oleh google.

Jika Sobat mengalami masalah ini Sobat cukup mematikan fungsi arsip, caranya dengan menambahkan kode berikut dibawah kode <head> :

<b:if cond='data:blog.pageType == &quot;archive&quot;'><meta content='noindex' name='robots'/></b:if>

Sekian dulu postingan kali ini, semoga bisa membantu Sobat yang ingin Mengatasi Duplikasi deskripsi meta.

RSS Feeds Dari Google Plus

RSS Feeds Dari Google Plus | Tutorial Blog

Google Plus merupakan salah satu jaringan sosial yang sedang ramai di gunakan oleh blogger-blogger untuk sekedar mencari teman atau untuk mempromosikan artikel blog. Saya akan berbagi tentang RSS feed dan perangkat gratis untuk menambahkan fitur di jaringan Google Plus. Ini akan mempermudah membaca RSS Feeds melalui Google+ to RSS.

Google+ to RSS adalah alat online gratis yang memungkinkan sobat menghasilkan RSS feed dari Google+ akun sobat. 

Berikut cara mendaftar di Google+ to RSS :

1. Masuk ke akun Google Sobat.
2. Silahkan sobat kunjungi situs Google+ to RSS.
3. Pada halaman awal klik Login Via Google +.
   
4. Lalu Klik Izinkan Akses.
   
5. Setelah selesai, maka Google+ to RSS otomatis akan membuat RSS feed dan lihat hasil RSS dari Google Plus.

Silahkan dicoba dulu Sob, dan semoga berhasil.

Tips Mengatasi Pencurian Artikel Blog

Ketika saya menemukan sebuah blog yang mencuri penuh artikel blog saya ini dengan menggandalkan fasilitas import pada feedrss, saya merasa jengkel, karena postingan yang kita ketik sendiri dengan susah payah dengan mudahnya dibajak oleh autoblog yang menggandalkan langganan feed pada blog, apalagi tidak di sertai dengan backlink sumbernya.

Karena itu kita jangan menganggap remeh pengaturan feed pada blog, agar para pencuri artikel tidak leluasa menerapkan aksinya, pada postingan ini saya ingin berbagi trik untuk mengatasi pencurian artikel dengan menyeting feed pada blog kita.

Berikut beberapa cara yang bisa kita terapkan pada blog :

Cara pertama dengan mengubah izin feed blog yang tadinya "penuh" menjadi "singkat".

Dengan cara ini pembajak feed hanya dapat mencopy artikel kita secara terbatas yaitu 400 karakter pertama saja.

Caranya :

• Login ke Blog sobat.
• Klik Dasbor > Setelan > Lainnya.
• Pada "Izinkan Umpan Blog", ganti opsi Penuh menjadi Singkat.
  
• Simpan Setelan

Cara kedua dengan memberikan link aktif alamat blog sobat pada kolom "Footer Feed Posting".

Ini berguna apabila pembajak feed mencopy penuh artikel sobat, maka dibawah postingan terdapat link aktif yang berfungsi menjadi backlink.

Caranya :

• Login ke Blog sobat.
• Klik Dasbor > Setelan > Lainnya.
• Pada "Footer Feed Posting" klik "Tambahkan".
  
• Lalu masukan script dibawah ini:
  
  <a href="URL BLOG">Copyright by: NAMA BLOG</a>
  contoh :
  <a href="http://wadahtutorial.blogspot.com/">Copyright by: Tutorial Blog</a>
• Simpan Setelan

Cara ketiga dengan menghapus feed pada Blogger.

Dengan cara ini para pembajak feed tidak dapat mencuri artikel anda, karena tidak ada feed yang akan di bajak, namun para pelanggan blog kita tidak dapat mengetaui update artikel baru di blog kita. Jadi dipikir dulu sebelum menerapkan cara ini.

Caranya :

• Login ke Blog sobat.
• Klik Dasbor > Setelan > Lainnya.
• Pada "Izinkan Umpan Blog" pilih "Tak Satupun".
  
• Simpan Setelan.

Semoga dengan beberapa cara di atas Sobat dapat lebih melindungi blog sobat dari para pembajak feed.

Upgrade Profile Blogger Ke Profile Google Plus

Upgrade Profile Blogger Ke Profile Google Plus | Tutorial Blog

Google+ adalah salah satu social media yang terus berkembang, dan hebatnya lagi, memiliki keunggulan dalam hal peningkatkan visibilitas di hasil pencarian Google.

Pada Tutorial kali ini saya akan berbagi cara meng-Upgrade Profile Blogger Ke Profile Google Plus. Dengan meng-Upgrade Profile Blogger kita mendapatkan beberapa manfaat, antara lain :

• Menambah jumlah teman di Google Plus dengan cepat.
• Meningkatkan traffic blog.
• Interaksi antara kita dan pengunjung blog kita sangat penting, maka menggunakan akun Google plus menjadi salah satu solusi yang tepat.
• Kita dapat dengan mudah berbagi posting, juga menshare artikel kita pada google plus. Share box secara otomatis akan muncul ketika Anda mempublikasikan posting, Anda dapat segera berbagi konten dengan orang lain.
• Sobat bisa membuat efek bintang google snippet, atau menambah photo Anda di sebelah kiri hasil penelusuran google.

Jika sobat tertarik untuk meng-upgrade profile blogger ke Profile Google Plus, silahkan ikuti langkah-langkah berikut :

• Login blogger
• Pada dashboard blogger pilih Google+
  
• Lalu Klik upgrade to Google+.
  
• Centang pada kotak I've read the above and ....... lalu Klik switch now.
  
• Kemudian Klik Add Blogs.
  
• Selesai.

Silakan di coba Sob, semoga berhasil.