Featured Post

13 Template Blog SEO Friendly, Responsive, Simple, Ringan, Gratis Free Download

Koleksi 13  Template Blog berikut ini sudah SEO Friendly & Responsive. Ramah mesin pencari, tamah seluler (mobile friendly), dan kabar ...

Cara Membuat Menu Blog plus Media Sosial di Atas Header

0 Follow @romel_tea
Berikut ini cara membuat navigasi menu di atas header blog plus link media sosial, responsive dan fast loading. Ringan, soalnya tanpa kode javascript. Hanya CSS.

Berikut ini tampilan topmenu di desktop dan mobile (HP). Bisa juga dipasang di bawah header. Namun biasanya kalau icon medsos dipasangnya di top menu.
Cara Membuat Menu Blog plus Media Sosial di Atas Header

Cara Membuat Menu Blog plus Media Sosial di Atas Header

Navigasi menu di topbar ini sudah termasuk menu dropdown. Jadi, sangat bagus dan kekikian. Ini dia cara memasangnya di blog Blogger.

1. Klik Tema > klik Edit HTML
3. Copas kode berikut ini di atas kode </head>

<style>
#menutop{width:100%;margin:0 auto;height:45px;background:#fff;border:1px solid #e9e9e9;}
#menutop ul,#menutop li{margin:0;padding:0;list-style:none;}
#menutop ul{height:45px}
#menutop li{float:left;display:inline;position:relative;font-family:&#39;Open Sans&#39;;font-size:12px;
font-weight:bold;}
#menutop a{display:block;line-height:45px;padding:0 14px;text-decoration:none;color:#919392;}
#menutop ul li:hover a{color:#666;}
#menutop input{display:none;margin:0 0;padding:0 0;width:100%;height:45px;opacity:0;cursor:pointer}
#menutop label{font-family:&#39;Open Sans&#39;;font-size:30px;font-weight:400;display:none;width:35px;height:45px;line-height:45px;text-align:center;}
#menutop label span{font-size:13px;position:absolute;left:35px}
#menutop ul li ul{height:auto;overflow:hidden;position:absolute;z-index:99;color:#919392}
#menutop ul li ul li a{color:#919392;height:45px;line-height:45px;background:#fff;width:100%;}
#menutop ul.menux{visibility:hidden;opacity:0;height:auto;overflow:hidden;background:#fff;position:absolute;z-index:99;color:#919392;box-shadow: 0px 2px 3px rgba(0,0,0,0.1);top:10px;transition:all 0.3s ease-in-out;}
#menutop li:hover &gt; ul.menux{visibility:visible;opacity:1;top:45px;}
#menutop a.dutt{padding:0 27px 0 14px}
#menutop a.dutt::after{content:&quot;\f0d7&quot;;font-family:FontAwesome;margin:0 auto;width:10px;height:10px;line-height:45px;position:absolute;top:0;right:10px;}
#menutop a.dutt:hover::after,#menutop ul li:hover a.dutt::after{content:&quot;\f0d7&quot;;font-family:FontAwesome;margin:0 auto;width:10px;height:10px;line-height:45px;position:absolute;top:0;right:10px;}
#menutop ul.menux li a{background:#fff;color:#919392;}
#menutop ul li ul li a:hover{background:#fcfcfc;color:#8493a0;}
#menutop li.facebook {padding:0 5px;}
#menutop li.facebook,#menutop li.twitter,#menutop li.youtube,#menutop li.googleplus,#menutop li.linkedin{background:#fff;text-align:center;color:#666;float:right;transition:all 0.2s ease-in-out;}
#menutop li a.facebook:hover,#menutop li a.twitter:hover,#menutop li a.youtube:hover,#menutop li a.googleplus:hover,#menutop li a.linkedin:hover{color:#8493a0;}
#menutop li.facebook .fa.fa-facebook,#menutop li.twitter .fa.fa-twitter,#menutop li.youtube .fa.fa-youtube,#menutop li.googleplus .fa.fa-google-plus,#menutop li.linkedin .fa.fa-linkedin{color:#919392;transition:all 0.2s ease-in-out;}
#menutop li.facebook:hover,#menutop li.twitter:hover,#menutop li.youtube:hover,
#menutop li.googleplus:hover,#menutop li.linkedin:hover{background:#fcfcfc;color:#8493a0;}
#menutop li.facebook:hover .fa.fa-facebook,#menutop li.twitter:hover .fa.fa-twitter,#menutop li.youtube:hover .fa.fa-youtube,#menutop li.googleplus:hover .fa.fa-google-plus,#menutop li.linkedin:hover .fa.fa-linkedin{color:#8493a0;}
@media screen and (max-width:960px) {
#menutop li:hover &gt; ul.menux{display:block;}
#menutop ul{border:none;border-bottom:4px solid #e9e9e9;}
#menutop{position:relative;border:none;border-bottom:4px solid #e9e9e9;}
#menutop ul{background:#fff;position:absolute;top:100%;right:0;left:0;z-index:3;height:auto;display:none;}
#menutop ul.menux{width:100%;position:static;border:none}
#menutop li{display:block;float:none;width:auto;text-align:left}
#menutop li a{color:#666}
#menutop li a:hover{background:#f1f1f1;color:#f9f9f9}
#menutop li:hover{background:#8493a0;color:#fff;}
#menutop a.dutt{font-weight: bold;}
#menutop li:hover &gt; a.dutt,#menutop a.dutt:hover{background:#b1b1b1;color:#fff;}
#menutop input,#menutop label{display:inline-block;position:absolute;right:0;top:0;}
#menutop input:after,#menutop label:after {content:&quot;\f0c9&quot;;font-family:FontAwesome;
font-style:normal;font-weight:normal;text-decoration:none;font-size:30px;color:#666;
display:inline-block;position:absolute;right:15px;top:25%;line-height:30px;}
#menutop input{z-index:4;}
#menutop input:checked + label{color:#fff;font-weight:700}
#menutop input:checked ~ ul{display:block}
#menutop ul li ul li a{width:100%;color:#666;}
#menutop ul li ul li a:hover{background:#8493a0;color:#fff;}
#menutop ul.menux a{background:#fff;color:#666;}
#menutop ul.menux a:hover{background:#8493a0;color:#fff;}
#menutop ul.menux li{background:#fff;color:#666;}
#menutop ul.menux li:hover{background:#8493a0;color:#fff;}
#menutop ul.menux li a{background:#fff;color:#666;}
#menutop ul.menux li a:hover{background:#f1f1f1;color:#8493a0;}}
</style>
<link href='//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>

