30/12/12

Tampilan Posting dan Komentar Blog

Untuk tampilan post/pos sebenarnya bisa anda lihat langsung, disini hanya untuk menegaskan dan memudahkan pemahaman. Font/hurufnya adalah arial, tahoma dan verdana dengan ukuran 13px dan paragrafnya rata kanan-kiri/justifiy. Jadi anda tidak perlu repot-repot mengatur alignmentnya di entry.

Tampilan Posting dan Komentar Blog

Fitur-fitur pada posting nice seo template blogspot:
1. Breadcrumbs yang tampil di search engine
Breadcrumbs

2. Related posts
Untuk mengatur jumlah artikel terkait yang ingin ditampilkan, cari kode <div id='related-posts'> pada template dan lihat di bawahnya max-results=10. Ubah angka 10 sesuai dengan keinginan anda.
3. Modifikasi nama penulis dan waktu tanggal dengan gambar
4. Sharing button atau tombol berbagi ke jejaring sosial facebook, twitter dan digg.

Tes tampilan quote:
Bukan masalah copy paste, yang lebih penting adalah itikad baik dan keikhlasan anda untuk berbagi. Menjadi blogger yang lebih baik dengan memudahkan pembaca daripada faktor lainnya, agar google tidak penuh sampah.

Sedangkan tampilan komentar sangat sederhana, lihat beberapa tes yang aku lakukan di bawah. Untuk ikon penulis pada koment anda dapat menggantinya sesuka hati. Caranya ubah url gambar pada .komentar

Demikianlah penjelasan singkat tampilan posting dan komentar secara umum, semoga bermanfaat dan anda memahaminya.
Selengkapnya →
27/12/12

Edit Menu Navigasi Template Blog

Menu Navigasi ini penting sebagai pengganti Laman/Page yang biasanya digunakan untuk meletakkan link-link penting, seperti tukar link, daftar isi, kebijakan dll. Secara default menu navigasi pada Nice SEO Template, aku buat seperti ini:

<div id='menubar-nav'>
<div class='menubar'>
<ul>
<li><a href='/'>Home</a></li>
<li><a href='/'>Download Tempate</a></li>
<li><a href='/?m=1'>Tampilan Mobile</a></li>
<li><a href='/feeds/posts/default'>Post Rss</a></li>
</ul>
</div>

Menu Navigasi Blog

Untuk mengeditnya, masuk ke Edit HTML pada Template dan cari kode <div id='menubar-nav'>. Lalu anda bisa mengubah Anchor dan Linknya. Untuk link/url-nya anda tidak perlu menulis ulang semuanya, cukup tulis yang ada di belakangnya url blog karena tanda / sudah mewakili link blog.

Misal
Anchor Text: Download Template
Link: /

Aku akan mengubahnya menjadi:
url: http://albarony-template.blogspot.com/2012/12/pengenalan-dan-fitur-nice-seo-template.html
anchor: Fitur Nice SEO

Hasilnya seperti ini:
<li><a href='/2012/12/pengenalan-dan-fitur-nice-seo-template.html'>Fitur Nice SEO</a></li>

Di samping menu navigasi terdapat tombol search yang memudahkan pembaca untuk mencari artikel yang diinginkan. Sampai disini, semoga anda memahaminya.
Selengkapnya →

Tag Heading Dinamis h1 h2 h3 SEO Friendly

Penggunaan meta tag pada template ini menggunakan pendekatan dinamis, artinya adanya pergantian posisi antara tag pada judul blog dan judul posting. Sebelumnya juga, baca artikelku tentang macam-macam susunan tag heading.

Tag Heading H1 H2 H3 Blogspot

Pada beranda/home
tag h1: judul blog
tag h2: judul posting

Pada posting/artikel
tag h1: judul posting
tag h2: judul blog

Penggunaan Tag h3
Tag heading h3 berada pada sidebar blog dan iklan/ads header kanan. Yang harus anda perhatikan adalah ketika anda menambahkan gadet baru [Tambah Gadget], jangan lupa diubah tag headingnya karena secara otomatis tag-nya adalah h2.

Misal pada type HTML, Text
<h2 class='title'><data:title/></h2>

Pada type BlogArchive, Label
<h2><data:title/></h2>

Pokoknya gadget baru yang baru anda tambahkan ubah tag heading-nya dari h2 menjadi h3 dengan cara edit template.
1. Login blog
2. Masuk ke Template>Edit HTML centang Expand Template Widget
3. Ganti h2 menjadi h3 untuk setiap elemen/gadget di sidebar dan iklan kanan header. Untuk memudahkan gunakan tombol Ctrl+F pada keyboard.

Tag Heading h4
Tag h4 sama seperti pada template default blogger, yakni berada pada komentar.

Tips penting:
Hindari penggunaan Laman/Page dan gadget Pengikut/Follower karena tag headingnya tidak bisa diubah menjadi h3.
Untuk mengatasi Laman, gunakan Menu Navigasi seperti yang sudah aku sediakan di template blog ini. Sedangkan untuk Pengikut, gunakan kode di bawah ini nanti tampilannya seperti pada sidebar blog Arti Kehidupan.

