Tampilkan postingan dengan label SEO. Tampilkan semua postingan
Tampilkan postingan dengan label SEO. Tampilkan semua postingan

CaraMudah Membuat Blog Menjadi SEO

1 komentar

Cara mengedit blogspot/blogger template agar SEO Friendly

Cara mengedit Blogspot agar SEO Friendly - Sepertinya juragan lagi tergila-gila buat belajar tentang SEO. Jadi kali ini postingnya juga masih tentang Tips SEO ( Search engine optimization ) * bener gak yah tulisannya  hhe * . Postingan kali adalah kumpulan dari semua cara yang juragan ketahui tentang men-SEO-kan template blogger / blogspot kita. Jadi kalo ada yang kurang silahkan sobat-sobat blogger tambahkan ilmu yang sobat miliki melalui kolom komentar. Tutorial step by step mengedit template blogger / blogspot agar SEO Friendly ini adalah hanya salah satu cara untuk meningkatkan SERP ( apa itu SERP dapat sobat baca disini ). Nah dari pada sobat ketiduran ngedengerin ocehannya juragan yang gak jelas, lebih baik kita langsung membahas step by step Complete SEO Guide untuk blogger templates :

1. Page Title
Biasanya format page title dari blogger kan seperti ini : JUDUL BLOG : JUDUL POSTING, nah agar blog kita lebih disukai oleh google sehingga ujung-ujungnya blog kita jadi rame, kita harus merubah format page title standart itu menjadi seperti ini : JUDUL POSTING | JUDUL BLOG. Caranya cari kode berikut di EDIT HTML ( cara mudahnya di Mozilla tekan ctrl +f lalu copy paste kode dibawah ini):
<title><data:blog.pageTitle/></title>

Kalo udah dapet kodenya hapus n ganti dengan kode berikut ini :

<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>

Atau sobat juga bisa tambahin beberapa kata kunci ( keyword ) :

<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/> | Kata kunci sobat | Kata kunci sobat </title>
</b:if>

Ganti kode "kata kunci" dengan keyword yang sobat incar. Setelah semua selesai jangan lupa di save template  

