Trik Hack Dasar Blogger Template (Agar Template Lebih SEO Friendly)

Category : Labels: , , , , , , , , , ,

Hack Dasar Blogger Template
Berikut beberapa List trick hack template blogspot agar lebih nyaman dimata Search Engine (SEO Friendly). Dan membuat blog anda mempunyai kesempatan tampil di halaman pertama Search Engine. Berikut dasar-dasar hack dalam membuat template blogger sendiri.

Memasang Favicon
Untuk memasang/mengganti favicon blogger copas kode dibawah ini di bawah kode <head>

<link href='Alamat Tempat favicon Anda' rel='shortcut icon'/>
<link href='Alamat Tempat favicon Anda' rel='icon' type='image/gif'/>

Atau dengan menggunakan kode dibawah ini. Letakkan kode dibawah ini diatas kode </head>
<link rel="shotcut icon" href="..alamat tempat favicon.ico anda.."/>
atau
<link href='..alamat tempat favicon.ico anda..' rel='icon' type='image/vnd.microsoft.icon'/>
atau
<link href='...alamat favicon anda...' rel='icon' type='image/x-icon'/>

Menghilangkan Navbar Blogger
Kenapa harus dihilangkan?. Agar lebih kelihatan profesional kalau menurut saya, walaupun dibelakang URL blog tetap ada embel-embel .blogspot.com. Tapi tetap saja lebih kelihatan profesional. Soalnya navbar blogger tidak stylis. ehehe..
Masukkan kode berikut ini di atas kode ]]></b:skin>

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}


Mouse Over Navbar blogger (Menghilangkan Navbar Blogger tapi, akan tampak kembali bila disorot oleh mouse.)
#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}


Menghapus Quick Edit (Menghilangkan Icon Obeng dan Tang)
Kenapa ini harus dihilangkan ?. Sebenarnya tidak harus, cuman saya pribadi menjadi agak risih bila melihat template blog tidak bersih dan dipenuhi dengan icon obeng dan tang dimana-mana, walaupun hanya kita saja yang tahu, tapi tetap saja mengganggu.. hehe.. Tapi, kembali lagi pada diri anda.
Pasang kode berikut diatas kode ]]></b:skin>

.quickedit{
display:none;
}
Atau langsung saja dengan menghapus kode berikut satu persatu sampai habis. Dengan menggunakan CTRL+F untuk lebih mudah melakukan pencarian.
<b:include name='quickedit'/>

Menghilangkan Angka Dalam Label
Ini mungkin menjadi ciri khas tersendiri bagi sebagian orang, tapi bagi sebagian lainnya, ini merupakan pengganggu dalam keindahan sebuah template. Untuk menghilangkannya Cari kode berikut dibawah ini (gunakan CTRL+F agar lebih mudah) dan hapus kode berikut. Jangan lupa untuk mencentang kotak cek Expand Widget Templates.
(<data:label.count/>)

Menghapus Feed Link (Menghilangkan tulisan Subscribe to : post (atom).
Feed Link, kadang juga bisa berguna untuk kita, karena kemudahannya untuk digunakan langsung mensubscribe (membookmark) / menyimpang link feed bila belum disediakan oleh pemilik blog. Nah, bila sudah tersedia dengan desain indah jadi saya kira malah mengganggu pemandangan.

CSSnya.
.feed-links {
clear: both;
line-height: 2.5em;
}




HTMLnya
<b:includable id='feedLinksBody' var='links'>
  <div class='feed-links'>
  <data:feedLinksMsg/>
  <b:loop values='data:links' var='f'>
     <a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
  </b:loop>
  </div>
</b:includable>

Atau seperti dibawah ini.
<div class="feed-links">
<data:feedlinksmsg>
<b:loop values="data:links" var="f">
<a class="feed-link" href="data:f.url" type="data:f.mimeType" target="_blank"><data:f.name> (<data:f.feedtype>)</data:f.feedtype></data:f.name></a>
</b:loop>
</data:feedlinksmsg></div>

Menghilangkan Pesan Pencarian Blogger
caranya masukan kode berikut diatas ]]></b:skin>
.status-msg-wrap{
display:none;
}


Menghilangkan Logo Blogger di Comment
Biar tidak terkesan gratisan dan biar kelihatan lebih profesional kalau menurut saya.. ehehe..
cari kode berikut:
<dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>

ganti dengan:
<dt expr:class='&quot;comment-author &quot; + data:comment.anchorName' expr:id='data:comment.anchorName'>