<a href='http://www.Blogger.com/follow-blog.g?blogID=339236623710863710' onclick='window.open(this.href, &apos;dmfollow&apos;, &apos;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=no,width=599,height=521&apos;);return false;' title='Bergabung dengan 10.000 Blogger lainnya'><img rel='nofollow' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWhMvjG5uWDdhp9ndyLF_N1zk7k8g4O66g-pSFrrSqFrdZa8AiVPOdeFJeuDb06tuS7PsDFGcbLQr_yIxBdRcTZH3x6PhrITatJBsbojOaPsflHK_HFz2jYaqpmfR2GWzXqYtilkMtCC4/s1600/Follow+Blog.png' style='vertical-align:center;border:0px;cursor:pointer;'/></a>

Ganti tanda merah dengan ID blog anda, lihat di url address saat masuk dashboard blogger. Anda juga bisa mengganti tampilan gambar.

Sekian penjelasan sederhana Tag Heading Dinamis h1 h2 h3 SEO Friendly, semoga anda memahaminya dan bermanfaat.
Selengkapnya →

Meta Content Penelusuran Mesin Pencari [Search Engine]

Meta Tag Content pada fitur ini menunjukkan bagaimana tampilan situs blog anda di mesin pencari seperti google, yahoo, bing, aol dan search engine lainnya. Pada umumnya, tampilan yang biasanya digunakan para blogger sebagai berikut beserta penjelasannya.

Meta Content Tag Blogger

<b:include data='blog' name='all-head-content'/>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='Diskripsi Blog Anda' name='description'/>
<meta content='Keyword Blo Anda' name='keywords'/>
</b:if>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>

Ganti warna merah sesuai dengan diskripsi dan keyword blog anda. Keyword yang baik adalah tidak lebih dari 10 dan setiap keyword hanya terdiri dari satu kata. Misal,

<meta content='Template Blog Keren Cantik, SEO Blogspot Template, Simple Minimalist Template, Elegant Beautifull Blogger Skin, Download Template Blog Gratis' name='description'/>
<meta content='albarony, template, blog, seo, simple, keren, minimalist, blogspot, skin' name='keywords'/>

Tampilan Penelusuran Pada Posting:
Judul Artikel | Judul Blog
'kata-kata yang mengandung kata kunci pencarian'

Meta Penelusuran Blogger

Sebagai tambahan untuk memudahkan search engine menelusuri/crawl blog anda, dan juga melakukan pembatasan. Aku tambahkan beberapa atribut meta content di template blog, untuk penjelasannya bisa dibaca di metatags.info.

<meta content='true' name='MSSmartTagsPreventParsing'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<meta content='general' name='rating'/>
<meta content='blogger' name='generator'/>
<meta content='global' name='distribution'/>
<meta content='global' name='target'/>
<meta content='all' name='audience'/>
<meta content='ID' name='language'/>
<meta content='ID' name='country'/>
<meta content='ID' http-equiv='Content-Language'/>
<meta content='never' http-equiv='xpires'/>
<meta content='INDEX, FOLLOW' name='ROBOTS'/>
<meta content='index,follow,snipet' name='googlebot'/>
<meta content='follow, all' name='Googlebot-Image'/>
<meta content='follow, all' name='msnbot'/>
<meta content='follow, all' name='Slurp'/>
<meta content='follow, all' name='alexabot'/>
<meta content='follow, all' name='ZyBorg'/>
<meta content='follow, all' name='Scooter'/>
<meta content='ALL' name='SPIDERS'/>
<meta content='ALL' name='WEBCRAWLERS'/>
<link expr:href='data:blog.url' rel='canonical'/>

Sekian penjelasan sederhana karena aku bukan master seo jadi tidak bisa menjelaskan dengan rinci. Semoga bermanfaat dan memahaminya.
Selengkapnya →

Pengenalan dan Fitur Nice SEO Template Blogspot

Template Blog Nice SEO merupakan hasil karya pribadi yang telah diselesaikan bulan november 2012. Adapun topik dalam pembuatan template ini adalah perpaduan antara keindahan dengan tidak mengesampingkan seo (search engine optimization). Selengkapnya alasan pembuatan template ini, baca template blog terbaik.

Nama Template: Nice SEO Template Blogspot
Demo Template: AlBarony Template
Kredit Pembuat: Sekedar berbagi

Nice SEO Template Blogspot

Berikut ini fitur-fitur Nice SEO Template:
1. Meta penelusuran mesin pencari
2. Tag heading dinamis h1 h2 h3
3. Read more otomatis
4. Tampilan blog pager dengan judul posting
5. Menu navigasi dan tombol search
6. Iklan 468x60 pada header kanan
7. Penggunaan ikon pada penulis, label, waktu dan komentar
8. Artikel terkait di bawah posting
9. Tombol berbagi sosial ke facebook, twitter dan digg di bawah posting
10. Threaded comments
11. Tombol subscribe di sidebar
12. Akun sosial ala angry birds
13. Artikel terbaru pada sidebar
15. Tersedia tampilan mobile
15. dll

Jika dipersingkat, keunggulan utamanya sebagai berikut:
1. Simple and Minimalist but Elegant
2. Fast Loading
3. SEO Friendly

Itulah beberapa fiturnya, mungkin masih jauh dari kesempurnaan. Untuk penggunaannya akan dibahas dalam artikel tersendiri agar tidak ada kesalahan dalam penerapan template.
Selengkapnya →