Sửa lỗi Load more posts của template blogspot Sevida 1.7 nhanh

Sevida là một themes blogsopt khá đẹp và nhiều chức năng. Ngoài bản tính phí thì Sevida cũng đính kèm phiên bản chia sẻ miễn phí trên mạng. Tuy nhiên vô tình trang bản free lại mắc lỗi "Load more posts". Nếu bạn nào dùng mà bị lỗi có thể làm theo cách sau để sửa lỗi nhé

Hướng dẫn tạo Breaking News cho Blogspot

Làm thế nào để Thêm Breaking News (Tạo tin tức mới) cho Blogspot. Ở bài viết này mình hướng dẫn cho các bạn tạo mục tin tức mới , tin hot nằm đầu tiên trên các bài đăng. Việc tạo khá đơn giản.


Các bước thực hiện như sau: Lưu ý tùy thuộc vào Template blospot  của các bạn để thực hiện nhé!

Đầu tiên vào Blog của bạn Bloger-->Mẫu-->>Chỉnh sửa HTML



Nhấn Ctrl + F tìm kiếm ]]></b:skin> hoặc </style>


/* CSS Breaking News */


#breakingnews {margin:15px 0 0 0;margin-right:15px;height:42px;line-height:29px;overflow:hidden;background:#fff;border:1px solid #e6e6e6;}


#breakingnews .breakhead {position:absolute;background:none repeat scroll 0 0 #363b40;color:#fff;display:block;float:left;font-family:inherit;font-size:16px;font-weight:400;text-transform:uppercase;padding:6.5px 22px;}


#adbreakingnews li a {font-family:inherit;font-weight:400;color:#666;margin-top:10px;transition:all 0.5s ease-in-out;}


#adbreakingnews li a:hover {color:#359bed;}


#adbreakingnews {float:left;margin-left:75px;margin-top:6px;}


#adbreakingnews ul,#adbreakingnews li{list-style:none;margin:0;padding:0}




