Thứ Sáu, 19 tháng 8, 2016

Làm sao để tạo button "Back to Top" cho Blogspot

Button "Back to Top" sẽ rất hữu ích với blog của bạn. Thay vì phải rê chuôt nhiều lần, button này giúp người đọc dễ dàng di chuyền lên đầu trang một cách nhanh chóng.

Nếu bạn vẫn chưa biết cách tạo button "Back to Top" cho Blogspot thì bài viết này là dành cho bạn


Tạo button "Back to Top" cho Blogspot


Bước 1 : Thêm đoạn code dưới đây vào phía dưới <head>

<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

Bước 2 : Tạo một Widget HTML/Javascript mới trong Bố cục và điền đoạn code dưới đây vào. Hoặc bạn cũng có thể chèn đoạn code này vào bất kì vị trí nào bạn muốn.

<a href="#" class="backtotop"><i class="fa fa-angle-up"></i></a>
<script>
  jQuery(document).ready(function() {
  var offset = 220;
  var duration = 500;
  jQuery(window).scroll(function() {
  if (jQuery(this).scrollTop() > offset) {
  jQuery('.backtotop).fadeIn(duration);
  } else {
  jQuery('.backtotop').fadeOut(duration);
  }
  });

  jQuery('.backtotop').click(function(event) {
  event.preventDefault();
  jQuery('html, body').animate({scrollTop: 0}, duration);
  return false;
  })
  });
</script>

Bước 3 : Thêm đoạn code dưới đây vào phía trên ]]></b:skin>

.backtotop {
  z-index: 5;
  width: 50px;
  height: 50px;
  font-size: 25px;
  line-height: 50px;
  -o-border-radius: 4px;
  -ms-border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  position: fixed;
  bottom: 10px;
  right: 10px;
  cursor: pointer;
  background: #00A4E4;
  text-align: center;
  color: #FFF;
}
.backtotop i {
  color:#FFF:
}
.backtotop:hover {
  background: #464646;
  color: #FFF;
}

các bạn có thể thay #00A4E4 bằng mã màu các bạn thích

Kết quả :



Chúc các bạn thành công



Thứ Hai, 13 tháng 6, 2016

Hướng dẫn các tạo phân trang có đánh số cho Blogger

Mặc định, Blogger cũng có tính năng phân trang bài viết đó là button Bài đăng cũ hơn và Bài đăng mới hơn. Song, mẫu phân trang mặc định của Blogger có vẻ không thân thiện với người dùng cho lắm, đặc biệt là với các Blog có số lượng bài viết lớn .Trong bài viết này, mình sẽ hướng dẫn các bạn tạo phân trang có đánh số cho Blogger. Đây là một trong những widget khá phổ biến, được sử dụng ở rất nhiều Blog, nó giúp bạn đọc có thể di chuyển giữa các trang một cách dễ dàng hơn


Bước 1 : Chèn đoạn code dưới đây vào trên thẻ đóng </body>