2. Meta keyword dan deskripsi
Suatu mesin pencari seperti google sangat menyukai sebuah website / blog yang jelas tema dan isi content-nya. Jadi , sobat harus nambahin suatu tag yang namanya meta tag. Caranya adalah dengan menambahkan kode berikut ini sebelum kode <b:skin><![CDATA[/*

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta name="description" content="Deskripsi Blog anda" />
<meta name="keywords" content="Kata kunci , kata kunci, kata kunci, kata kunci , kata kunci" />
</b:if>

Lalu ? ya di save aja  

3. memasang Breadcrumbs.
Breadcrumbs adalah menu navigasi yang ada diatas sebuah posting atau artikel. Contohnya bisa dilihat diblog-nya juragan ini. Cara pasangnya juga sudah banyak dibahas di blog-blog guru blogging. Silahkan sobat cari di google dengan kata kunci “ cara membuat menu breadcrumbs”.

4. memasang Related Post.
Related post sangat bagus untuk SEO maupun buat pengunjung. Jadi pasang related post di blog sobat. Caranya sudah banyak dibahas di blog-blog para guru blogging. Silahkan sobat cari di google dengan kata kunci “ cara membuat related post di blogger”.

5. Mematikan setting archive ( arsip )
Lho ? buat apa juragan ? begini nih, seperti yang juragan bilang tadikan kalo google sangat membenci dengan yang namanya duplicate content. Jadi ketika kita mengaktifkan opsi arsip, misalnya kejadiannya seperti ini :
sobat membuat sebuah blog di blogger.com. lalu membuat 3 posting, 1 buah setiap hari. Maka di halaman utama atau homepage sobat akan ada 3 posting dan sebuah link arsip seperti ini, http://BLOGSOBAT.blogspot.com/2007_03_01_archive.html, pada halaman arsip tersebut akan memunculkan 3 posting yang sama dengan yang di munculkan oleh homepage.
Intinya, 2 buah link yang menuju 2 halaman yang berbeda tapi memiliki isi konten yang sama. Bagi search engine apa lagi google ini adalah masalah serius. Oleh karena itu kita sebaiknya me-non-aktifkan opsi arsip, caranya : setelah login klik tab setting >> Archiving >> pada bagian Archiving frequency ubah menjadi no archive. >> selesai simpan setting.

Atau jika tidak ingin menonaktifkan fungsi arsip, silahkan letakkan kode berikut dibawah kode <head> :

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

6. Menambahkan kode ‘rel=canonical’
Gunanya kita menambahkan ‘rel=canonical’ adalah untuk menghindari konten ganda, karena seperti para master of SEO bilang bahwa google sangat tidak dapat mentolerir sebuah duplicate content ( *jadi buat yang kerjanya Cuma bisa copas hati-hati nih sebelum didepak dari gugel..xixixi*). Cara nya di edit html tambahkan kode berikut setelah kode <head>

<link expr:href='data:blog.url' rel='canonical' />

Save template dan selesai

7. Tag Heading
Google sangat menyukai sebuah tulisan atau judul dengan tag H1. Oleh karena itu ubahlah ukuran judul posting sobat dengan tag H1. Caranya cari kode berikut :

<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>
Kode yang dicetak tebal(warna orange) dihapus dan ubah dari h3(atau pada beberapa template menggunakan h2) menjadi h1. Setelah itu tambahkan kode berikut sebelum kode ]]></b:skin>

h1.post-title, .post h1 #Blog1 h1, #Blog2 h1 { font-size:1.5em; }

Nah, jadi Cuma segitu yang juragan tau tentang bagaimana men-edit blogger template kita biar jadi lebih SEO Friendly. Silahkan dicoba  , oia ampir lupa, lebih bagus lagi jika blog sobat dipasang read more nya. Tapi tidak juragan bahas karena rata-rata blogger sudah memasang read more-nya. Hmm, yang masih kurang ngerti silahkan Tanya melalui kolom komentar. Terima kasih sebelum dan sesudahnya.  

sumber blogjuragan

Cara Membuat Tempelate Seo Friendly

0 komentar

 
Setelah berulang kali gonta ganti template blog, dan berulang kali juga setting template agar seo friendly, dan berulang kali juga buka postingan di Blognya Juragan, sekarang kuputuskan untuk memposting sendiri cara-cara membaut template menjadi SEO Friendly, yang acuannya tetap ke blognya juragan "thanks ya Juragan ^_^"

langsung saja ya sob :

Masuk dasbor -->> Rancangan -->> Edit Html -->> klik kota Expand / download dulu template kamu sob :)

1. Mengubah Page Tittle

blog yang disukai oleh google adalah blog yang langsung menuju kepada judul postingan, visitor googler juga lebih mendahulukan judul postingan yang dicari ketimbang nama blog sobat, masalahnya page tittle asli masih mendahulukan nama blog baru kemudian judul postingan, sekarang ubah settingan tersebut dengan cara :

a. cari kode berikut ini (gunakan ctrl+f)

<title><data:blog.pageTitle/></title>

b. hapus kode tersebut dan ubah dengan kode di bawah ini:

<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>

Atau sobat juga bisa tambahin beberapa kata kunci ( keyword ) :

<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/> | KATA KUNCI | KATA KUNCI | KATA KUNCI </title>
</b:if>

c. save template

2. Mengubah Meta Discription dan Meta Keyword

suatu blog harus punya sesuatu untuk menggambarkan tentang keadaan blognya, disitulah fungsi dan tugas MD dan MK untuk membantu google dalam mendeteksi konsep blognya, tentu membantu visitor juga loh sob, caranya begini sob:

a. cari kode ini

<b:skin><![CDATA[/*




b. kemudian tambahkan kode dibawah  sebelum kode tadi

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta name="description" content="Deskripsi Blog Sobat" />
<meta name="keywords" content="KataKunci,KataKunci,KataKunci" />

</b:if>

c. save template


3. Memasang SEO Smart Link

 a. copy dan paste kode di bawah ini di atas kode </body>

<b:if cond='data:blog.url != data:blog.homepageUrl'><script type='text/javascript'>
function autoLink(){
    this.keywdHref = new Object();
    this.add = function(keyword, href){
        if(keyword.substr(0,1) != &quot; &quot;){keyword = &quot; &quot; + keyword;}
        this.keywdHref[keyword] =  href;
    }
    this.createAnchor = function(){
        var objs = document.getElementsByTagName(&quot;div&quot;);
        for(var i=0; i&lt;objs.length; i++){
            var obj = objs[i];
            if(obj.className.indexOf(&quot;post-body&quot;)&gt;-1){
                var content = obj.innerHTML;
                for(var keyword in this.keywdHref){
                    var href = this.keywdHref[keyword];
                    var newstr = content.replace(keyword, &quot;&lt;a href=&#39;&quot;+href+&quot;&#39;&gt;&quot;+keyword+&quot;&lt;/a&gt;&quot;, &quot;gi&quot;);
                    obj.innerHTML = newstr;
                    content = newstr;
                }
            }
        }
    }
    this.startScript = function(){
        var onLoad = window.onload;
        window.onload = function(){
            if(onLoad){onLoad();}
            setTimeout(&quot;f.createAnchor()&quot;, 100);
        }
    }
}
</script>
<script type='text/javascript'>
var f = new autoLink();
f.add(&quot;Software | Entertainment | Hobi Ngeblog | Artikel Bebas | Tutorial Blog&quot;, &quot;http://kep-katro.blogspot.com/&quot;);
f.startScript();
</script></b:if>


b. kode yang berwarna merah ganti dengan kata-kata yang seringkalian gunakan di setiap postingan kalian sob, kalo aku setiap posting pasti ada kata SOB.

c. save template


4. memasang Breadcrumbs


5. memasang Related Post

Memanjakan Visitor adalah hal yang paling utama, adakalanya visitor malas untuk mencari artikel terkait di daftar isi yang berantakan, nah itulah manfaatnya related post, cara pasangnya juga cukup mudah

a. Login ke Blogger.
b. Di halaman Dasbor, kita pilih Rancangan.
c. Kemudian pilih Edit HTML
d. Beri tanda centang pada Expand Template Widget
e. Cari kode </head>
f. Taruh (copy paste) kode berikut ini di atasnya

<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}


#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}



#related-posts  a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://blogergadgets.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->


g. Cari kode di bawah ini

<div class='post-footer-line post-footer-line-1'>

Atau jika tidak menemukannya cari kode berikut ini

<p class='post-footer-line post-footer-line-1'>

h. Jika sudah ketemu, taruh (copy paste) kode berikut ini di bawah salah satu kode di atas

<!-- Marquee Blogger Katro Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=12&quot;' type='text/javascript'/></b:if></b:loop>
<h3><b>Related Posts</b></h3>
<marquee align='center' behavior='alternate' direction='left' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=10;
var relatedpoststitle=&quot;&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script></marquee>
</div><div style='clear:both'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://kurniasepta.blogspot.com/2010/01/membuat-artikel-terkait-dengan-disertai.html' style='display:none;'>Thumbnail Related Post</a>
<a href='http://www.bloggerplugins.org/' style='display:none;'>blogger tutorials</a>
</b:if>
</b:if>
<!-- Marquee Blogger Katro Related Posts with Thumbnails Code End-->


h. save template



6. Mematikan setting archive ( arsip )

a. letakkan kode berikut dibawah kode <head> :

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


b. save template

7. Menambahkan kode �rel=canonical�


a. tambahkan kode berikut setelah kode <head>

<link expr:href='data:blog.url' rel='canonical' />

b. save template


8. Tag Heading

a. cari kode ini <h3 class='post-title entry-title'>

b. hapus dan ubah menjadi <h1 class='post-title entry-title'>

c. cari kode ini </h3>

d. ubah menjadi </h1>

catatan : poin a dan c ada didalam kode


<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

e. tambahkan kode berikut sebelum kode ]]></b:skin>

h1.post-title, .post h1 #Blog1 h1, #Blog2 h1 { font-size:1.5em; }

f. save template
9. Compress CSS
Kompress ini digunakan untuk template yang terlalu berat, copy CSS blog sobat biasanya CSS dimulai dari kode  <![CDATA[/*  sampai kode ]]></b:skin> nah paste di kolom yang tersedia di situs compressor ini dia situsnya www.minifycss.com dan hasilnya di copy dan pastekan kembali di kode html blog kamu sob, selesai, save template :)


mungkin itu saja yang bisa aku share sob, dapet ilmu dari juragan :)
semoga bermanfaat :)
Copyright 2011 Blog Kang Budi.
Blogger Template by Noct. | Distributed by Rocking Templates