Showing posts with label thu-thuat-blogger. Show all posts
Showing posts with label thu-thuat-blogger. Show all posts

Thursday, July 28, 2016

Hướng dẫn tạo Floating Social Bookmark trượt đẹp cho Blogspot

blogger , blogspot
Hướng dẫn tạo Floating Social Bookmark trượt đẹp cho Blogspot

Hôm nay Sơn Nguyễn sẽ hướng dẫn tạo Floating Social Bookmark trượt đẹp cho Blogspot của bạn. 

Bộ này sẽ bao gồm các nút: Facebook, Twitter, G+, Pinterest, YouTube .... đều là các trang mạng xã hội rất nổi tiếng hiện nay. 


Ngoài ra sẽ có thêm 1 liên kết RSS Feed giúp độc giả theo dõi các bài viết của bạn.


Cách tạo Floating Social Bookmark trượt đẹp cho Blogspot

Truy cập vào Blogger --> Đăng nhập --> Chọn Blogspot bạn cần thực hiện --> Vào phần quản trị của Blogspot đó 

Trong phần quản trị Blogspot --> Mẫu --> Chỉnh sửa HTML 

Trong phần code HTML, bấm Ctr+F tìm phần tử  ]]></b:skin>

Copy đoạn code bên dưới và paste vào sau thẻ ]]></b:skin>

social-buttons {
 position: fixed;
 top: 130px;
 width: 45px;
 z-index: 9999;
}
.button-left {
 left: 0;
}
.button-right {
 right: 0;
}
.social-buttons #twitter-btn .social-icon,
.social-buttons #facebook-btn .social-icon,
.social-buttons #google-btn .social-icon,
.social-buttons #rss-btn .social-icon,
.social-buttons #pinterest-btn .social-icon,
.social-buttons #youtube-btn .social-icon {
 background-color: #33353B;
 background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUGKN-5dWRQLgv6GcaESf0zJUTDsiZp-koZEcF32vQrHPcW43mKDuTbbCUyabUZfMyTZklB0zX23pnY23YhOg19nl3_vDS1Zx_EHsysCc0N6-cHQxTxSGIjT-CSCTrCNpA94HqKbHkahaS/s1600/mas-icons-namkna-blogspot-com.png);
}
.button-left #facebook-btn span {
 background-position: right 10px;
}
.button-left #twitter-btn span {
 background-position: right -35px;
}
.button-left #google-btn span {
 background-position: right -127px;
}
.button-left #rss-btn span {
 background-position: right -80px;
}
.button-left #pinterest-btn span {
 background-position: 11px -177px;
}
.button-left #youtube-btn span {
 background-position: 11px -223px;
}
.button-right #facebook-btn span {
 background-position: 12px 10px;
}
.button-right #twitter-btn span {
 background-position: 11px -35px;
}
.button-right #google-btn span {
 background-position: 10px -127px;
}
.button-right #rss-btn span {
 background-position: 11px -80px;
}
.button-right #pinterest-btn span {
 background-position: 11px -177px;
}
.button-right #youtube-btn span {
 background-position: 11px -223px;
}
.social-buttons #facebook-btn:hover .social-icon {
 background-color: #3B5998;
}
.social-buttons #twitter-btn:hover .social-icon {
 background-color: #62BDB2;
}
.social-buttons #google-btn:hover .social-icon {
 background-color: #DB4A39;
}
.social-buttons #rss-btn:hover .social-icon {
 background-color: #FF8B0F;
}
.social-buttons #pinterest-btn:hover .social-icon {
 background-color: #D43638;
}
.social-buttons #youtube-btn:hover .social-icon {
 background-color: #C4302B;
}
.social-buttons a:hover .social-text {
 display: block;
}
.button-left .social-icon {
 -moz-transition: background-color 0.4s ease-in 0s;
 -webkit-transition: background-color 0.4s ease-in 0s;
 background-repeat: no-repeat;
 display: block;
 float: left;
 height: 43px;
 margin-bottom: 2px;
 width: 43px;
}
.button-left .social-text {
 display: none;
 float: right;
 font-size: 1em;
 font-weight: bold;
 margin: 11px 40px 11px 0px;
 white-space: nowrap;
}
.button-right .social-icon {
 -moz-transition: background-color 0.4s ease-in 0s;
 -webkit-transition: background-color 0.4s ease-in 0s;
 background-repeat: no-repeat;
 display: block;
 float: right;
 height: 43px;
 margin-bottom: 2px;
 width: 43px;
}
.button-right .social-text {
 display: none;
 float: left;
 font-size: 80%;
 font-weight: bold;
 margin: 11px 0 11px 40px;
 white-space: nowrap;
}
.social-buttons .social-text {
 color: #FFFFFF;
}