4. Copas kode berikut ini di atas kode <div class='header-wrapper'> atau <div id='header-wrapper'> atau <header ....>
<nav id='menutop'>
<input type='checkbox'/>
<label/>
<ul>
<li><a href='/' title='Home'>Home</a></li>
<li><a class='dutt' href='#'>Drop-Down</a>
<ul class='menux'>
<li><a href='#'>Sub-item 1</a></li>
<li><a href='#'>Sub-item 2</a></li>
</ul>
</li>
<li><a class='dutt' href='/p/get-in-touch.html'>Contact</a>
<ul class='menux'>
<li><a href='#'>e-mail Form</a></li>
<li><a href='#'>Twitter</a></li>
</ul>
</li>
<li><a href='/p/privacy-policy.html'>Privacy Policy</a></li>
<li><a href='/p/sitemap.html'>Sitemap</a></li>
<li class='sorting-01 facebook'><a href='#'><i class='fa fa-facebook fa-lg'/><span class='inv'/></a></li>
<li class='sorting-02 twitter'><a href='#'><i class='fa fa-twitter fa-lg'/><span class='inv'/></a></li>
<li class='sorting-03 googleplus'><a href='#'><i class='fa fa-google-plus fa-lg'/><span class='inv'/></a></li>
<li class='sorting-06 linkedin'><a href='#'><i class='fa fa-linkedin fa-lg'/><span class='inv'/></a></li>
<li class='sorting-04 youtube'><a href='#'><i class='fa fa-youtube fa-lg'/><span class='inv'/></a></li>
</ul>
</nav>