Reset Heading
1. Pembenahan Pada Judul Post 
pada kode CSS secara default tersusun sebagai berikut
.post h3 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:$titlecolor;
}

.post h3 a, .post h3 a:visited, .post h3 strong {
display:block;
text-decoration:none;
color:$titlecolor;
font-weight:normal;
}

.post h3 strong, .post h3 a:hover {
color:$textcolor;
}

Pada kode HTML
<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>

Ganti kode heading h3 menjadi h2.

2. Pembenahan pada judul pada Sidebar/Footer (Widget)
Pada kode CSS :
h2 {
margin:1.5em 0 .75em;
font:$headerfont;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color:$sidebarcolor;
}
dan pada HTML nya
<h2 class='title'><data:title/></h2>

Ubah kode h2 menjadi h3

3. Pembenahan pada Date (Tanggal) 
Penanggalan tidak terlalu mempunyai arti bagi kekuatan SEO, jadi kita tidak membutuhkannya. Untuk itu kita hilangkan saja tag heading pada 'Date'.
Pada kode CSS :
h2.date-header {
margin:1.5em 0 .5em;
}
hilangkan kode h2 nya sehingga menjadi seperti berikut :
.date-header {
margin:1.5em 0 .5em;
}
dan pada HTML :
<h2 class='date-header'><data:post.dateHeader/></h2>
ganti kode h2 menjadi div . Sehingga menjadi seperti berikut :
<div class='date-header'><data:post.dateHeader/></div>
Update :
Pembenahan Pada Title Blog (Judul Blog Agar Lebih SEO Friendly
Ganti kode berikut, bila masih ada di template anda

<b:include data='blog' name='all-head-content'/>
    <title><data:blog.pageTitle/></title>

Dan ganti dengan kode berikut dibawah :

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>
<meta content='Tulis Deskripsi Blog anda disini, ini yang disebut meta description' name='description'/>
<meta content='Tulis Keyword blog anda di sini' name='keywords'/>

biasanya terletak dibawah <head>  dan diatas kode <b:skin><![CDATA[/*

22 Komentar:

Memasang Favicon >> sementara aq masih setia dengan bawaan blogger

Menghilangkan Navbar Blogger >> sementara juga masih aq pertahankan

Menghapus Quick Edit (Menghilangkan Icon Obeng dan Tang) >> kalau d hilangkan malah Ribet aq ngeditnya


Menghilangkan Angka Dalam Label >> sudah aq hilangkan

Reset Heading dan seterusnya >> langsung tak coba

terima kasih sob

kalau mau ganti blog gimana caranya? hehe....

@Rizky : Sama -sama Rizky :)
@Bang Arif : Bikin blognya, trus export postingannya atau copas langsung, trus deactive atau hapus blog lama beserta link sitenya.. ehehe..

bagus itu gan.....
sangat bermanfaat nich...
makasih ya....
kikikikikikik

ane coba terapkan kang

menarik tipsnya, perlu dicoba nih....

WAH. TRIKNYA SANGAT KOMPLIT SOB...
BISA LANGSUNG DIPRAKTEKKAN NICH..

mantap nih mas...
bookmark dulu, ntar dicoba...

makasih tips nya mas...

Semakin memperkaya refernsi nih...

nice...nice....thx atas infonya

kalau cara satu dan dua saya tidak setuju, karena itu melanggar TOS blogger. Dan berkesempatan untuk di banned blognya.

mantap boss. bookmark dulu :) makasih ya atas sharing-nya

@Gado-Gado : Menurut saya tidak apa-apa mas, :) banyak blog-blog yang terkenal, memakai favicon sendiri, dan juga ada yang menghilangkan navbar, seperti bloggerplugins.org. :)

hehehe makasih bro
mencoba untuk dipraktekan,.,,

bos, kalo ganti atau hilangin logo blogger di url gimana?

@ Anonymous : Secara Default sich, Logo itu kayak gimanapun gak bisa dihilangkan..
Usaha kita hanya bisa sampe menindasnya saja.. yaitu dengan memasang favicon diatas favicon blogger itu..
Caranya ada diatas.. baca saja dech..

Wahhh. . . . .
Berat gan.

Salam kenal ya.., triknya dah qpake separoh.., thanks infonya.. mamfaat buat q.., yuk mampir di temptq

makasih ya

http://bisnisbersama20.blogspot.com/

seeep bos thanks :)

Post a Comment