@media only screen and (max-width:640px){


#breakingnews {margin:20px 0 0 0;margin-right:0;}


#breakingnews .breakhead {padding:6.5px 14px;}


#adbreakingnews {margin-left:50px;}}


Sau đó, thêm mã dưới đây vào thẻ đóng </body>

<script type='text/javascript'>


//<![CDATA[


// Breaking News


$(document).ready(function(){var e="https://seowebaz.blogspot.com",t=20;$.ajax({url:""+e+"/feeds/posts/default?alt=json-in-script&max-results="+t,type:"get",dataType:"jsonp",success:function(e){function t(){$("#adbreakingnews li:first").slideUp(function(){$(this).appendTo($("#adbreakingnews ul")).slideDown()})}var n,r,s="",a=e.feed.entry;if(void 0!==a){s="<ul>";for(var l=0;l<a.length;l++){for(var o=0;o<a[l].link.length;o++)if("alternate"==a[l].link[o].rel){n=a[l].link[o].href;break}r=a[l].title.$t,s+='<li><a href="'+n+'" target="_blank">'+r+"</a></li>"}s+="</ul>",$("#adbreakingnews").html(s),setInterval(function(){t()},5e3)}else $("#adbreakingnews").html("<span>No result!</span>")},error:function(){$("#adbreakingnews").html("<strong>Error Loading Feed!</strong>")}})});


//]]>


</script>


Thay thế link https://seowebaz.blogspot.com bằng địa chỉ của bạn, sau đó lưu vào mã dưới ở mục nào bạn thích, thường thì đầu tiên header. Áp dụng trong các thẻ body nhé các bạn ( Nằm giữa 2 thẻ này <body> và thẻ đóng </body> ).


<div id='breakingnews'><span class='breakhead'><i class='fa fa-rss'/></span>


<div id='adbreakingnews'>Loading...</div></div>


Nếu bạn muốn hiển thị các tin tức trên trang chính, xin các bạn đánh dấu trong các thẻ nằm code dưới đây


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


<div id='breakingnews'><span class='breakhead'><i class='fa fa-rss'/></span>


<div id='adbreakingnews'>Loading...</div></div>


</b:if>



Sau đó lưu mẫu! 

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

Thủ thuật thay đổi Blog Trở thành Dofollow và Nofollow

Thủ thuật thay đổi Blog Trở thành Dofollow và Nofollow, Đối với một số blog các bạn muốn thay đổi liên kết trở thành Dofollow, thủ thuật này rất đơn giản


Các bước thực hiện:


Bước 1: Đăng nhập vào Bloger của bạn



Bước 2: Sau đó vào: Mẫu-->Chỉnh Sửa HTML


Ở bước này: các bạn tìm kiếm ( Nhấn Ctrl + F ) mã dưới đây:

<a expr:href='data:backlink.url' rel='nofollow'>

Các bạn có thể loại bỏ tất cả các thuộc tính rel="nofollow"

<a expr:href='data:backlink.url' rel='nofollow'>

Nó sẽ trở thành như đoạn code dưới :

<a expr:href='data:backlink.url'>

Sau đó nhấn Save Template. Đó là cách để biến Blog của bạn từ Nofollow trở thành DoFollow, khá đơn giản. Hy vọng sẽ hữu ích cho các bạn. cảm ơn các bạn đã đọc

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

Cách Rút gọn link Google trong Blogspot

Bài này mình chia sẻ cho các bạn cách rút gọn links google ngay trong trang bài viết của blog. Cách Rút gọn link Google trong Blogspot


Google URL Shortener tại goo.gl được sử dụng bởi các sản phẩm của Google để tạo URL ngắn mà có thể dễ dàng chia sẻ, Tweet, hoặc gửi qua Email cho bạn bè.

Các bước thực hiện như sau:

Bước 1:  Để hiển thị một URL ngắn ở dưới cùng của mỗi bài viết. Vào quản trị Blog--> Chọn Blog--> Mẫu-->Chỉnh sửa HTML

Bước 2: Tìm kiếm thẻ </style>


Bước 3: Dán đoạn Javascript dưới sau thẻ đóng </style>



<script type='text/javascript'>
// Shorten Blogger post URLs using urltinyfy javascript API, by MS-potilas 2012
//
//<![CDATA[
function loadscript(filename) {
var scr=document.createElement('script');
scr.setAttribute("type","text/javascript");
scr.setAttribute("src",filename);
document.getElementsByTagName("head")[0].appendChild(scr);
}
var waitElm=null;
function urltinyfyprompt_callback(response) {
if(waitElm) waitElm.style.display="none";
var txt="Short URL";
if(response.title && response.title!="") txt+=' for "'+response.title+'"';
else if(response.longurl && response.longurl!="") txt+=" for "+response.longurl;
if(response.tinyurl && response.tinyurl!="")
prompt(txt+":", response.tinyurl);
else
alert("Could not get short URL, try again later." + ((response.error && response.error != "") ? ("\nError: " + response.error) : ""));
}
function shortenUrl(elm, long_url, service) {
waitElm=elm.parentNode.nextSibling;
if(waitElm) waitElm.style.display="inline";
loadscript("http://urltinyfy.appspot.com/"+service+"?unify=1&url="+encodeURIComponent(long_url) + "&callback=urltinyfyprompt_callback");
}
//]]>
</script>

Bước 3: Chèn đoạn code dưới trên đoạn post-footer-line-3

<span class='shorturls'>Short URLs:
<a expr:onclick='&quot;shortenUrl(this, &amp;#39;&quot; + data:post.url + &quot;&amp;#39;, &amp;#39;googl&amp;#39;);return false;&quot;' href='javascript:void(0)' title='Click to get short URL'>goo.gl</a>,
<a expr:onclick='&quot;shortenUrl(this, &amp;#39;&quot; + data:post.url + &quot;&amp;#39;, &amp;#39;mcafee&amp;#39;);return false;&quot;' href='javascript:void(0)' title='Click to get short URL'>mcaf.ee</a>,
<a expr:onclick='&quot;shortenUrl(this, &amp;#39;&quot; + data:post.url + &quot;&amp;#39;, &amp;#39;cligs&amp;#39;);return false;&quot;' href='javascript:void(0)' title='Click to get short URL'>cli.gs</a>
</span><span style='display:none;'><img border='0' src='data:image/gif;base64,R0lGODlhEAALAPQAAP///wAAANra2tDQ0Orq6gYGBgAAAC4uLoKCgmBgYLq6uiIiIkpKSoqKimRkZL6+viYmJgQEBE5OTubm5tjY2PT09Dg4ONzc3PLy8ra2tqCgoMrKyu7u7gAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCwAAACwAAAAAEAALAAAFLSAgjmRpnqSgCuLKAq5AEIM4zDVw03ve27ifDgfkEYe04kDIDC5zrtYKRa2WQgAh+QQJCwAAACwAAAAAEAALAAAFJGBhGAVgnqhpHIeRvsDawqns0qeN5+y967tYLyicBYE7EYkYAgAh+QQJCwAAACwAAAAAEAALAAAFNiAgjothLOOIJAkiGgxjpGKiKMkbz7SN6zIawJcDwIK9W/HISxGBzdHTuBNOmcJVCyoUlk7CEAAh+QQJCwAAACwAAAAAEAALAAAFNSAgjqQIRRFUAo3jNGIkSdHqPI8Tz3V55zuaDacDyIQ+YrBH+hWPzJFzOQQaeavWi7oqnVIhACH5BAkLAAAALAAAAAAQAAsAAAUyICCOZGme1rJY5kRRk7hI0mJSVUXJtF3iOl7tltsBZsNfUegjAY3I5sgFY55KqdX1GgIAIfkECQsAAAAsAAAAABAACwAABTcgII5kaZ4kcV2EqLJipmnZhWGXaOOitm2aXQ4g7P2Ct2ER4AMul00kj5g0Al8tADY2y6C+4FIIACH5BAkLAAAALAAAAAAQAAsAAAUvICCOZGme5ERRk6iy7qpyHCVStA3gNa/7txxwlwv2isSacYUc+l4tADQGQ1mvpBAAIfkECQsAAAAsAAAAABAACwAABS8gII5kaZ7kRFGTqLLuqnIcJVK0DeA1r/u3HHCXC/aKxJpxhRz6Xi0ANAZDWa+kEAA7AAAAAAAAAAAA'/></span><div style='clear:both'/>


Shortener Url là việc tối ưu đường dẫn trong thế giới Internet quá nhiều url khác nhau.

Tổng kết: Việc chèn Code tạo Rút gọn link Google trong Blogspot tùy thuộc vào template của bạn chọn, có thể copy đoạn code ở bước 3 vào chỗ nào trong bai viết bạn muốn hiển thị, cách đặt của nó giống như cách trong bài Chèn comment Facebook vào Blogspot mới nhất. 

Chúc các bạn làm được như ý!




Chèn comment Facebook vào Blogspot mới nhất

Điểm lợi thế khi thêm comment facebook vào blogspot là tiện cho việc hỏi của người dùng, đại đa số phần lớn người dùng họ luôn dùng facebook!



Sau khi tạo được App thì đã có mã scrip rồi! các bạn vào Blog-->Mẫu-->Chỉnh sửa HTML tìm thẻ </body> và dán đoạn code sau vào trên nó


<script>
window.fbAsyncInit = function() {
FB.init({
appId : '9829012345044999',
xfbml : true,
version : 'v2.8'
});
};

(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

Các bạn thay số dòng  appId : '9829012345044999', thành số appId của các bạn!

Thêm khung bình luận facebook vào bài viết
Ở đây nếu bạn muốn chèn khung bình luận vào vị trí cuối bài viết thì xem cách dưới đây. Nếu không bạn có thể chèn bất cứ vị trí nào bạn thích. Mà thường thì dưới mỗi bài viết.

Tìm đến thẻ: <div class='comment' id='comment'>
Và chèn code dưới đây sau nó. Chú ý bạn sẽ tìm thấy vài thẻ như trên, hãy lần lượt thay thế, đúng vị trí mới hiện thị.

<div class='fb-comments' data-num-posts='5' data-width='100%' expr:href='data:post.canonicalUrl'/>



Các bạn nên chú ý phần này:
data-num-posts='5' : Tức là chỉ load tự động 5 bình luận
data-width=  : Độ rộng của khung bình luận
Nói thêm cho các bạn về thẻ của facebook: Thêm thuộc tính quản trị (tức thêm thẻ Meta) thêm sau thẻ <head>

<meta content='id các bạn' property='fb:app_id'/> 
<meta content=''id các bạn' property='fb:admins'/>
<meta content='https://www.facebook.com/'id các bạn/' property='article:publisher'/>
<meta content='https://www.facebook.com/'id các bạn/' property='article:author'/>
Thay màu đỏ thành id của các bạn

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

Cách tạo app và lấy ID cho trang Facebook


Nhưng các bạn nên nhớ rằng việc tạo comment facebook các bạn còn phụ thuộc vào App facebook mình tạo. để quản lý comment nhé, Sau đây mình trình bày cách tạo app lấy id cho trang facebook.

Tạo app và lấy ID cho trang:

Các bạn đăng nhập vào trang: https://web.facebook.com/insights ở đây mình làm với phiên bản mới nhất là Comment Facebook Phiên bản Graph API v2.8

Các bạn nhấn vào Tạo ứng dụng sẽ xuất hiện bảng sau:


Khi các bạn chưa có tài khoản App của Facebook thì hãy nhấn Đăng ký ngay nhé! Sau khi nhấn sẽ xuất hiện bảng: Tích vào chữ o để tiếp!


Sau khi nhấn tiếp! Thêm số điện thoại và nhấn Gửi dưới dạng tin nhắn thì Facebook sẽ gửi mã xác nhận nhập vào và nhấn Đăng ký



Lúc này các bạn chon WWW nhé!

Sau khi chọn WWW sẽ là


Các bạn nhập tên App muốn tạo và nhấn Tạo ID ứng dụng Facebook mới


Các bạn điền Email, phần danh mục các bạn chon Ứng dụng cho trang sau đó nhấn Tạo ID ứng dụng


Sẽ hiện ra như hình sau, các bạn nhập mã bảo mật và gửi

Như thế này là đã xong quá trình tạo App Facebook rồi,


Cảm ơn các bạn đã đọc bài viết của mình, phần sau mình xin viết bài cách Chèn comment Facebook vào Blogspot mới nhất nhé!

Sau khi tạo xong Facebook sẽ hiển thị đoạn mã script để sau này dùng mã đó vào việc chèn comment các plugin của facebook.

Nói thêm: Để tiện cho việc tìm ID facebook cá nhân của bạn bằng cách sử dụng trang web Lookup-id.com

Cách tạo bài viết liên quan trong Blogspot

Bài viết liên quan không chỉ làm cho bài viết của chúng ta đẹp hơn, chuyên nghiệp hơn. Nó còn giúp cho chúng ta điều hướng người dùng tốt hơn, giúp họ có thể dễ dàng tìm được những bài viết có cùng nội dung hay chủ đề được nói đến.


Cách tạo bài viết liên quan cho Blogspot

Những gì các bạn làm liên quan đến code thì mình khuyên các bạn nên sao lưu lại phòng trường hợp bị hỏng dẫn tới lỗi.

Bước 1: Các bạn copy đoạn code sau và chèn vào trước thẻ </head> . Đây là đoạn Script dùng để lấy ra danh sách các bài viết liên quan từ những bài có cùng chung label với bài viết bạn đang xem.

<script type='text/javascript'>
//<![CDATA[
var titles = new Array();
var titlesNum = 0;
var urls = new Array();
var time = new Array();

function related_results_labels(c) {
for (var b = 0; b < c.feed.entry.length; b++) {
var d = c.feed.entry[b];
titles[titlesNum] = d.title.$t;
for (var a = 0; a < d.link.length; a++) {
if (d.link[a].rel == "alternate") {
urls[titlesNum] = d.link[a].href;
time[titlesNum] = d.published.$t;
titlesNum++;
break
}
}
}
}

function removeRelatedDuplicates() {
var b = new Array(0);
var c = new Array(0);
e = new Array(0);
for (var a = 0; a < urls.length; a++) {
if (!contains(b, urls[a])) {
b.length += 1;
b[b.length - 1] = urls[a];
c.length += 1;
c[c.length - 1] = titles[a];
e.length += 1;
e[e.length - 1] = time[a]
}
}
titles = c;
urls = b;
time = e
}

function contains(b, d) {
for (var c = 0; c < b.length; c++) {
if (b[c] == d) {
return true
}
}
return false
}

function printRelatedLabels(a) {
var y = a.indexOf('?m=0');
if (y != -1) {
a = a.replace(/\?m=0/g, '')
}
for (var b = 0; b < urls.length; b++) {
if (urls[b] == a) {
urls.splice(b, 1);
titles.splice(b, 1);
time.splice(b, 1)
}
}
var c = Math.floor((titles.length - 1) * Math.random());
var b = 0;
document.write("<ul>");
if (titles.length == 0) {
document.write("<li>Không có bài viết liên quan → </li>")
} else {
while (b < titles.length && b < 20 && b < maxresults) {
if (y != -1) {
urls[c] = urls[c] + '?m=0'
}
document.write('<li><a href="' + urls[c] + '" title="' + time[c].substring(8, 10) + "/" + time[c].substring(5, 7) + "/" + time[c].substring(0, 4) + '">' + titles[c] + "</a></li>");
if (c < titles.length - 1) {
c++
} else {
c = 0
}
b++
}
}
document.write("</ul>");
urls.splice(0, urls.length);
titles.splice(0, titles.length)
};
//]]>
</script>

Bước 2: Các bạn tiếp tục copy đoạn code dưới đây và chèn vào vị trí muốn hiển thị. Bởi đây là đoạn code dùng để show ra danh sách mà đoạn code ở bước thứ nhất đã lấy ra. Thường thì chèn nó vào ngay dưới nội dung của bài viết

Bây giờ tìm đến thẻ <data:post.body/> và dán đoạn code sau dưới thẻ đỏ đó.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='bai-viet-lien-quan'>
<h4>
Bài viết liên quan:
</h4>
<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&quot;' type='text/javascript'/>
</b:loop>
<script type='text/javascript'>
var maxresults=5;
removeRelatedDuplicates();
printRelatedLabels(&quot;<data:post.url/>&quot;);
</script>
</div>
</b:if>

Hình sau:

Mình giải thích thêm var maxresults=5; là số lượng bài viết cần hiển thị và hiển thị là 5, các bạn có thể thay đổi giá trị này phụ thuộc vào bạn!

Bước 3: Sau khi xác định được vị trí cần đặt cho bài viết liên quan, bây giờ đến phần css phần này chỉnh sửa giao diện cho nó.

#bai-viet-lien-quan {
float: left;
width: 100%;
margin: 20px 0;
border-left: 1px solid #e6e6e6;
border-right: 1px solid #e6e6e6;
}
#bai-viet-lien-quan h4 {
font-size: 20px;
background: #e9e9e9;
padding: 10px 5px;
color: #8BC34A;
}
#bai-viet-lien-quan ul {
padding: 0;
margin: 0;
}
#bai-viet-lien-quan ul li {
padding: 5px;
border-bottom: 1px solid #e6e6e6;
}