<script style='text/javascript'>
var postperpage=7;
var numshowpage=3;
var upPageWord=&quot;Prev&quot;;
var downPageWord=&quot;Next&quot;;
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
</script>
<script style='text/javascript'/>
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('7 L;7 j;7 h;7 v;1A();H 1z(1d){7 6=\'\';M=K(12/2);5(M==12-M){12=M*2+1}C=h-M;5(C<1)C=1;e=K(1d/m)+1;5(e-1==1d/m)e=e-1;D=C+12-1;5(D>e)D=e;6+="<4 9=\'1M\'>1L "+h+\' 1Y \'+e+"</4>";7 17=K(h)-1;5(h>1){5(h==2){5(j=="u"){6+=\'<4 9="1Z"><a b="\'+B+\'">\'+S+\'</a></4>\'}c{6+=\'<4 9="g"><a b="/r/s/\'+v+\'?&d-l=\'+m+\'">\'+S+\'</a></4>\'}}c{5(j=="u"){6+=\'<4 9="g"><a b="#" y="N(\'+17+\');x w">\'+S+\'</a></4>\'}c{6+=\'<4 9="g"><a b="#" y="O(\'+17+\');x w">\'+S+\'</a></4>\'}}}5(C>1){5(j=="u"){6+=\'<4 9="g"><a b="\'+B+\'">1</a></4>\'}c{6+=\'<4 9="g"><a b="/r/s/\'+v+\'?&d-l=\'+m+\'">1</a></4>\'}}5(C>2){6+=\' ... \'}1s(7 k=C;k<=D;k++){5(h==k){6+=\'<4 9="24">\'+k+\'</4>\'}c 5(k==1){5(j=="u"){6+=\'<4 9="g"><a b="\'+B+\'">1</a></4>\'}c{6+=\'<4 9="g"><a b="/r/s/\'+v+\'?&d-l=\'+m+\'">1</a></4>\'}}c{5(j=="u"){6+=\'<4 9="g"><a b="#" y="N(\'+k+\');x w">\'+k+\'</a></4>\'}c{6+=\'<4 9="g"><a b="#" y="O(\'+k+\');x w">\'+k+\'</a></4>\'}}}5(D<e-1){6+=\'...\'}5(D<e){5(j=="u"){6+=\'<4 9="g"><a b="#" y="N(\'+e+\');x w">\'+e+\'</a></4>\'}c{6+=\'<4 9="g"><a b="#" y="O(\'+e+\');x w">\'+e+\'</a></4>\'}}7 16=K(h)+1;5(h<e){5(j=="u"){6+=\'<4 9="g"><a b="#" y="N(\'+16+\');x w">\'+1l+\'</a></4>\'}c{6+=\'<4 9="g"><a b="#" y="O(\'+16+\');x w">\'+1l+\'</a></4>\'}}6+=\'<1q><a b="1n://1O.1K.1m" 1R="1Q 1S" 1D="1E-1F: 1I; 1G: 1H; 1N: 2d;" 28="27"><1o 26="0" J="1n://2a.2b.1m/1o/2f.2e" 1T="3" 2c="3" /></a></1q>\';7 E=z.1W("E");7 18=z.1V("1U-1X");1s(7 p=0;p<E.Q;p++){E[p].1i=6}5(E&&E.Q>0){6=\'\'}5(18){18.1i=6}}H 1f(X){7 Y=X.Y;7 1C=K(Y.22$21.$t,10);1z(1C)}H 1A(){7 i=o;5(i.f("/r/s/")!=-1){5(i.f("?V-d")!=-1){v=i.I(i.f("/r/s/")+14,i.f("?V-d"))}c{v=i.I(i.f("/r/s/")+14,i.f("?&d"))}}5(i.f("?q=")==-1&&i.f(".6")==-1){5(i.f("/r/s/")==-1){j="u";5(o.f("#G=")!=-1){h=o.I(o.f("#G=")+8,o.Q)}c{h=1}z.1p("<n J=\\""+B+"P/R/U?d-l=1&13=15-Z-n&T=1f\\"><\\/n>")}c{j="s";5(i.f("&d-l=")==-1){m=20}5(o.f("#G=")!=-1){h=o.I(o.f("#G=")+8,o.Q)}c{h=1}z.1p(\'<n J="\'+B+\'P/R/U/-/\'+v+\'?13=15-Z-n&T=1f&d-l=1" ><\\/n>\')}}}H N(F){11=(F-1)*m;L=F;7 W=z.1r(\'1g\')[0];7 A=z.1w(\'n\');A.1t=\'1v/1u\';A.1y("J",B+"P/R/U?1B-1j="+11+"&d-l=1&13=15-Z-n&T=1e");W.1h(A)}H O(F){11=(F-1)*m;L=F;7 W=z.1r(\'1g\')[0];7 A=z.1w(\'n\');A.1t=\'1v/1u\';A.1y("J",B+"P/R/U/-/"+v+"?1B-1j="+11+"&d-l=1&13=15-Z-n&T=1e");W.1h(A)}H 1e(X){1c=X.Y.25[0];7 1x=1c.1k.$t.I(0,19)+1c.1k.$t.I(23,29);7 1a=1P(1x);5(j=="u"){7 1b="/r?V-d="+1a+"&d-l="+m+"#G="+L}c{7 1b="/r/s/"+v+"?V-d="+1a+"&d-l="+m+"#G="+L}1J.b=1b}',62,140,'||||span|if|html|var||class||href|else|max|maksimal|indexOf|showpageNum|nomerhal|thisUrl|jenis|jj|results|postperpage|script|urlactivepage|||search|label||page|lblname1|false|return|onclick|document|newInclude|home_page|mulai|akhir|pageArea|numberpage|PageNo|function|substring|src|parseInt|nopage|nomerkiri|redirectpage|redirectlabel|feeds|length|posts|upPageWord|callback|summary|updated|nBody|root|feed|in||jsonstart|numshowpage|alt||json|nextnomer|prevnomer|blogPager||timestamp|alamat|post|banyakdata|finddatepost|hitungtotaldata|head|appendChild|innerHTML|index|published|downPageWord|com|http|img|write|div|getElementsByTagName|for|type|javascript|text|createElement|timestamp1|setAttribute|loophalaman|halamanblogger|start|totaldata|style|font|size|float|right|7pt|location|blogspot|Page|showpageOf|padding|24work|encodeURIComponent|Blogger|title|Templates|width|blog|getElementById|getElementsByName|pager|of|showpage||totalResults|openSearch||showpagePoint|entry|border|_blank|target||img1|blogblog|height|2px|gif|blank'.split('|'),0,{}))
</script>

trong đó
  • var postperpage : Số bài viết trên một trang
  • var numshowpage : Số trang sẽ hiển thị
  • var upPageWord : Kí tự trở về trang trước
  • var downPageWord : Kí tự sang trang sau