Trong ô tìm kiếm (bấm Ctr+F) bạn tìm thẻ đóng </head> 

Copy đoạn code bên dưới và Paste vào trước thẻ </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js' type='text/javascript'/>
<script>
 $(window).load(function(){
 $(&#39;.social-buttons .social-icon&#39;).mouseenter(function(){
 $(this).stop();
 $(this).animate({width:&#39;160&#39;}, 500, &#39;easeOutBounce&#39;,function(){});

 });
 $(&#39;.social-buttons .social-icon&#39;).mouseleave(function(){
 $(this).stop();
 $(this).animate({width:&#39;43&#39;}, 500, &#39;easeOutBounce&#39;,function(){});
 });
 });
</script>

Lưu ý: nếu trang Blogspot của bạn đã có thư viện Jquery rồi thì hãy xóa dòng <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/> đi nhé ^^

Tiếp tục, trong ô tìm kiếm (bấm Ctr+F) bạn tìm thẻ đóng </body> 

Copy đoạn code bên dưới và Paste vào trước thẻ đóng </body>: 

<div class='social-buttons button-right hidden-phone hidden-tablet'><a class='itemsocial' href='https://www.facebook.com/nguyentruongson.org' id='facebook-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Facebook</span></span></a><a class='itemsocial' href='https://twitter.com/SonNguyen83' id='twitter-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Twitter</span></span></a><a class='itemsocial' href='https://plus.google.com/+NguyễnTrườngSơn' id='google-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Google</span></span></a><a class='itemsocial' href='http://pinterest.com/sontruongnguyen' id='pinterest-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Pinterest</span></span></a><a class='itemsocial' href='https://www.youtube.com/user/truongson83' id='youtube-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Youtube</span></span></a><a class='itemsocial' href='http://feeds.feedburner.com/nguyentruongson/SsQL' id='rss-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via RSS</span></span></a></div>

P/s: Thay các thông số màu vàng tương ứng phù hợp với bạn nhé
Bấm Lưu mẫu để hoàn tất

Các bạn tự chiêm ngưỡng thành quả của mình nhé ^^

Để xem thêm các thủ thuật Blogger bạn bấm vào "Blogger" trên thanh menu nhé!

P/s: các đoạn code trong bài viết này được sưu tầm trên mạng
Read more »
By às
Marcadores: , , , , , , , ,

Tuesday, May 31, 2016

Hướng dẫn tạo banner quảng cáo trượt dọc 2 bên website/Blogspot

blogger , blogspot
Hướng dẫn tạo banner quảng cáo trượt dọc 2 bên website/Blogspot

Hướng dẫn tạo banner quảng cáo trượt dọc 2 bên website/Blogspot

Giúp bạn quảng bá sản phẩm của mình đến người đọc trên trang Blogspot của mình


Khi bạn đã tự thiết kế website bằng Blogspot chuyên nghiệp rồi thì bạn cũng nên tạo những banner quảng cáo cho các sản phẩm mà bạn đang kinh doanh (hoặc bán quảng cáo cho các đối tác khác khi website/Blogspot của bạn có lượng truy cập nhất định).

Hôm nay Nguyễn Trường Sơn sẽ hướng dẫn các bạn cách tạo banner quảng cáo dọc 2 bên website/Blogspot của bạn.  Cũng đơn giản thôi, ko có gì phức tạp cả. Bạn chỉ cần thiết kế trước cho mình 2 hình ảnh banner quảng cáo cho 2 sản phẩm của bạn thôi, phần còn lại để Sơn Nguyễn lo :D

Đối với dạng quảng cáo bằng banner ở 2 bên Blogspot này sẽ có 2 dạng: 1 dạng banner quảng cáo đứng im 1 chỗ và 1 dạng banner quảng cáo trượt dọc 2 bên Blogspot khi kéo chuột. Sơn Nguyễn sẽ hướng dẫn bạn làm cả 2 dạng này luôn, còn bạn chọn dạng banner quảng cáo nào cho Blogspot của bạn thì tùy ở bạn.

Banner quảng cáo dọc 2 bên website/Blogspot


Hướng dẫn tạo banner quảng cáo 2 bên website/Blogspot - fix đứng im 1 chỗ


Đối với website: 
Bạn vào phần chỉnh sửa code và chỉ cần thêm phần code phía dưới lên trên thẻ đóng </body>

Đối với Blogspot
Bước 1: Đăng nhập vào Blog
Bước 2: Vào phần quản trị Blog ---> chọn Bố cục
Bước 3: Chọn Thêm tiện ích
Bước 4: Chọn HTML\Javascripts
Bước 5: Dán (paste) đoạn code bên dưới vào phần nội dung
Bước 6: bấm Lưu để hoàn tất
<div id="left_ads_float">
<a href="Link web 1" target="_blank"><img border="0" src="Link hình ảnh 1" width="120" /></a>
</div>
<div id="right_ads_float">
<a href="Link web 2" target="_blank"><img border="0" src=" Link hình ảnh 2" width="120" /></a>
</div>
<style>
#left_ads_float
{
top:10px;
left: 10px;
position:fixed; }
#right_ads_float
{
top:10px;
right: 10px;
position:fixed;
}
</style>
<script>
var vtlai_remove_fads=false;
function vtlai_check_adswidth()
{
if(vtlai_remove_fads)
{
document.getElementById('left_ads_float').style.display='none';
document.getElementById('right_ads_float').style.display='none';
return;
}else if(document.cookie.indexOf('vtlai_remove_float_ads')!=-1)
{
vtlai_remove_fads=true;
vtlai_check_adswidth();
return;
}
else
{
var lwidth=parseInt(document.body.clientWidth);
if(lwidth<1110)
{
document.getElementById('left_ads_float').style.display='none';
document.getElementById('right_ads_float').style.display='none';
}
else
{
document.getElementById('left_ads_float').style.display='block';
document.getElementById('right_ads_float').style.display='block';
}
setTimeout('vtlai_check_adswidth()',10);
}
}
</script>


Hướng dẫn tạo banner quảng cáo trượt dọc 2 bên website/Blogspot 


 Dạng này là dạng 2 banner ở 2 bên website/Blogspot. Khi kéo chuột xuống thì 2 banner sẽ trượt theo (banner trượt rất êm, ko dựt dựt gây nhức mắt cho người đọc/khách hàng).

Cách thực hiện như sau

Đối với website: 
Bạn vào phần chỉnh sửa code và chỉ cần thêm phần code phía dưới lên trên thẻ đóng </body>

Đối với Blogspot
Bước 1: Đăng nhập vào Blog
Bước 2: Vào phần quản trị Blog ---> chọn Bố cục
Bước 3: Chọn Thêm tiện ích
Bước 4: Chọn HTML\Javascripts
Bước 5: Dán (paste) đoạn code bên dưới vào phần nội dung
Bước 6: bấm Lưu để hoàn tất

<div id="divAdRight" style="DISPLAY: none; POSITION: absolute; TOP: 0px">
<a href="Link web 1"><img src="Link hình ảnh 1" width="125" /></a>
</div>
<div id="divAdLeft" style="DISPLAY: none; POSITION: absolute; TOP: 0px">
<a href="Link web 2"><img src="Link hình ảnh 2" width="125" /></a>
</div>
<script>
function FloatTopDiv()
{
startLX = ((document.body.clientWidth -MainContentW)/2)-LeftBannerW-LeftAdjust , startLY = TopAdjust+80;
startRX = ((document.body.clientWidth -MainContentW)/2)+MainContentW+RightAdjust , startRY = TopAdjust+80;
var d = document;
function ml(id)
{
var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
el.sP=function(x,y){this.style.left=x + 'px';this.style.top=y + 'px';};
el.x = startRX;
el.y = startRY;
return el;
}
function m2(id)
{
var e2=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
e2.sP=function(x,y){this.style.left=x + 'px';this.style.top=y + 'px';};
e2.x = startLX;
e2.y = startLY;
return e2;
}
window.stayTopLeft=function()
{
if (document.documentElement && document.documentElement.scrollTop)
var pY = document.documentElement.scrollTop;
else if (document.body)
var pY = document.body.scrollTop;
if (document.body.scrollTop > 30){startLY = 3;startRY = 3;} else {startLY = TopAdjust;startRY = TopAdjust;};
ftlObj.y += (pY+startRY-ftlObj.y)/16;
ftlObj.sP(ftlObj.x, ftlObj.y);
ftlObj2.y += (pY+startLY-ftlObj2.y)/16;
ftlObj2.sP(ftlObj2.x, ftlObj2.y);
setTimeout("stayTopLeft()", 1);
}
ftlObj = ml("divAdRight");
//stayTopLeft();
ftlObj2 = m2("divAdLeft");
stayTopLeft();
}
function ShowAdDiv()
{
var objAdDivRight = document.getElementById("divAdRight");
var objAdDivLeft = document.getElementById("divAdLeft");
if (document.body.clientWidth < 1000)
{
objAdDivRight.style.display = "none";
objAdDivLeft.style.display = "none";
}
else
{
objAdDivRight.style.display = "block";
objAdDivLeft.style.display = "block";
FloatTopDiv();
}
}
</script>
<script>
document.write("<script type='text/javascript' language='javascript'>MainContentW = 1000;LeftBannerW = 125;RightBannerW = 125;LeftAdjust = 5;RightAdjust = 5;TopAdjust = 10;ShowAdDiv();window.onresize=ShowAdDiv;;<\/script>");

</script>

Chú ý: Phía cuối đoạn code có vài thông số bạn tham khảo thêm để chỉnh sữa cho phù hợp với website/blogspot của bạn
  • LeftBannerW = 125: độ rộng của banner bên trái
  • RightBannerW = 125: độ rộng của banner bên phải
  • LeftAdjust = 5: khoảng cách từ mép trái trang web đến banner
  • RightAdjust = 5: khoảng cách từ mép phải trang web đến banner
  • TopAdjust = 10: khoảng cách từ mép trên trang web đến banner
Như vậy Nguyễn Trường Sơn đã hướng dẫn cho bạn cách tạo banner quảng cáo trượt dọc 2 bên Blogspot rồi đấy. Hi vọng nó có ích đối với bạn.

Nếu bạn có câu hỏi nào thì hãy comment xuống phía dưới nhé

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

Để tìm các bài viết trên Google nhanh nhất, hãy tìm theo cú pháp: "từ khóa tìm kiếm + nguyentruongson.info"

 <<< Bài trước
Bài 9: Hướng dẫn gắn tên miền vào Blogspot đơn giản, nhanh gọn
Bài 10: Hướng dẫn khắc phục lỗi không hiển thị hình ảnh của Blogspot
Bài sau >>>

Read more »
By às
Marcadores: , , , , , , , ,

Sunday, May 29, 2016

Hướng dẫn khắc phục lỗi không hiển thị hình ảnh của Blogspot

blogger , blogspot
Hướng dẫn khắc phục lỗi không hiển thị hình ảnh của Blogspot

Hướng dẫn khắc phục lỗi không hiển thị hình ảnh của Blogspot

Giúp bài viết cảu bạn trông đẹp hơn trong mắt người đọc


Việc dùng Blogger ở Việt Nam là khá phổ biến. Nhưng trong 1 vài năm trở lại đây 1 số nhà mạng đã chặn Blogspot, đặc biệt là nhà mạng VNPT. Nguyên nhân là do mấy phần tử xấu/ phản động thường dùng Blogspot để xuyên tạc, kích động nói xấu chế độ nhà nước. Vì vậy các nhà mạng hầu như chặn tất cả những gì liên quan đến Blogspot. Tất cả các website có tên miền đuôi blogspot.com đều bị chặn hoàn toàn.

Đối với những Blogger đã được gắn tên miền riêng thì vẫn truy cập được, nhưng những hình ảnh trong bài viết Blogspot lại ko hiển thị. Điều này thật bất tiện cho người đọc/khách hàng truy cập vào blogspot của bạn, ảnh hưởng khá lớn đến việc bán hàng online của bạn. Vì vậy hôm nay Sơn Nguyễn sẽ chia sẻ 3 cách khắc phục lỗi không hiển thị hình ảnh của Blogspot do bị các nhà mạng chặn. Những cách này rất hữu hiệu với những Blogspot đã được gắn tên miền riêng.



3 cách khắc phục lỗi không hiển thị hình ảnh của Blogger

Cách 1: Chỉnh sửa thủ công
  • Sau khi Up hình ảnh vào bài viết Blogspot, link hình ảnh sẽ có dạng *.bp.blogspot.com. Khi đó bạn chỉ cần chuyển bài viết qua chế độ HTML và chỉnh sửa link đó thành lh4.googleusercontent.com hoặc lh4.ggpht.com

Cách 2: Chỉnh sửa tự động sử dụng Javascript
  • Với cách này bạn dùng 1 đoạn code ngắn để khắc phục lỗi ko hiển thị hình ảnh của Blogspot, nó sẽ tự động thay thế link hình ảnh trong Blogspot, bạn sẽ không cần ngồi sửa thủ công từng hình ảnh, từng bài.
  • Cách làm như sau:
  • Bạn truy cập vào Blogger.com --> tiến hành đăng nhập bằng tài khoản Gmail của bạn --> chọn trang Blogspot cần khắc phục lỗi ko hiển thị hình ảnh --> vào phần quản trị Blogspot --> Chọn Mẫu --> Chỉnh sửa HTML
  • Trong phần code, bạn bấm Ctr + F tìm thẻ đóng </body>. Sau đó bạn chèn đoạn code này vào trước thẻ  đóng </body> 
<script type='text/javascript'> //<![CDATA[ var images = document.getElementsByTagName("img"); for(var i=0;i<images.length;i++) { images[i].src = images[i].src.replace(/[0-9]+.bp.blogspot.com/,"lh4.googleusercontent.com"); } //]]> </script>
  • Bấm Lưu mẫu

Cách 3: Chỉnh sửa tự động sử dụng JQuery
  • Với cách này bạn cũng dùng 1 đoạn code ngắn để tự động khắc phục lỗi ko hiển thị hình ảnh của Blogspot. Bạn cũng tiến hành các bước như cách 2
  • Trong phần code bạn bấm Ctr + F tìm thẻ đóng </body>  --> Chèn đoạn code này vào trước thẻ </body> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type='text/javascript'>
//<![CDATA[
$("body img").each(function () {$(this).attr("src", $(this).attr("src").replace(//[0-9]+(.bp.blogspot)?/, "/lh4.googleusercontent")) });
//]]>
</script>
  • Bấm Lưu mẫu
Chú ý: Nếu Blogspot của bạn đã có thư viện JQuery thì hãy xóa dòng 
<script src=”http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js”></script>
(dòng đầu tiên trong đoạn code)

Nếu gặp vấn đề gì trong việc khắc phục lỗi ko hiển thị hình ảnh của Blogspot các bạn comment vào phía dưới nhé

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

Để xem thêm các thủ thuật Blogger bạn bấm vào "Blogger" trên thanh menu nhé!

Để tìm các bài viết trên Google nhanh nhất, hãy tìm theo cú pháp: "từ khóa tìm kiếm + nguyentruongson.info"
Read more »
By às
Marcadores: , , , , , , , ,

Friday, May 27, 2016

Hướng dẫn gắn tên miền vào Blogspot đơn giản, nhanh gọn

blogger , blogspot
Hướng dẫn gắn tên miền vào Blogspot đơn giản, nhanh gọn

Hướng dẫn gắn tên miền vào Blogspot 

Cách làm chi tiết, đơn giản, nhanh gọn



Sau khi đã thiết kế website chuẩn SEO bằng Blogspot thì việc gắn tên miền (domain) vào Blogspot là việc làm cần thiết, giúp cho webste của bạn trông giống website hơn :D, giúp bạn trở nên chuyên nghiệp hơn khi bán hàng online, khách hàng sẽ dễ nhớ đến website bạn hơn và sẽ dễ dàng truy cập vào hơn

Việc gắn tên miền vào Blogspot cũng rất đơn giản. Các bạn làm như sau





Video Hướng dẫn gắn Tên miền (Domain) vào Blogspot



  • Các bạn hãy bấm ĐĂNG KÝ (Subscribe) Kênh để ủng hộ và nhận được video mới nhất nhé
  • Link: https://youtu.be/MJwWVEjjisA

Các bước gắn tên miền riêng vào Blogspot


 Bước 1: gắn tên miền tùy chỉnh vào Blogspot/Blogger

Đầu tiên bạn truy cập vào blogger.com, tiến hành đăng nhập bằng tài khoản Gmail của bạn --> chọn trang Blogspot mà bạn muốn gắn tên miền vào --> truy cập vào Phần quản trị của Blogspot đó.

Trong phần quản trị blogspot, bạn vào phần Cài đặt ---> chọn mục Cơ bản ---> chọn Thiết lập URL của bên thứ 3 cho blog của bạn



Trong phần Địa chỉ Blog, bạn nhập tên miền bạn mua vào ô Cài đặt tên miền của bên thứ 3
(chú ý: phải có tiền tố "www." phía trước tên miền nhé) ---> bấm Lưu



Xuất hiện thông bâó lỗi: Chúng tôi đã không thể xác minh thẩm quyền của bạn cho miền này. Lỗi 32.
Vấn đề này ko sao cả, đơn giản vì ta chưa cài đặt cho tên miền trỏ về Blog nên Blogger chưa xác minh được chủ sở hữu của tên miền đó.

Chúng ta tiếp tục làm như sau:
Bạn chọn Hướng dẫn cài đặt ở phía dưới dòng thông báo lỗi,


Lập tức sẽ xuất hiện phần hướng dẫn của Google Cách sử dụng tên miền tùy chỉnh cho Blog của tôi?

Trong phần Bạn muốn lưu trữ Blog của mình ở đâu? bạn chọn Trên miền cao cấp nhất (www.example.com).


Sau khi bạn tick vào ô đã chọn, sẽ xuất hiện thêm phần hướng dẫn của Google, bạn chý ý 4 dãy số ở cuối phần 1 và hãy Copy chúng



Bước 2: Cài đặt CNAME cho Tên miền trỏ về trang blogspot

Khi bạn mua tên miền từ các công ty chuyên về dịch vụ mua bán tên miền, thanh toán cho họ xong thì bạn sẽ nhận được Email xác nhận giao dịch mua tên miền thành công và bên dịch vụ sẽ cung cấp tên đăng nhập, mật khẩu, đường link để bạn truy cập vào trang quản lý tên miền bạn đã mua.

Bạn truy cập vào đường link họ cung cấp, tiến hành đăng nhập bằng Tên đăng nhập và mật khẩu họ đã cung cấp. Trong trang Quản trị, bạn vào mục Sửa bản ghi --> chọn tên miền bạn đã mua và muốn trỏ về trang blogspot của bạn.

Bạn thêm 2 bản ghi CNAME đã có lúc thông báo lỗi "Chúng tôi đã không thể xác minh thẩm quyền của bạn cho tên miền này. Lỗi 32" --> bấm Lưu


Như vậy, bạn đã hoàn tất việc trỏ tên miền vào trang blogspot của bạn

Bước 3: Loại bỏ www

Sau khi bạn trỏ thành công tên miền về trang Blogspot của bạn thì việc truy cập vào website của bạn sẽ rất thuận tiện và rất dễ nhớ (vì ko còn đuôi blogspot.com nữa). Tuy nhiên, khi gõ tên miền trên trình duyệt nếu thiếu www thì bạn sẽ không truy cập được trang web của bạn. Muốn truy cập được thì bạn phải gõ đầy đủ theo cú pháp www.tenmien.com/net/info/org ....v...v... (tùy bạn mua tên miền "đuôi" gì :D).

Điều này thật bất tiện cho bạn và khách hàng của bạn truy cập website. Vì vậy ta phải loại bỏ www khi truy cập tên miền của bạn. 

Cách làm như sau:

Bạn dùng 4 dãy số đã Copy  trong phần "Hướng dẫn cài đặt" của Google và tạo thêm 4 bản ghi như hình



Xong bạn chờ khoảng 1-2 phút để nó phân giải tên miền.

Sau đó bạn quay lại quay lại trang Blogspot của bạn lúc bị thông báo lỗi, bấm Lưu và xem kết quả. 

Tiếp theo, bạn bấm chỉnh sửa --> tick vào ô "Chuyển hướng nguyentruongson.info đến www.nguyentruongson.info".

Bạn thay link tên miền của bạn vào cho phù hợp nhé


Bấm Lưu để hoàn tất .

Như vậy là đã bạn đã hoàn thành việc gắn tên miền vào Blogspot rồi đấy. Cũng rất đơn giản và nhanh gọn đúng ko nào. Bạn chờ khoảng 5 phút rồi truy cập lại vào website của bạn xem nhé ^^

Nếu có thắc mắc vấn đề gì các bạn cứ comment phía dưới nhé

Nếu bạn chưa có tên miền thì có thể tham khảo  để mua tên miền giá rẻ

Hoặc bấm vào "Khuyến mãi" hoặc "Domain" trên thanh menu để cập nhật các chương trình khuyến mãi tên miền  mới nhất,

Nếu bạn thấy bài viết này hữu ích, hãy SHARE cho bạn bè cùng xem nhé

Hãy SHARE vì nó MIỄN PHÍ!

Cho đi là còn mãi

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

Xem thêm:
Để tìm các bài viết trên Google nhanh nhất, hãy tìm theo cú pháp: "từ khóa tìm kiếm + nguyentruongson.info"

 << Bài trước
Bài 7: Hướng dẫn thay đổi giao diện/template cho blogspot
Bài 8: Hướng dẫn thiết kế website chuyên nghiệp với blogspot
Bài sau >>>

Read more »
By às
Marcadores: , , , , , , , , , ,

Tuesday, January 26, 2016

Hướng dẫn thiết kế website chuyên nghiệp với blogspot

blogger , blogspot
Hướng dẫn thiết kế website chuyên nghiệp với blogspot

Hướng dẫn thiết kế website chuyên nghiệp với Blogspot

Thực hành tạo Blogger nâng cao chuyên nghiệp hơn


Việc thiết kế website chuyên nghiệp với blogspot đã ko còn là vấn đề với các bạn nữa 
khi đã thực hành thành thạo đến bài này rồi ^^. Hôm nay sẽ là bài thực hành chi tiết thiết kế website chuyên nghiệp miễn phí với blogspot bằng cách thay đổi giao diên/template blogspot chuyên nghiệp hơn

 Bài hướng dẫn thiết kế website này chỉ dành cho những người đã thành thạo với blogspot/blogger vì liên quan đến chỉnh sửa code. Vì vậy, nếu bạn nào chưa thành thạo với blogspot thì vui lòng xem lại các bài trước nhé.

Muốn nhanh thì phải từ từ ^.^

Video Hướng dẫn thiết kế website chuyên nghiệp với blogspot



  • Link download Blogger Templates trong video tại đây
  • Các bạn hãy bấm ĐĂNG KÝ (Subscribe) Kênh để ủng hộ và nhận được video mới nhất nhé
  • Link: https://youtu.be/rEo8z3avOHo
Sau khi xem video hướng dẫn này xong  là bạn đã tự mình tạo Blogspot chuyên nghiệp rồi đấy. Việc tiếp theo là gắn tên miền cho Blogspot nữa là quá ok luôn, tránh trường hợp Blogger bị chặn bởi các nhà mạng ở Việt Nam

Nếu bạn chưa có tên miền thì có thể tham khảo cách mua tên miền giá rẻ , hoặc bấm vào "Khuyến mãi" hoặc "Domain" trên thanh menu.
Chúc các bạn thành công!

P/s: Nếu thấy nội dung blog này hữu ích thì bạn hãy SHARE và Bấm G+ ủng hộ mình nhé ^^

Để tìm các bài viết trên Google nhanh nhất, hãy tìm theo cú pháp: "từ khóa tìm kiếm + nguyentruongson.info"

 <<< Bài trước
Bài 6: Hướng dẫn chỉnh sửa tiêu đề (title) bài viết Blogspot chuẩn SEO
Bài 7: Hướng dẫn thay đổi giao diện/template cho blogspot
Bài sau >>>

Read more »
By às
Marcadores: , , , , , , ,

Thursday, December 17, 2015

Hướng dẫn chỉnh sửa tiêu đề (title) bài viết Blogspot chuẩn SEO

blogger , blogspot
Hướng dẫn chỉnh sửa tiêu đề (title) bài viết Blogspot chuẩn SEO
Sau khi bạn xuất bản bài viết ở Blogspot thì tiêu đề nó thường có dạng: Tiêu đề Blog: Tiêu đề bài viết

 Với Tiêu đề (title) như vậy nhìn ko được bắt mắt, và ko thuận tiện cho việc SEO (search engine optimization) bài viết blogspot của bạn lên Top Google. Cá biệt, với những Blogspot có Tiêu đề Blog dài thì gần như Tiêu đề bài viết sẽ ko có cơ hội hiển thị

Vậy nên bạn cần đưa tiêu đề bài viết lên trước theo dạng: Tiêu đề bài viết | Tiêu đề Blog



Các lỗi tiêu đề (title)bài viết Blogspot thường gặp


Khi chia sẽ bài viết lên Facebook hoặc các Group trên Facebook thì sẽ gặp lỗi Tiêu đề Blog: Tiêu đề bài viết trông ko được đẹp mắt


Nếu Tiêu đề Blog dài thì Tiêu đề bài viết sẽ ko có cơ hội để hiễn thị


Trên Google cũng vậy... 

Nếu khách hàng/người đọc lên Google search, và bài viết của mình hiễn thị trước mắt khách hàng, nhưng tiêu đề bài viết lại bị Tiêu đề Blog che mất thì sẽ giảm cơ hội được khách hàng chú ý và click vào

Vậy nên bạn cần chỉnh sửa lại cách hiễn thị tiêu đề bài viết của Blogspot, đưa tiêu đề bài viết lên trước theo dạng: Tiêu đề bài viết | Tiêu đề Blog

Hướng dẫn chỉnh sửa tiêu đề (title) bài viết Blogspot chuẩn SEO

Để chỉnh sửa lại tiêu đề bài viết Blogspot chuẩn SEO (Search Engine Optimization) ta làm như sau:

Bạn vào trang quản trị blog ---> Mẫu ---> Chỉnh sửa HTML

Bấm Ctrl F để tìm <title><data:blog.pageTitle/></title>


 Copy đoạn code bên dưới và paste (dán) đè lên đoạn tô màu vàng vừa tìm được:

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

Xong bấm Lưu mẫu để hoàn thành!

Sau đó, nhớ khai báo lại Blogspot của bạn với Google nhé ^^ (Copy đường link blog và Submit nó như đã hướng dẫn ở Bài 1).

Kết quả chỉnh sửa Tiêu đề bài viết blogspot chuẩn SEO

Sau khi đã chỉnh sửa thì Tiêu đề bài viết đã hiễn thị lên phía trước, ko còn bị che bởi Tiêu đề Blog nữa


Tiêu đề bài viết của blog đã ở dạng Tiêu đề bài viết | Tiêu đề Blog


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

Để tìm các bài viết trên Google nhanh nhất, hãy tìm theo cú pháp: "từ khóa tìm kiếm + nguyentruongson.info"

 <<< Bài trước
Bài 4: Hướng dẫn thay đổi nội dung chân trang Blogspot
Bài 5: Hướng dẫn cách thêm Fanpage vào Blogspot
Bài sau >>>

Read more »
By às
Marcadores: , , , , , , , ,