Phần CSS này các bạn copy và dán vào trước thẻ </style> nhé!

P/s: Cũng tùy thuộc vào template nhé các bạn, vì mỗi template nó xây dựng mỗi khác, có nhiều template hỗ trợ rồi nhưng vẫn còn nhiều chưa hỗ trợ.

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

Cách Chuyển hướng Liên Kết Trong Blogspot

Chào các bạn nội dung bài viết này mình muốn chia sẻ đến các bạn cách chuyển trang khi gặp trang lỗi hoặc trống


Khi một trang đã được lập chỉ mục trong Google SERP, sau đó trang này đã bị xóa hoặc di chuyển. Những người truy cập sẽ thấy một trang không tìm thấu, hầu hết mọi người sẽ đóng trang không tìm thấy nó. Vì vậy cần chuyển hướng tìm thấy trang khác, hỗ trợ tốt hơn cho người đọc.

Các bước thực hiện như sau:
Bước 1: Các bạn sao chép mã sau

<script type = "text/javascript">
yukita_redirect = setTimeout(function() {
window.location.href = 'http://ngocgn90.blogspot.com/p/lien-he.html';
}, 10);
</script>

Bước 2: Sau đó hãy vào Bloger-->Cài đặt-->Tùy chọn tìm kiếm-->Không được tìm thấy trang tùy chỉnh-->chỉnh sửa, sau đó copy mã trên và lưu lại các thay đổi của bạn.