Catatan:  Ganti link media sosialnya yang bertanda pagar (#) dengan link akun media sosial Anda.
5. Pastikan template Anda sudah dipasangi jQuery berikut ini. 
Jika belum ada, maka copas kode berikut ini tepat di atas kode </head>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'/>

6. Save Template!

Itu dia Cara Membuat Menu Blog plus Media Sosial di Atas Header. Navigasi menu wajib ada karena direkomendasikan Google. Agar blog ramah mesin mencari (seo friendly) sekaligus ramah pengguna (user friendly).*

Cara Memasang Related Posts di Bawah Posting Blog - Simple dan Plus Gambar

0 Follow @romel_tea
Related Posts, Related Articles, atau Posting Terkait adalah widget yang biasa tampil di bawah postingan blog. Fungsinya untuk internal linking, navigasi, sekaligus meningkatkan pageviews.

Cara Memasang Related Posts

Di template bawaan Blogger tidak ada related posts. Karenanya, kita harus memasang sendiri.

Kode untuk menampilkan atau memasang related post di blog sangat banyak. Saya pilihkan dua terbaik bagi Anda, yaitu:
  1. Relaeted Post Simple (Judul Saja)
  2. Related Post plus Gambar

Cara Memasang Related Post Simple

Berikut ini Cara Memasang related Post simple. Hanya daftar judul. Penampilannya seperti ini:

Related Post Simple

1. CSS
Simpan kode berikut ini di atas kode </head>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
#related-posts{float:left;width:100%;margin:10px;padding:1px 0 10px}
#related-posts .widget h2,#related-posts h3{font:18px Oswald;color:#000;text-transform:none;margin:0 0 10px;padding:0;font-weight:500}
#related-posts a{color:#0973CF;font:14px Arial,Sans-serif;}
#related-posts li{background:url(http://2.bp.blogspot.com/-EcBIblBtYTQ/TqALuRS_IzI/AAAAAAAAAx0/E-vzWTTOgXs/s1600/bullet-list.gif) no-repeat 0 10px;text-indent:0;line-height:1.3em;border-bottom:1px dotted #ccc;margin:0;padding:3px 0 8px 12px}
#related-posts a:hover{color:#c00;text-decoration:none}
#related-posts .widget{margin:0;padding:0}
#related-posts ul{list-style:none;margin:0;padding:0}
</style>
<script type='text/javascript'>
var numposts = 5;
var showpostthumbnails = false;
var showpostdate = false;</script>
<script type='text/javascript'>
var relatedpoststitle=&quot;Related Posts&quot;;
</script>
<script type='text/javascript'>
//<![CDATA[
var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();function related_results_labels(c){for(var b=0;b<c.feed.entry.length;b++){var d=c.feed.entry[b];relatedTitles[relatedTitlesNum]=d.title.$t;for(var a=0;a<d.link.length;a++){if(d.link[a].rel=="alternate"){relatedUrls[relatedTitlesNum]=d.link[a].href;relatedTitlesNum++;break}}}}function removeRelatedDuplicates(){var b=new Array(0);var c=new Array(0);for(var a=0;a<relatedUrls.length;a++){if(!contains(b,relatedUrls[a])){b.length+=1;b[b.length-1]=relatedUrls[a];c.length+=1;c[c.length-1]=relatedTitles[a]}}relatedTitles=c;relatedUrls=b}function contains(b,d){for(var c=0;c<b.length;c++){if(b[c]==d){return true}}return false}function printRelatedLabels(a){for(var b=0;b<relatedUrls.length;b++){if(relatedUrls[b]==a){relatedUrls.splice(b,1);relatedTitles.splice(b,1)}}var c=Math.floor((relatedTitles.length-1)*Math.random());var b=0;if(relatedTitles.length>1){document.write("<h3>"+relatedpoststitle+"</h3>")}document.write("<ul>");while(b<relatedTitles.length&&b<20&&b<maxresults){document.write('<li><a href="'+relatedUrls[c]+'">'+relatedTitles[c]+"</a></li>");if(c<relatedTitles.length-1){c++}else{c=0}b++}document.write("</ul>");relatedUrls.splice(0,relatedUrls.length);relatedTitles.splice(0,relatedTitles.length)};
//]]>
</script>
    </b:if>

2. Kode XML & JavaScript:

Simpan kode berikut ini di atas kode <div class='post-footer'>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
var maxresults=5;
removeRelatedDuplicates(); printRelatedLabels(&quot;<data:post.url/>&quot;);
</script>
</div>
<div class='clear'/>
</b:if>
Demikian Cara Memasang Related Posts Simple di Bawah Posting Blog

Sumber

Cara Memasang Related Posts Plus Gambar

Berikut ini cara memasang posting terkait plus gambar thumbnail. Penampakannya seperti gambar di bawah ini.

Related Posts Plus Gambar

Cara memasangnya:

1. Tema > Edit HTML
2. Copas kode berikut ini di atas kode </head>

<!--Related Posts with thumbnails Scripts and Styles Start--> <!-- remove -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
#related-post {margin:0 auto;padding:0;}
#related-post h4{position:relative;overflow:hidden;margin:10px 0 20px 0;font-size:120%;font-weight:700}
#related-post h4:after{position:absolute;top:51%;overflow:hidden;width:78.3%;height:1px;content:&#39;a0&#39;;background-color:#ccc}
#related-post h4 span{position:relative;display:inline-block;margin:0 10px 0 0}
.relhead {font-size:100%;font-weight:normal;line-height:150%;overflow:hidden;padding:10px 0;}
#related-summary .news-text {display:none;}
ul#related-summary{margin:0 auto;padding:0;list-style:none;word-wrap:break-word}
ul#related-summary li{position:relative;float:left;list-style:none outside none;padding:0;overflow:hidden;margin:0 10px 0 0;width:100%;max-width:175px;height:170px;transition:opacity .2s ease}
ul#related-summary li a {display:block;}
ul#related-summary li img{background-color:#fafafa;display:block;width:100%;height:auto;max-width:100%;max-height:100px;vertical-align:middle;overflow:hidden;margin:0 0 10px;transition:all 1s ease-out}
ul#related-summary li:hover img {opacity:0.96;}
ul#related-summary li a.relinkjdulx{background-image:none;color:#444;display:block;font-size:13px;font-weight:700;line-height:normal;overflow:hidden;padding:0;text-align:left;text-transform:none}
ul#related-summary li a.relinkjdulx:hover{color:#c00;}
@media only screen and (max-width:640px){
ul#related-summary li {float:left;list-style:none;overflow:hidden;width:100%;border-bottom:1px solid #e6e6e6;padding:10px 0;max-width:100%;height:auto;}
ul#related-summary li:last-child{border-bottom:none;}
ul#related-summary li img{max-width:72px;float:left;margin:0 10px 0 0;}
ul#related-summary li a.relinkjdulx {display:block;font-size:15px;font-weight:700;line-height:normal;overflow:hidden;padding:0 10px 10px 0;}}
@media screen and (max-width:384px){
ul#related-summary li img{display:none}}
</style>
<script type='text/javascript'>
//<![CDATA[
//Related Post
var relnojudul = 0;
var relmaxtampil = 6;
var numchars = 120;
var reljudul=new Array();var relurls=new Array();var relcuplikan=new Array();var relgambar=new Array();function saringtags(g,h){var e=g.split("<");for(var f=0;f<e.length;f++){if(e[f].indexOf(">")!=-1){e[f]=e[f].substring(e[f].indexOf(">")+1,e[f].length)}}e=e.join("");e=e.substring(0,h-1);return e}function relpostimgcuplik(h){for(var e=0;e<h.feed.entry.length;e++){var g=h.feed.entry[e];reljudul[relnojudul]=g.title.$t;postcontent="";if("content" in g){postcontent=g.content.$t}else{if("summary" in g){postcontent=g.summary.$t}}relcuplikan[relnojudul]=saringtags(postcontent,numchars);if("media$thumbnail" in g){postimg=g.media$thumbnail.url}else{postimg="http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.GIF"}relgambar[relnojudul]=postimg;for(var f=0;f<g.link.length;f++){if(g.link[f].rel=="alternate"){relurls[relnojudul]=g.link[f].href;break}}relnojudul++}}function contains(a,e){for(var f=0;f<a.length;f++){if(a[f]==e){return true}}return false}function artikelterkait(){var v=new Array(0);var w=new Array(0);var x=new Array(0);var A=new Array(0);for(var u=0;u<relurls.length;u++){if(!contains(v,relurls[u])){v.length+=1;v[v.length-1]=relurls[u];w.length+=1;w[w.length-1]=reljudul[u];x.length+=1;x[x.length-1]=relcuplikan[u];A.length+=1;A[A.length-1]=relgambar[u]}}reljudul=w;relurls=v;relcuplikan=x;relgambar=A;for(var u=0;u<reljudul.length;u++){var B=Math.floor((reljudul.length-1)*Math.random());var i=reljudul[u];var s=relurls[u];var y=relcuplikan[u];var C=relgambar[u];reljudul[u]=reljudul[B];relurls[u]=relurls[B];relcuplikan[u]=relcuplikan[B];relgambar[u]=relgambar[B];reljudul[B]=i;relurls[B]=s;relcuplikan[B]=y;relgambar[B]=C}var r=0;var D=Math.floor((reljudul.length-1)*Math.random());var z=D;var q;var t=document.URL;while(r<relmaxtampil){if(relurls[D]!=t){q="<li class='news-title clearfix'>";q+="<a href='"+relurls[D]+"' rel='nofollow' target='_top' title='"+reljudul[D]+"'><img src='"+relgambar[D]+"' /></a>";q+="<a class='relinkjdulx' href='"+relurls[D]+"' target='_top'>"+reljudul[D]+"</a>";q+="<span class='news-text'>"+relcuplikan[D]+"</span>";q+="</li>";document.write(q);r++;if(r==relmaxtampil){break}}if(D<reljudul.length-1){D++}else{D=0}if(D==z){break}}};
//]]>
</script>
<script type='text/javascript'>
$(&quot;ul#related-summary li img&quot;).each(function(){$(this).attr(&quot;src&quot;,$(this).attr(&quot;src&quot;).replace(//s[0-9]+(-c)?//,&quot;/w175-h100-c/&quot;))});
</script>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

3. Copas kode berikut ini di bawah kode <data:post.body/> yang kedua atau atas kode <div class='post-footer'>

<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-post'>
<div class='relhead'>
<h4><span>Related Posts</span></h4>
<div class='clear'/>
<b:loop values='data:post.labels' var='label'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;amp;callback=relpostimgcuplik&amp;amp;max-results=50&quot;' type='text/javascript'/>
</b:loop>
<ul id='related-summary'>
<script type='text/javascript'>artikelterkait();</script>
</ul>
</div>
</div>
<div class='clear'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->

4. Save Template!
5. Tambahkan kode berikut ini di atas kode </body> untuk mengatasi gambar buram (blur)

<script type='text/javascript'>
//<![CDATA[
function replaceText(){if(!document.getElementById){return;}
bodyText = document.getElementById("Blog1");
theText = bodyText.innerHTML;
theText = theText.replace(/s72-c/gi, "s200-c");
bodyText.innerHTML = theText;
}replaceText();
//]]>
</script>

6. Save Template!

Sumber

Demikian Cara Memasang Related Posts di Bawah Posting Blog - Simple dan Plus Gambar.*

6 Tips SEO Agar Blog Mudah Terindeks Google dan Banyak Pengunjung

1 Follow @romel_tea
Bagaimana cara agar blog mudah masuk Google dan banyak pengunjung? Itu pertanyaan bloger pemula dan bloger pada umumnya.

6 Tips SEO Agar Blog Mudah Terindeks Google dan Banyak Pengunjung

Pengunjung umumnya menemukan blog kita di Google. Karenanya, kita harus optimalkan blog agar mudah dirambah, diindeks, dan diperingkat oleh Google.

Berikut ini tips SEO yang biasa saya lakukan agar blog atau website baru cepat diindeks Google dan mendatangkan pengunjung atau pembaca.

Tips SEO Agar Blog Mudah Terindeks Google dan Banyak Pengunjung

1. Daftarkan Blog ke Google Search Console

Kita bisa tes dulu blog kita di Google. Apakah sudah terindeks apa belum. Caranya, buka Google dan ketik site:alamatblog.

Misanya: site:blogromeltea.blogspot.com

Hasilnya:

blogromeltea.blogspot.com

Karena blog ini sudah lama, maka sudah terindeks Google dengan baik. Saya coba ketik nama blog baru saya: site:bandung.romeltea.com

Hasilnya:

bandung romeltea

Karena blog bandung.romeltea.com masih baru, artikelnya juga baru sedikit, meskipun sudah diindeks Google, Si Mbah menampilkan saran agar blog kita didaftarkan ke Google Search Console, seperti dalam baris yang saya lingkari di atas.

Nah, kemungkinan blog baru Anda pun disarankan demikian. Maka:

1. Buka Google Search Console untuk mendaftarkan blog baru Anda.
2. Klik Add Property
3. Masukkan alamat blog Anda di kolom kanan

Alamat Blog di Google Search Console

4. Klik Continue.

Google akan otomatis memverifikasi kepemilikan blog. 

2. Daftarkan Peta Situs (Sitemap)

Masih di halaman Google Search Console, klik meni Sitemap dan ketik sitemap.xml

submit sitemap


Klik SUBMIT di bagian kanan.

Dua langkah di atas adalah standar SEO untuk blog atau website. Dalam Panduan Memulai Pengoptimalan Mesin Telusur (SEO) disebutkan, langkah pertama untuk menampilkan situs Anda di Google adalah memastikan bahwa Google dapat menemukannya.

"Cara terbaik untuk melakukannya adalah dengan mengirimkan peta situs. Peta situs adalah file di situs yang memberi tahu mesin telusur tentang halaman baru atau yang diubah di situs Anda."

Sebenarnya kedua langkah di atas sudah cukup agar blog mudah terindeks Google dan banyak pengunjung. Namun, itu dasar banget.

Untuk memperkuatnya, lanjutkan dengan empat tips SEO berikut ini.

3. Daftarkan Blog ke Google Feedburner

Ini agar Google makin "akrab" dengan blog kita. Feedburner juga berfungsi membuatkan link RSS untuk dipasang di Formulir Berlangganan (Subscribe) di blog.

1. Buka Google Feedburner
2. Masukkan alamat blog Anda

feedburner blogromeltea

3. Klik Next > Next dan seterusnya.

Untuk mengaktifkan Subscribe by Email, klik menu Publicize dan Email Subscription

Publicize dan Email Subscription

Anda akan mendapatkan kode termasuk link Email Subscription untuk dipasang di blog Anda, misalnya di Follow by Email di sidebar blog.

Follow by Email

4. Bagikan Blog ke Media Sosial

Menurut para pakar SEO, media sosial sangat berperan besar dan promosi dan popularitas blog. Selalu bagikan (share) blog dan postingan blog Anda ke media sosial.

Jika ada postingan yang sesuai dengan tagar (hashtag) yang tengah trending, segera bagikan link artikel Anda dengan tagar tersebut.

Jadi, pastikan Anda memiliki akun media sosial, minimal Facebook dan Twitter. Kita bisa share otomatis ke kedua akun medsos tersebut menggunakan jasa Dlvrit.

share otomatis media sosial

5. Tulis Artikel Unik dan Aktual

Ini tips SEO utama. Konten adalah raja (content is king). Jika postingan Anda unik, baru, segar, aktual, dan dicari orang, otomatis Google akan mengindeksnya dan memeringkat artikel Anda di posisi teratas halaman hasil pencarian.

Tulis artikel selengkap dan sepanjang mungkin. Para pakar SEO menyarankan panjang tulisan antara 800 hingga 2000 karakter.

6. Terapkan SEO On Page

SEO On Page adalah pengoptimalan mesin pencari yang dilakukan di dalam blog/web. Penerapan SEO Onpage ini antara lain:
  1. Gunakan kata kunci di judul
  2. Gunakan kata kunci di alinea pertama.
  3. Gunakan kata kunci di tengah artikel.
  4. Gunakan kata kunci di bagian akhir artikel.
  5. Lengkapi tulisan dengan gambar dan video
  6. Optimalkan gambar dengan alt text.
  7. Sertakan Link Internal dan Eksternal
  8. Gunakan template blog SEO Friendly.

Tips SEO


Template Blog SEO adalah template yang ramah mesin pencari, ramah pengguna (user friendly), ramah seluler (mobile friendly) alias responsive, dan ringan atau tampil cepat (fast loading). Gunakan salah satu template ini.

Selain SEO Onpage, ada juga SEO Off Page, seperti promosi blog di media sosial dan backlinking.

Demikian 6 Tips SEO Agar Blog Mudah Terindeks Google dan Banyak Pengunjung.*

13 Template Blog SEO Friendly, Responsive, Simple, Ringan, Gratis Free Download

0 Follow @romel_tea
Koleksi 13 Template Blog berikut ini sudah SEO Friendly & Responsive. Ramah mesin pencari, tamah seluler (mobile friendly), dan kabar baiknya lagi tema-tema Blogger ini Gratis (Free Download).

13 Template Blog SEO Friendly, Responsive, Simple, Ringan, Gratis Free Download

Anda tinggal fokus ke konten aja. Isi blog Anda dengan posting berkualitas --bermanfaat, unik, asli (bukan copas tulisan orang!), dan sesuai dengan passion (bakat & minat) dan keahlian (skills) Anda. Tulislah pengalaman dan pengetahuan yang Anda miliki.

Koleksi 13 Template Blog SEO Friendly & Responsive

1. SEO Optima

SEO Optima


2. SEO Starter

SEO Starter


3. Simple SEO BT

Simple SEO BT


4. Simple SEO Theme

Simple SEO Theme


5. Jurnalistik Template

Jurnalistik Template


6. Jurnalistik Theme

Jurnalistik Theme


7. The Writer

The Writer


8. My Notes

My Notes


9. Jurnalistik Online

Jurnalistik Online


10. Academia Template

Academia Template


11. AMP Blogger Template

AMP Blogger Template


12. Bootstrap Blogger Template

Bootstrap Blogger Template


13. Blogpreneur Template

Blogpreneur Template



ATTENTION!
Karena ini template gratis, Anda tidak boleh menghapus credit link Romeltea Media yang ada di footer. Jika mau menghapusnya, kontak email romeltea@yahoo.com.

Sebagian template di atas sudah pernah saya gunakan dan terbukti SEO Friendly. Template yang saya gunkan sekarang pun salah satunya, hanya didesain lagi penampilannya.

Baca Juga: Cara Membuat Template Blog Sendiri

Cara Pasang Template

Bagi yang belum tahu cara mengganti template atau ganti tampilan blog, berikut ini caranya:

1. Login ke Blogger
2. Klik blog yang akan diganti tampilannya
3. Klik Tema > Cadangkan/Pulihkan
4. Browse > Klik File Templatenya > Klik Upload
5. Tunggu.... selesi!

Cara Pasang Template Blog

Cara Pasang Template Blog

Cara Pasang Template Blog

Cara Pasang Template Blog

Itu dia Koleksi Template Blog SEO Friendly & Responsive Gratis Free Download dan cara memasangnya di blog Anda. Wasalam. (blogromeltea.blogspot.com).*

Koleksi Template Blog SEO Terbaru 2020 Gratis Download

4 Follow @romel_tea
Template atau Tema (Theme) adalah desain tampilan blog. Template memenang peran penting dalam sukses blogging.

Koleksi Template Blog SEO Terbaru 2020 Gratis Download

Template yang kita gunakan harus ramah mesin pencari (SEO friendly) dengan ciri-ciri sebagai berikut:
  1. Ramah seluler (mobile-friendly, responsive)
  2. Ramah pengguna (user friendly)
  3. Ringan, tampil cepat (fast loading)
Ramah mesin pencari artinya mudah dan cepat dirambah, diindeks, dan diperingkat oleh Google atau mesin telusur lainnya.

Ramah seluler artinya adaptif, responsive, sehingga mudah diakses melalui HP. Ramah pengguna artinya enak dipandang, enak dibuka, sedap di mata pembaca atau pengunjung.

Saya percaya, para desainer template blog berusaha membuat template dengan memenuhi kriteria tersebut.

Bahkan, template bawaan Blogger pun sebenarnya sudah memenuhi kriteria SEO Friendly. Hanya tinggal ubah saja meta title-nya.

Koleksi Template Blog SEO Terbaru Gratis Download

Berikut ini Koleksi Template Blog SEO Terbaru Gratis Download dari beberapa desainer template Blogger, edisi terbaru (2019).

SEO Optima - Blogger Template





Elegance - Minimal Blogger Template

Elegance Minimal Blogger Template


SeoRocket - Best SEO Optimized Blogger Template

SeoRocket Best SEO Optimized Blogger Template


VioMagz 

VioMagz Template Blogger


Quora Style

Quora Style


CNN Syle Blogger Template

CNN Syle Blogger Template


Mocca Responsive Blogger Template

Mocca Responsive Blogger Template


StartSeo - Responsive Blogger Template

StartSeo - Responsive Blogger Template




Itu dia koleksi Template Blog SEO Terbaru 2019 Gratis Download dan Premium.*