Bước 2 : Thêm đoạn code dưới đây vào phía dưới <head>

<link href='https://fonts.googleapis.com/css?family=Roboto:400,300' rel='stylesheet' type='text/css'/>

Chúng ta sẽ thêm đoạn code trên vì mình sẽ sử dụng font Roboto trong mẫu này. Nếu các bạn muốn sử dụng font chữ mặc định của giao diện thì không cần thêm

Bước 3 : Chèn đoạn code sau vào phía trên ]]></b:skin>. Các bạn có thể chọn một trong các mẫu sau để sử dụng cho Blog


.blog-pager,#blog-pager{display:inline-block;margin:0;overflow:inherit;color:#fff;height:40px;font-family:Roboto;border:1px solid #CED9EE;border-right:none;color:#617083}
#blog-pager a,.showpagePoint,.showpageOf{text-decoration:none;display:block;padding:0 18px;color:#55A8FD}
.showpageOf,.showpagePoint,.showpageNum,.showpage{line-height:40px;float:left;font-size:14px;border-right:1px solid #CED9EE}


.blog-pager,#blog-pager{display:inline-block;margin:0;overflow:inherit;color:#fff;height:30px;font-family:Roboto}
#blog-pager a,.showpagePoint,.showpageOf{color:#fff;text-decoration:none;display:block;padding:0 18px}
.showpageOf,.showpagePoint,.showpageNum,.showpage{line-height:30px;float:left;background-color:#ea5745;margin-right:10px;border-radius:2px;font-size:14px;-webkit-transition:all .2s;-moz-transition:all .2s;transition:all .2s}
.showpagePoint:hover,.showpageNum:hover,.showpage:hover{background-color:#ed8477;-moz-box-shadow:inset 0 0 1px #ea5745;-webkit-box-shadow:inset 0 0 1px #ea5745;box-shadow:inset 0 0 1px #ea5745}

.blog-pager,#blog-pager{display:inline-block;margin:0;overflow:inherit;color:#fff;height:30px;font-family:Roboto}
#blog-pager a,.showpagePoint,.showpageOf{color:#fff;text-decoration:none;display:block;padding:0 18px}
.showpageOf,.showpagePoint,.showpageNum,.showpage{line-height:30px;display:inline-block;background:#A1D0DD;margin-right:10px;border-radius:4px;-webkit-box-shadow:0 4px 0 #7FAFBC;-moz-box-shadow:0 4px 0 #7FAFBC;box-shadow:0 4px 0 #7FAFBC;font-size:14px;-webkit-transition:all .2s;-moz-transition:all .2s;transition:all .2s}
.showpagePoint:hover,.showpageNum:hover,.showpage:hover{position:relative;top:2px;-webkit-box-shadow:0 2px 0 #7FAFBC;-moz-box-shadow:0 2px 0 #7FAFBC;box-shadow:0 2px 0 #7FAFBC}

Chúc các bạn thành công.

Chủ Nhật, 5 tháng 6, 2016

Hướng dẫn cách SEO cho Blogspot toàn tập ( Cập nhật )

Ngày nay, khi mà có vô số những website, blog được tạo mới mỗi ngày thì việc đạt thứ hạng cao trên các công cụ tìm kiếm là khá khó khăn. Mình xin nhấn mạnh là khá khó khăn chứ không phải không thể. Nếu bạn biết tối ưu hóa Blog của mình một cách đúng đắn, hiệu quả thì hoàn toàn có thể đạt được thứ hạng như bạn mong muốn


Trong bài viết này, mình xin hướng dẫn một cách cơ bản nhất và tương đối đầy đủ để ngay cả các bạn mới cũng có thể làm SEO cho Blogspot

SEO là gì ? SEO để làm gì ?

SEO là tập hợp những phương pháp nhằm nâng cao vị trí của website trên công cụ tìm kiếm. Người làm SEO phải tối ưu hóa website của mình thân thiện nhất có thể với các công cụ tìm kiếm.

SEO giúp chúng ta tăng lượt truy cập vào website thông qua từ khóa được tìm kiếm. Đồng thời, SEO giúp cho người dùng dễ dàng tiếp cận đến website của bạn hơn. Nếu SEO tốt, bạn hoàn toàn có thể tiết kiếm được một khoản không nhỏ tiền quảng cáo, từ đó làm tăng thêm thu nhập

Bạn đã sẵn sàng chưa ? Chúng ta bắt đầu nhé

1. SEO Onpage

SEO Onpage là quá trình cài đặt, tối ưu hóa các yếu tố trên Blog thân thiện với bộ máy tìm kiếm. Đây là một công việc cực kì quan trọng nếu như các bạn muốn phát triển Blog của mình. Dưới đây, mình sẽ cung cấp một số yếu tố các bạn cần lưu ý trong quá trình SEO Onpage cho Blogger, bên cạnh đó mình sẽ cung cấp một số hướng dẫn để các bạn tối ưu hóa thêm cho Blog của mình

Title Tag

Title Tag chính là phần tiêu đề khi bạn lập mới Blog. Tiêu đề Blog cần liền mạch, ngắn gọn ( không quá 70 ký tự ), không nên lặp lại từ khóa >2 lần. Sau khi tạo Blog, bạn có thể thiết lập lại tiêu đề bằng cách vào Cài đặt ( Setting ) => Cơ bản => Tiêu đề

Mặc định, trên trang xem bài viết, Blogger đặt tiêu đề Blog phía trước tiêu đề bài viết. Điều này thật sự không hề tốt cho SEO. Để khắc phục lỗi này, các bạn vào Mẫu ( Template ) => Chỉnh sửa HTML và tìm đoạn code sau

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

và thay thế nó bằng đoạn code sau, rồi Lưu

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

Meta Description

Meta Description là một đoạn mô tả ngắn, cung cấp cho bộ máy tìm kiếm và người dùng thông tin giới thiệu về Blog, bài viết của bạn



Bạn có thể thêm Meta Description cho blogger bằng cách vào Cài đặt >> Tùy chọn tìm kiếm >> Điền mô tả tìm kiếm vào

Khi viết mô tả cho Blog, bạn cần lưu ý, mô tả phải chứa từ khóa, chỉ nên dài khoảng 140 – 160 kí tự và khái quát thật chính xác nội dung Blog. Và lưu ý, đừng chèn có nhiều từ khóa vào đây bởi như vậy vừa khiến người dùng cảm thấy khó chịu vừa khiến bot đánh giá bạn đang spam từ khóa


Meta Tag nâng cao

Meta Tag thì có rất nhiều, quan trọng nhất và Title Tag và Meta Description ( mình đã trình bày ở trên ). Bên cạnh có, bạn cũng nên thêm một số thẻ Meta dưới đây để cung cấp thêm thông tin cho bộ máy tìm kiếm

Các bạn vào Mẫu ( Template ) => Chỉnh sửa HTML => Thêm đoạn code sau phía dưới thẻ <head>

<meta name='author' content='author's name'/>
<meta name='email' content='author's email'/>
<meta name='language' content='author's language'/>
<meta name='country' content='author's country'/>
<meta name='generator' content='blogger'/>
<meta name='robots' content='noodp,noydir'/>

các bạn nhớ chỉnh sửa lại nội dung trong phần content

Tạo Sitemap và submit lên Google Webmastertool

Sitemap giống như một bản đồ của Blog, giúp cho bot có thể dễ dàng tìm kiếm đường link và index nó nhanh hơn.

Bạn cần phải Submit sitemap của blogger lên Google thông qua Google Webmasters Tools để bot Google bắt đầu hoạt động. Để làm điều này bạn vào Google Webmasters Tools = Sơ đồ trang web >> Thêm/kiểm tra sơ đồ trang web và điền đoạn code này vào

atom.xml?redirect=false&start-index=1&max-results=500

Xem thêm : Cách tạo Sitemap cho Blogger và submit lên Google Webmaster Tool

Tạo file Robot.txt

Robot.txt là 1 file text đặc biệt giúp bot của công cụ tìm kiếm nhận biết phần nội dung cần Index. Sau đây là cách tạo robot.txt chuẩn seo cho blogger

- Đăng nhập vào Blog

- Cài đặt >> Tùy chọn tìm kiếm >> Trình thu thập thông tin và lập chỉ mục >> Robots.txt tùy chỉnh

- Bật nội dung robots.txt tùy chỉnh, điền đoạn code dưới đây và lưu lại

User-agent: Mediapartners-Google
Disallow:
User-agent: *
Allow: /
Disallow: /search
Disallow: /*?updated-max=*
Disallow: *archive.html
Sitemap: http://diachiblogcuaban/feeds/posts/default?orderby=UPDATED

Xem thêm : Tối ưu hóa file robots.txt cho Blogger chuẩn SEO

Tối ưu hóa các thẻ Heading

Tối ưu hóa heading là công việc cực kì quan trọng trong seo onpage. Thẻ Heading trong SEO gồm 6 loại ( H1, H2, H3, H4, H5, H6 ), tầm quan trong sẽ giảm dần tư H1 - H6. Khi sử dụng các thẻ heading, bot sẽ nhận biết được đâu là phần quan trọng nhất. Bạn không nên lạm dụng, sử dụng quá nhiều các thẻ heading bởi nó không hề tốt một chút nào.

Mặc định, các thể Heading trong Blogger sẽ được sử dụng như sau

+ Đối với trang chủ

<h1>Tiêu đề Blog</h1>
<h3>Tiêu đề bài viết 1</h3>
<h3>Tiêu đề bài viết 2</h3>
<h2>Tiêu đề Widget</h2>

Chúng ta cần chuyển nó thành như sau

<h1>Tiêu đề Blog</h1>
<h2>Tiêu đề bài viết 1</h2>
<h2>Tiêu đề bài viết 1</h2>
<h4>Tiêu đề Widget</h4>

+ Đối với trang bài viết

<h1>Tiêu đề Blog</h1>
<h3>Tiêu đề bài viết </h3>
<h2>Tiêu đề Widget</h2>

Chúng ta cần chuyển nó thành như sau

<h2>Tiêu đề Blog</h2>
<h1>Tiêu đề bài viết </h1>
<h4>Tiêu đề Widget</h4>

Xem thêm : Hướng dẫn tối ưu hóa thẻ Heading cho Blogger

Tạo trang Archive ( Lưu trữ ), 404

Bên trên, mình đã nói về Sitemap nhưng Sitemap đó là cho bot còn để người đọc có thể theo dõi, chúng ta sẽ tạo một trang Sitemap riêng, gọi là Archive

Trong trang Archive chúng ta sẽ chia bài viết theo từng chuyên mục, liệt kê các chuyên mục hiện có. Trong Archive sẽ giúp người đọc có cái nhìn tổng quan nhất về Blog của bạn

Bên cạnh đó,chúng ta cũng cần tạo một trang 404 ( trang báo lỗi ). Trang này sẽ tự động chuyển link lỗi sang link khác hoặc đơn giản là một trang thông báo cho người đọc rằng : Link này bị lỗi. Trang 404 khá là cần thiết vì nó sẽ khiến người đọc cảm thấy dễ chịu hơn khi truy cập vào link bị lỗi trên blog của bạn


Lựa chọn Template chuẩn SEO

Một template chuẩn SEO sẽ giúp công việc SEO cho Blogspot trở nên dễ dàng, thuận tiện, đạt hiệu quả cao. Template tốt cho SEO sẽ có cấu trúc phù hợp để bot dễ dàng truy cập, xác định, index nội dung trên blog của bạn. Và một yếu tố nữa mà theo mình rất rất quan trọng khi lựa chọn template chính là Responsive ( phù hợp với các kích thước màn hình ) bởi vì ngày nay lượng truy cập đến từ smartphone, máy tính bảng là cực kì lớn.

Để có thể lựa chọn được giao diện tốt cho blog, mình khuyên các bạn nên tìm kiếm ở các trang chia sẻ template blogger uy tín hoặc bỏ tiền thuê, mua lại template của một ai đó. Lưu ý : Đợt tới, mình sẽ chia sẻ với các bạn các template do mình tự thiết kế, chuẩn SEO, load nhanh và Responsive. Heheheh

Lựa chọn tên miền

Để SEO cho Blogger đạt hiệu quả cao nhất, đầu tiên, bạn cần lựa chọn tên miền phụ hợp. Sau đây là một số yêu cầu của một tên miền tốt cho SEO
  • Ngắn gọn, dễ nhớ, dễ viết, không nên có các kí hiệu đặc biệt và số
  • Tên miền nên chứa từ khóa chính cần SEO
  • Lựa chọn các đuôi tên miền phổ biến như .com, .net, .org.........
Đặc biệt, đối với Blogspot, Google sẽ cung cấp cho các bạn tên miền abcxyz.blogspot.com. Mình lướt qua các forum thì thấy nhiều người tranh cãi về việc " tên miền .blogspot.com có tốt cho SEO không ? ", tên miền .blogspot.com có lên top được không?"....... và các câu hỏi tương tự. Theo cá nhân mình thì đuôi tên miền không ảnh hưởng quá lớn đên việc làm SEO của bạn, quan trọng là cách bạn tối ưu hóa Blog và phát triển nội dung ( nhiều Blog không cần làm SEO mà vẫn đạt thứ hạng cao và lượng truy cập lớn, bởi nội dung độc đáo, hấp dẫn )

Tăng tốc Blog

Có thể các bạn sẽ thắc mắc tại sao mình lại nhắc đến vấn đề này trong bài viết về SEO nhưng theo mình, tăng tốc Blog thực sự rất cần thiết khi làm SEO. Nếu để ý, các bạn sẽ thấy Google đã tạo ra riêng một công cụ đánh giá tốc độ website, điều này chứng tỏ Google cũng không ngó lơ với vấn đề tốc độ tải trang. Bên cạnh đó, tăng tốc Blog còn giúp người dùng cảm thấy thích thú hơn với việc truy cập vào Blog của bạn, từ đó giảm tỉ lệ thoát, tăng lượt truy cập đáng kể

Một số cách các bạn có thể áp dụng để tăng tốc Blog là :
  • Javascript : hạn chế sử dụng JS, nén JS, ẩn file JS mặc định....
  • CSS : nén CSS, ẩn file CSS mặc định, tránh chèn code inline
  • Hình ảnh : giảm kích thước ảnh, sử dụng Base64 để mã hóa hình ảnh
Xem thêm : Hướng dẫn tăng tốc Blogger toàn tập

2. Viết bài chuẩn SEO và chất lượng

Viết bài chuẩn SEO là viết bài sao cho Bot của công cụ tìm kiếm có thể dễ dàng phân tích nội dung bài viết và index nó

Một bài viết chuẩn SEO cần đạt những yêu cầu sau
  • Từ khóa cần xuất hiện trong tiêu đề và mô tả
  • Sử dụng các thẻ Heading một cách phù hợp, vừa đủ
  • Bài viết tự nhiên, tránh nhồi nhét từ khóa, độ dài >3000 từ
  • Bài viết gốc, tự viết, không copy 100% từ website khác
  • Bài viết cần có các liên kết nội bộ tới các bài viết khác
Bên cạnh đó, mình xin nhấn mạnh rằng, nội dung chất lượng chính là yếu tốc cực kì cực kì quan trọng nếu như bạn muốn phát triển Blog. Cho dù, bạn SEO cực tốt, chạy ads, thứ hạng 1 nhưng nội dung không chất lượng thì làm tăng tỉ lệ thoát mà thôi, người đọc sẽ chủ động quay lại Blog của bạn để tìm kiếm nội dung. Vì vậy, bên cạnh SEO, hãy tập trung xây dựng nội dung thật chất lương để thu hút, giữ chân độc giả

3. SEO Offpage

Trái với SEO Onpage thì SEO Offpage là bạn sẽ tối ưu hóa các yếu tố bên ngoài Blog của bạn như backlink, mạng xã hội

Xây dựng Backlink cho Blog

Backlink đơn giản là những liên kết trỏ về website của bạn từ các website khác. Backlink rất quan trọng trong việc SEO cho Blogger cũng như SEO cho các website khác, bởi vì Backlink giống như các phiếu bầu để blog của bạn có thể đạt thứ hạng cao trên công cụ tìm kiếm

Một số cách kiếm Backlink
  • Viết bài quảng cáo trên diễn đàn, blog, website có thứ hạng cao
  • Sử dụng mạng xã hội để tạo Backlink
  • Backlink từ video
  • Xây dựng các Blog vệ tinh
  • Mua Backlink từ các website khác
  • ..........
Xây dựng link nội bộ trên Blog

Trái với Backlink, link nội bộ là link trỏ từ các liên kết trên chính Blog của bạn. Link nội bộ có tầm quan trọng to lớn trong việc tối ưu hóa Blogger bởi vì nó không những cải thiện thứ hạng của Blog mà còn giảm đáng kể tỉ lệ thoát từ người đọc

Đối với Blogger, chúng ta có thể sử dụng một số cách sau đây để tạo link nội bộ
  • Chèn liên kết nội bộ vào bài viết
  • Thêm widget bài viết liên quan

Lời kết :

Trên đây là một số công việc mà theo mình rất cơ bản để làm SEO cho Blogger. Thế nhưng, việc làm SEO cho Blogspot không chỉ bao gồm những công việc mình liệt kê ở trên mà còn rất nhiều công việc khác.

Cuối cùng, mình xin nhấn mạnh một lần nữa, các bạn phải xây dựng nội dung trên Blog thật chất lượng, hữu ích để quá trình SEO đạt hiệu quả cao hơn. Chúc các bạn thành công

Thứ Tư, 25 tháng 5, 2016

Seri hướng dẫn Blogger cơ bản cho người mới

Hiện nay, chúng ta có khá nhiều lựa chọn để xây dựng một Blog cho riêng mình. Trong đó, có hai CMS ( Content Management System ) đang rất được ưa chuộng đó là Wordpress và Blogger. Cả hai nền tảng đều có ưu và nhược điểm riêng song thực sự cả Wordpress và Blogger đều rất đáng để sử dụng.


Tuy Blogger khó có thể so sánh được với Wordpress nhưng Blogger vẫn có những lợi thế hơn hẳn như : miễn phí, dễ dàng cài đặt và sử dụng........ Chính vì thế, tại sao bạn không thử lựa chọn Blogger để xây dựng một Blog cho mình ?

Trong Seri bài viết này, mình sẽ hướng dẫn chi tiết nhất có thể để ngay cả những bạn chưa biết gì cũng có thể sử dụng được Blogger thuần thục. Tuy nhiên, mình cũng xin nhấn mạnh đây chỉ là seri hướng dẫn cơ bản mà thôi, còn để nâng cao hơn nữa hay theo dõi các bài viết thủ thuật khác trên Blog.

Bạn sẽ học được gì trong seri này ?

Minh tin rằng, sau khi theo dõi loạt bài viết này, các bạn sẽ có cái nhìn tổng quan nhất về Blogger cũng như lợi ích, tiềm năng của nó. Bên cạnh đó, bạn sẽ nắm bắt được cách sử dụng các chức năng có sẵn của Blogger

Những ai nên theo dõi seri này ?

Tất cả mọi người. Seri này mình hướng dẫn khá chi tiết để những bạn hoàn toàn chưa biết gì về Blogger cũng có thể nắm bắt được. Chỉ cần bạn có niềm đam mê, chịu khó tìm tòi, học hỏi thì chắc chắn không gì là không thể

Bạn cần chuẩn bị gì trước khi theo dõi seri này ?

Để bắt đầu sử dụng Blogger, có một số điều bạn cần chuẩn bị như sau
  • 1 tài khoản Gmail
  • 1 số kiến thức cơ bản về HTML và CSS ( Không bắt buộc )

Seri này gồm những nội dung gì ?

Đây là nội dung mình sẽ viết trong seri này, các bạn nên xem qua để nắm bắt đươc

Thứ Hai, 23 tháng 5, 2016

Hướng dẫn cách tạo trang 404 cho Blogger

404 là lỗi rất hay gặp, lỗi này xảy ra khi bạn truy cập vào một đường link không còn tồn tại ( do nội dung cũ hoặc lí do nào đó bị xóa ) trên website đó.


Thông thường, để giải quyết lỗi này, các blogger hay tạo trang 404 ( 404 Eror Page ) để thông báo cho người đọc biết rằng liên kết này đã hỏng và điều hướng người dùng đến trang chủ hoặc một liên kết khác.

Hướng dẫn cách tạo trang 404 cho Blogger

Để tạo trang 404 cho Blogger, chúng ta sẽ sử dụng thẻ điều kiện <b:if> , một ít HTML và CSS. Các bạn thêm đoạn code sau vào dưới thẻ <body>

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
.........
</b:if>

trong đó ..... là nội dung bạn muốn hiển thị trên trang 404, có thể là một đoạn text, hoặc một đoạn HTML và CSS

Nếu các bạn không rõ lắm về HTML vs CSS thì có thể sử dụng luôn mẫu mình giới thiệu sau đây


Bước 1 : Chèn đoạn code phía trên thẻ </head>

<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700,600&subset=latin,vietnamese' rel='stylesheet' type='text/css'/>

Mình sẽ sử dụng font Open Sans, nếu như các bạn thích sử dụng font này thì sử dụng font khác nhé.

Bước 2 : Chèn đoạn code sau dưới thẻ <body>

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<div id='error404'>
<div id='error-text'>
<span>404</span>
<p>Sorry, the page you are looking for could not be found</P>
<p><a  href="http://www.abcxyz.blogspot.com">HOME PAGE</a></p>
</div>
</div>
</b:if>

trong đó abcxyz.blogspot.com là đường dẫn blog của bnaj

Bước 3 : Chèn đoạn code sau phía trên thẻ ]]></b:skin>

#error404{font-family:'Open Sans';text-align:center;font-weight:700;font-size:20px;position:fixed;width:100%;height:100%;line-height:1.5em;z-index:9999;background:#039BE6}
#error-text{top:30%;position:relative;font-size:20px;color:#eee}
#error-text span{position:relative;color:#fff;font-size:200px;padding:0 20px;border-radius:5px;font-weight:700;letter-spacing:3px;transition:all .5s}
#error404 p{margin-top:50px;color:#6CC5F1}
#error-text a{padding:15px 20px;border-radius:20px;border:1px solid #fff;color:#fff;text-decoration:none;font-weight:400}

Bước 4 : Save template lại và test

Chúc các bạn thành công

Thứ Bảy, 21 tháng 5, 2016

The One Template Blogger - Template Blogger đơn giản, responsive

Đây là mẫu template mình lấy ý tưởng từ một theme wordpress của 7uptheme. Mẫu template nhìn chung cũng khá đơn giản, phù hợp cho các blog chia sẻ thủ thuât, game, phim....



Một số tính năng
  • Responsive
  • Tối ưu hóa SEO
  • Ads Ready
  • Breadcrumb
  • Mobile Friendly
  • Bài viết liên quan 
  • Button mạng xã hội, chia sẻ bài viết 
  • Bài viết mới nhất
  • Author Box
  • .......
Hướng dẫn cài đặt

1. Thay Logo

<!-- Logo -->
  <a href='/'><img src='https://lh3.googleusercontent.com/-15Ye4ooxcdY/VyBW0rhImwI/AAAAAAAAC2c/vQ0SV7aO6DoXlLrmmez0WYJ5YIn9ekalgCCo/s240/logo.png'/></a>
<!-- Logo -->

2. Chỉnh sửa Menu 

<!-- Menu -->
<ul id='menu'>
<li><a href='/'>Home</a></li>
<li><a href='#'>Featured</a>
<ul class='sub-menu'>
<li><a href='#'>Sub Menu 1</a></li>
<li><a href='#'>Sub Menu 2</a></li>
<li><a href='#'>Sub Menu 3</a></li>
</ul>
</li>
<li><a href='#'>Business</a>
<ul class='sub-menu'>
<li><a href='#'>Sub Menu 1</a>
</li>
<li><a href='#'>Sub Menu 2</a></li>
<li><a href='#'>Sub Menu 3</a></li>
</ul>
</li>
<li><a href='#'>Mobile</a></li>
<li><a href='/'>Fashion</a></li>
<li><a href='/'>Shop</a></li>
<li><a href='/'>Travel</a></li>
<li><a href='/'>Spot</a></li>
</ul>
<!-- Menu -->

Menu ở Footer

<!-- Menu Footer -->
<ul>
<li><a href='#'>SUBSCRIBE</a></li>
<li><a href='#'>ADVERTISE</a></li>
<li><a href='#'>SITE MAP</a></li>
<li><a href='#'>PRESS CENTER</a></li>
<li><a href='#'>CUSTOMER CARE</a></li>
<li><a href='#'>CONTACT US</a></li>
<li><a href='#'>NEWSLETTER</a></li>
<li><a href='#'>WIRED STAFF</a></li>
<li><a href='#'>JOBS</a></li>
<li><a href='#'>RSS</a></li>
</ul>
<!-- Menu Footer -->

3. Chỉnh sửa button mạng xã hội

<!-- Social Footer -->
<ul>
  <li><a class='s1' href='#'><i class='fa fa-facebook'/></a></li>
  <li><a class='s2' href='#'><i class='fa fa-twitter'/></a></li>
  <li><a class='s3' href='#'><i class='fa fa-google-plus'/></a></li>
  <li><a class='s4' href='#'><i class='fa fa-youtube'/></a></li>
  <li><a class='s5' href='#'><i class='fa fa-pinterest'/></a></li>
  <li><a class='s6' href='#'><i class='fa fa-instagram'/></a></li>
</ul>
<!-- Social Footer -->

4. Chỉnh sửa Author Box 

<!-- Author Box -->
<div class='author-name'>
ABOUT AUTHOR / The One
  </div>
<div class='author-content'>
<div class='author-ava'>
<a href='#'><img alt='' class='avatar avatar-96 photo avatar-default' height='96' src='http://0.gravatar.com/avatar/?s=96&amp;d=mm&amp;r=g' srcset='http://0.gravatar.com/avatar/?s=192&amp;d=mm&amp;r=g 2x' width='96'/>  </a>
</div>
<div class='author-info'>
<p>Suspendisse potenti. Maecenas tristique condimentum lectus, a convallis nulla pellentesque a. Quisque ut est vitae leo finibus pharetra quis id sem. Integer quis eleifend felis, lacinia blandit dolor. Integer fringilla posuere dictum. Fusce lobortis eu mi id mattis. Nunc eu metus mi. Sed ac elementum tellus.</p>
<ul class='author-social'>
<li><a href='#'><i class='fa fa-google-plus'/></a></li>
<li><a href='#'><i class='fa fa-facebook'/></a></li>
<li><a href='#'><i class='fa fa-twitter'/></a></li>
<li><a href='#'><i class='fa fa-linkedin'/></a></li>
<li><a href='#'><i class='fa fa-youtube'/></a></li>
<li><a href='#'><i class='fa fa-vimeo'/></a></li>
</ul>
</div>
</div>
<!-- Author Box --> 

5. Thiết lập xem Blog trên Mobile



Chúc các bạn thành công

Thứ Hai, 16 tháng 5, 2016

Tối ưu hóa file robots.txt cho Blogger chuẩn SEO

Trong quá trình tối ưu hóa, làm SEO cho Blogspot, chắc chắn các bạn đã nghe đến file robots.txt. Vậy, robots.txt là gì ? Tác dụng của nó là gì ? Tối ưu hóa ra sao ? Bài viết này sẽ giúp bạn trả lời tất cả nhưng câu hỏi trên


Robots.txt là gì ? Tác dụng của nó là gì ?

Robots.txt là một file txt đơn giản có thể được tạo bởi Notepad và chỉ chứa một vài dòng code bên trong đó. Robots.txt được sử dụng để hướng công cụ tìm kiếm đến những trang bạn cần index, đồng thời không cho phép bot index những trang bạn không muốn index. Do đó robots.txt có vai trò khá trong khi làm SEO cho Blogger

Tối ưu hóa file robots.txt cho Blogger chuẩn SEO

Bước 1 : Đăng nhập vào Blogger => Cài đặt

Bước 2 : Chọn Tùy chọn tìm kiếm sau đó để ý phần Trình thu thập thông tin và lập chỉ mục

Bước 3 : Nhấn Chỉnh sửa ở phần Robots.txt tùy chỉnh sau đó chọn



Bước 4 : Chèn đoạn code dưới đây vào và ấn Lưu thay đổi

User-agent: Mediapartners-Google
Disallow:
User-agent: *
Allow: /
Disallow: /search
Disallow: /*?updated-max=*
Disallow: *archive.html
Sitemap: http://abcxyz.blogspot/feeds/posts/default?orderby=UPDATED

Thay abcxyz.blogspot bằng đường link blog của bạn

Chúc các bạn thành công