Đặc điểm bài này cách để chuyển hướng đến trang cố định thay vì phải đến trang 404 mà thay vào đó đến các trang mình cần đến, ví dụ như trang liên hệ

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

Cách tạo trang sitemap html cho blogspot

Sitemap còn được gọi là sơ đồ của một blogspot là một danh lục liệt kê tất cả các mục thông tin trên trang blog của bạn, nó bao gồm các nhãn chứa các bài viết được liệt kê rõ ràng.


Hôm nay mình sẽ hướng dẫn các bạn cách tạo trang sitemap html cho blogspot từ code gắng vào trang, không qua trung gian để lấy script nên khả năng là không lỗi, và không phụ thuộc vào các host khác!

Với cách tạo đơn giản các bạn không phải rườm ra để tạo ra một trang sitemap. ở đây các bạn không phụ thuộc mã script từ các site khác, tạo trên trang của mình luôn

Các bước để tạo: Đầu tiên các bạn vào Trang-->tạo Trang mới
Ở phần tiêu đề trang các bạn để tên là: Sitemap nhé, vì để như v sẽ theo cấu trúc của Seo, và vào mục Tùy chọn-->Không cho phép (ở đây mình sẽ không cho bình luận ở trang sitemap)


Các bạn vào thẻ HTML và copy đoạn javascript dưới vào:

<script type="text/javascript">
var numposts = 100;
var standardstyling = true;
function showrecentposts(json) {
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}}
posttitle = posttitle.link(posturl);
if (standardstyling) document.write('<li>');
document.write(posttitle);}
if (standardstyling) document.write('</li>');
}
</script>

Và bây giờ các copy đoạn code sau dán vào sau đoạn javascript trên 

<ul>
<script src="http://vivublogspot.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts&amp;max-results=999"></script>
</ul>
Các bạn chú ý thay đường link màu xanh thanh links của bạn nhe!
Nếu các bạn muốn sitemap sắp xếp theo nhãn thì các bạn có thể chèn đoạn code dưới vào thay cho đoạn code ở trên đó

<strong><a href="http://vivublogspot.blogspot.com/search/label/Seo%20Onpage">Seo Onpage</a></strong>
<br />
<br />
<ul>
<script src="http://vivublogspot.blogspot.com/feeds/posts/default/-/Seo%20Onpage?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts&amp;max-results=999"></script>
</ul>
<br />

Về phần %20 đó thì các bạn xóa đi và viết lại không dấu cũng được.

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

Cách tạo Breadcrumbs cho Blogspot

Breadcrumb là tập hợp các đường link phân cấp giúp khách truy cập biết mình đang ở vị trí nào của blog chuyên mục nào từ đó có thể di chuyển thuận lợi từ trang này trang khác trong 1 blog/website. Nó như là vector chỉ hướng cho người dùng họ biết được họ đang đứng ở đâu trong trang, và cũng là điều hướng cho công cụ tìm kiếm hiểu rõ hơn.

Để tạo được 1 Breadcrumb các bạn nên chú ý các bước thực hiện ở dưới, vì dính đến code thay thế nên khi sai các bạn sẽ không được Breadcrumb.

1. Các bước thực hiện

Đầu tiên các bạn vào Mẫu-->Chỉnh sửa HTML :

Bước 1: Các bạn tìm đến thẻ: <b:include data='top' name='status-message'/> sau đó các bạn hãy thêm vào bên dưới thẻ này đoạn code sau: <b:include data='posts' name='breadcrumb'/> 

Ở Bước này là dùng để xác định vị trí hiển thị cho Breadcrumbs của các bạn.

Bước 2: Các bạn hãy tìm đến thẻ <b:includable id='main' var='top'> và sau đó hãy thêm đoạn code dưới đây vào ngay bên trên thẻ này

<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == "static_page"'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Trang chủ</a></span> » <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<!-- breadcrumb for the post page -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v="http://rdf.data-vocabulary.org/#">
<span typeof="v:Breadcrumb"><a expr:href='data:blog.homepageUrl' rel="v:url" property="v:title">Trang chủ</a></span>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'>
» <span typeof="v:Breadcrumb"><a expr:href='data:label.url' rel="v:url" property="v:title"><data:label.name/></a></span>
</b:if>
</b:loop>
» <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Trang chủ</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Trang chủ</a></span> » <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == ""'>
<span><a expr:href='data:blog.homepageUrl'>Trang chủ</a></span> » <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Trang chủ</a></span> » <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>


Bước này dùng để định nghĩa Breadcrumbs trong blogspot.


Bước 3: Chủ yếu giao diện cho Breadcrumbs, nghĩa là làm đẹp cho Breadcrumbs. 
Ở bước này các bạn tìm đến ]]></b:skin> sau đó bạn hãy thêm CSS cho Breadcrumbs của mình để trông nó đẹp hơn là được. Bạn có thể tham khảo đoạn CSS dưới đây:

.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:95%
;line-height: 1.4em;
border-bottom:3px double #e6e4e3;
}

Vậy là xong quá trình làm đẹp cho Breadcrumbs của blog!

Tổng kết: Lợi ích khi xây dựng Breadcrumbs là hướng đến người dùng, vừa làm đẹp cho blog vừa là hướng chỉ người dùng trong nội dung và là hướng đến google search.

Cách viết bài trong Blogspot chuẩn Seo

Làm sao để có được title chuẩn seo và nội dung bài viết đầy đủ. Nội dung của bài viết này chú trọng đến vấn đề Nội dung và tối ưu bài viết chuẩn Seo.


Để có được một bài viết chuẩn Seo trong Blogspot bao gồm:
  • Link seo (url) 
  • Thẻ Meta Description (Thẻ mô tả)
  • Thẻ Heading (Bao gồm 6 loại  H1, H2, H3, H4, H5, H6 )
  • Image (Thẻ ảnh)

1. Tối ưu link trong Blogspot

Để tối ưu, chỉnh sửa link trong blogspot các bạn vào trang bài đăng các bạn chọn Liên kết cố định -> Liên kết cố định tùy chỉnh -> nhập link vào. Một link (url) thân thiện với công cụ tìm kiếm:

Nên nhớ:
  • Link chứa từ khóa cần seo.
  • Mỗi từ cách nhau bằng dấu gạch ngang, không có dấu.
  • Hạn chế viết hoa và ký tự đặc biệt. (và đặt biệt chọn thời gian nữa nhé!)

2. Tối ưu thẻ mô tả cho blogspot

Thẻ mô tả (Meta Description) dùng để mô tả một cách khái quát nội dung của một bài viết hoặc của một website, giúp cho người dùng biết được các dịch vụ hoặc sản phẩm mà bạn cung cấp hoặc thông điệp mà bạn muốn truyền tải cho khách hàng. Google căn cứ 1 phần vào nội dung (đặc biệt là các từ khóa xuất hiện bên trong thẻ mô tả) để xếp hạng website của bạn.

Trong Blogspot thẻ mô tả có sẵn các bạn chỉ việc bật lên và gõ vào là được.
Một thẻ Meta Description được viết tốt nhất nằm trong một câu hoàn chỉnh vàc liệt kê được đầy đủ các thông tin có liên quan đến trang đó. Bạn cũng nên tránh lặp lại các từ khóa quá nhiều lần bên trong thẻ meta description. Lời khuyên là nên lặp lại tối đa 2-3 lần từ khóa khi viết thẻ meta description là đủ. Và độ dài tối đa của thẻ meta description là 165 ký tự.

Thêm thẻ mô tả cho blogspot

3. Thẻ heading trong Blogspot

Thẻ Heading trong SEO gồm 6 loại ( H1, H2, H3, H4, H5, H6 ). Theo thứ tự ưu tiên thì tầm quan trọng của các thẻ sẽ giảm dần. Thông thường thẻ được sử dụng nhiều nhất đó là H1, H2, H3 . Đây là 3 thẻ được sử dụng nhiều trong việc tối ưu Website. Nó được dùng để nhấn mạnh nội dung của chính chủ đề mà chúng ta đang nói đến.

Nhưng có 3 thẻ quan trọng nhất: 
  • Thẻ h1 : Nội dung chính bạn muốn đề cập, có từ khoán bạn SEO ( dùng duy nhất 1 thẻ H1 trong 1 webpage ).
  • Thẻ h2 : không nên quá 15 lần, nên tối đa 5 thẻ h2 trong 1 trang.Trong blogspot thì các bạn viết thẻ h2 bằng cách chọn tiêu đề ở trên thanh công cụ soạn thảo bài viết của blogpsot.
  • Thẻ h3 : Mô tả ngắn ngọn nội dung liên quan ( không quá 7 lần )

4. Tối ưu thẻ hình ảnh  cho blogspot

Một hình ảnh khi đưa lên blogspot các bạn nên nhớ rằng:
  • Chất lượng hình ảnh, phụ thuộc vào quy định của host, đối với blogspot thì chất lượng ảnh không quá lớn (dưới 100KB), và mình khuyên các bạn nên tự thiết kế cho mình các hình ảnh để phục vụ cho bài viết.
  • Gắng thuộc tính alt cho hình ảnh, thuộc tình alt này nhầm báo cho google nó sẽ hiểu hình ảnh này là gì.
  • Thẻ title cho ảnh.
Cả hai thẻ alt và title đề quan trọng đối với người dùng mặc dù thẻ  alt có tỏ ra quan trọng hơn đối với máy tìm kiếm. Chúng đều cung cấp  thông tin về hình ảnh nhằm khuyến khích người dùng hiển thị chúng.

Đối với Blgspot các bạn upload hình ảnh lên bài viết -->Click hình ảnh chọn Thuộc tính sẽ như hình:


Tổng kết:
Như vậy là việc các thao tác để bài viết trong blogspot mình chuẩn Seo, các bạn có thể tìm kiếm cho mình giao diện phù hợp để thuận lợi hơn trong việc cài đặt blogspot chuẩn seo nhé!

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

Cài đặt Blogspot

Sau khi tạo được một Blog các bạn cần chuẩn bị trước về nội dung, các label, khi Submit các url phần này mình sẽ đề cập đến các thuộc tính có sẵn chỉ cần cài đặt một số thao tác cơ bản cho phù hợp với cấu hình của Search GoogleSearch Engine Optimization hay còn gọi là SEO.


1. Mô tả cho tiêu đề

Mô tả này là một đoạn ngắn văn bản, chứa các từ khóa, nội dung của các từ mô tả là trọng tâm của Blog các bạn, Tăng khả năng mật đồj từ khóa, và mô tả này nó là thẻ <H2> 


2.Thẻ mô tả
Thẻ mô tả hay còn gọi là Description, đại diện cho trang chủ của blog và trong từng bài viết cũng có thẻ mô tả này.

Thẻ mô tả này đóng vai trò cực kỳ lớn đối với trang và bài viết, bởi lẻ nó là phần ngắn gọn ngoài từ khóa cho người đọc có thể nhìn từ đó click vào URL của bạn.
Để thêm thẻ Description mô tả này các bạn làm theo bài này nhé! Thêm mô tả Description cho Blogspot

3. Tạo Sitemap và cấu hình Robots 
Vê cách tạo sitemap có 2 loại: Loại thứ nhất tạo sitemap cho Search Engine Optimization nhận biết, và loại thứ 2 cho người dùng. Vấn đề này mình sẽ có bài riêng giải thích kỹ hơn cho các bạn.
Nôm na vấn đề cấu hình Robots trước đã.

Robots.txt là một file cấu hình cho công cụ tìm kiếm được hay không được truy xuất vào từng thư mục hay đường dẫn nằm trong file đó.

Các bạn cứ hiểu như vậy, thế để làm gì cho việc truy xuất của công cụ tìm kiếm hiệu quả mà không gây ra một số lỗi ảnh hưởng đến vấn đề SEO sau này.

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

Ở đây mình xin chỉ các bạn: Disallow là cấm truy xuất, có nghĩa công cụ tìm kiếm sẽ không tìm thấy. Và ngược lại Allow là cho phép tìm thấy. Cấu hình như trên là chuẩn rồi.

Các bạn vào Cài đặt rồi Tùy chọn tìm kiếm tiếp đến click vào chỉnh sửa và copy đoạn trên.

4. Thẻ tiêu đề Robots tùy chỉnh:

Về thẻ tiêu đề robot tùy chỉnh các bạn cấu hình như hình sau nhé!


Và một số các cấu hình khác mình thêm vào các bài sau:

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

Hướng dẫn tạo Blogspot

Blogspot là một dịch vụ được tạo miễn phí hàng đầu của Google. Nó được thừa hưởng rất nhiều ưu đãi mà không có dịch vụ miễn phí nào so sánh được. Bởi Blogspot đơn giản, dễ đăng ký, chỉnh sửa, thân thiện với mọi quốc gia, cho phép tùy biến nhiều có lợi cho SEO




Bạn có thể làm chỉ một blogspot của riêng bạn. Bạn có thể chia sẻ những thủ thuật, câu chuyện, hoặc có thể kiếm thêm thu nhập từ dịch vụ mang lại của blogspot. Tạo cho bạn 1 trang mang đậm chất cá nhân của các bạn.

Các bước để tạo 1 blogspot:
Để tạo blogspot bạn cần có 1 địa chỉ gmail.


Sau khi có một tài khoản gmail, bạn truy cập vào: http://blogger.com hoặc http://blogspot.com


- Bạn click vào " Tiếp tục với blogger"



Bạn click vào nút Blog mới để tạo.
- Sau đó sẽ hiện ra bảng sau cho bạn. Ở đây bạn điền đầy đủ thông tin
    + Tiêu đề: Ten cua ban...hoặc blogcuatui chẳng hạn/.
    + Địa chỉ: Bạn có thể điền tên của mình, mặc đinh sẽ như thế này tencuaban.blogspot.com 
    + Còn ô ở dưới chứa những giao diện có sẵn bạn có thể chọn lấy cho mình một cái.




Sau khi điền đầy đủ thông tin và giao diện, bạn nhấn nút Tạo Blog để được tạo và sẽ chuyển sang một trang mới như sau:

Trên là trang quảng lý của Blog ở trong trang này gồm có các chức năng như sau:

Tổng quan : Phần hiển thị số lượt xem bài viết trên blog của bạn
Bài đăng: Phần quản trị các bài đăng mà bạn đăng (như thêm,sửa ,xóa, hoàn nguyên về bản nháp )
Trang : Là phần quản lý các trang trên blog của bạn
Nhận xét: Phần quản trị các nhận xét trên blog của bạn
Google + : Phần bạn bật tắt chức năng chia sẻ bài viết trên trang G+  của bạn
Thống kê: là phẩn quản lý chi tiết về các lượt truy cập trên blog của bạn
Bố Cục: Là phần chỉnh sửa bố cục blog (thêm, xóa,sửa các tiện ích trên blogspot)
Mẫu: Phần chỉnh sửa sao lưu, tải code blog của bạn (Phần này à phần liên quan đến việc bạn thay đổi giao diện blog)
Cài đặt: Là phần thay đổi 1 số chức năng như: Tiêu đề blog, môt tả blog,quản lý site map,ngôn ngữ, sao lưu dữ liệu ,xóa blog .....

Quá trình tạo 1 blog đơn giản đúng không các bạn. Dịch vụ miễn phí ưu việt của google mang lại cho người dùng quá tuyệt vời. 

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