Showing posts with label Blogspot. Show all posts
Showing posts with label Blogspot. Show all posts
Tuesday, May 16, 2017

Cách chuyển hướng trang 404 - tips blogspot 2017


Một này đẹp trời bạn vào google master tool check thấy trang web của mình có quá nhiều link bi xóa (lỗi 404), khiến bạn không thể gõ hết những link  đó vao file robot.txt, bạn đang tìm cách ư? vẫn chưa ra hiểu được suy nghi đó hôm nay mình sẽ bày một cách chuyển hướng trang 404 logspot về trang chủ hay về trang bất kỳ chỉ cần vài dòng code đơn giản




Lỗi 404 do đâu ? làm thế nào để chuyển hướng trang 404


Lỗi 404 là vấn đề mà bất cứ website nào cũng có thể có, nguyên nhân sinh 404 có khá nhiều, như Bạn thay đổi cấu trúc link trang web cũ hay vì khi mình xóa một bài viết nào đó thì dẫn đến link đó sẽ trở thành trang 404. Và lúc này ta cần redirect link đó bằng tay qua trang trang chủ hay site nào…

Cách chuyển hướng trang 404 như sau:


Cài đặt =>Tùy chọn tìm kiêm => có mục Lỗi và chuyển hướng => Không tìm thấy trang tùy chỉnh => Chỉnh sửa
Nếu bạng muốn chuyển hướng 404 về trang chủ thì copy code:

<script type = "text/javascript"> BSPNF_redirect = setTimeout(function() { location.pathname= "/" }, 2000); </script>

Chuyển hướng 404 về một trang bất kỳ thì bạn bê nguyên doạn code này, thay đổi dòng màu đỏ bằng trang mà bạn muốn nhe

<div id="te-container"> <script type='text/javascript'> //<![CDATA[ document.write('<\/SCR'+'IPT>'); //]]> </script> </div> <script type='text/javascript'> //<![CDATA[ if (document.getElementById("te-container").clientHeight < 11 || document.getElementById("te-container").style.position == "absolue") {window.location = "http://www.thuthuatseotop12h.com/";} //]]> </script>

Xong bấm Lưu thay đổi

Có thể test 404 trang này coi, nó rất tuyệt vời

Đây là một blogspot tips rất hữu ích, hãy làm ngay còn nóng hổi

Chúc các bạn thực hành tốt nhé
Saturday, May 13, 2017

Cách làm hộp đăng ký Email tích hợp mạng xã hội chi tiết

Chào các bạn tiếp chủ đề thủ thuật blogspot, hôm nay mình sẽ code cho các bạn tham khảo Đăng ký mail theo dõi có tích hợp Facebook và Twiter, chủ đề này cũng có khá nhiều bạn tìm kiếm vậy chúng ta cũng nhau tìm hiểu nhé

Trước khi vào vấn để chính chúng ta cần biết tại sao lại phải tích hợp mạng xã hội vào hộp Đăng kỹ email theo dõi.




Thứ nhất: Tăng lượng Follow trên trang web của cả các bạn

Thứ hai: Tăng lương Follow cũng như sự tương tác của người dùng đối với các Fanpage của mình

Từ đó chúng ta sẽ có lợi về 2 mặt:

Traffic về website

Lượng theo dõi trên các trang trên mạng xã hội của bạn

Lợi nhuận trong kinh doanh

Cách làm hộp đăng ký Email có tích hợp mạng xã hội


Đầu tiên Đăng nhập vào Bloger→ Chủ để → Chỉnh sửa HTML. Nhấn Ctrl. + F và tìm mã <data: post.body /> trong mẫu của bạn và dán mã dưới đây ngay dưới <data: post.body />.
<section class="newsletter"><h2>Tại sao bạn nên đăng ký theo dõi ?</h2><div id="form-newsletter"><div class="social facebook"><a href="https://www.facebook.com/thetvplus" target="_blank">      <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKNtL4oBuYcehGpj_e0desrxw_SVS6KarEswrgMQNuPidTHl93rQ72vPTmrD7i-VluQ4MNr92rpBw3jG_CIn6obUc66qupYh4F2eiwzCAKBlZdvFNYndiwSwjO1s0jiCUuCE_9xv0DVdTR/s1600/nl-facebook@2x.png" />    </a>    <iframe allowtransparency="true" class="social-box fb-like" frameborder="0" scrolling="no" src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2thetvplus/&amp;width=90&amp;height=21&amp;colorscheme=light&amp;layout=button_count&amp;action=like&amp;show_faces=false&amp;send=false&amp;appId=519648428126767&amp;locale=en_US" style="border: none; height: 21px; overflow: hidden; width: 90px;">    </iframe>  </div><div class="social twitter"><a href="https://twitter.com/thinhtk41" target="_blank">      <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3YIKmiFGoUVCxZHTOTdePpL-dQJJKL5-ByOQjEkbdyDIKjkGKNLAp90wQaUyCOriq3TGwoJwQ2ZuMH6FdjcBHoBWbCjR0APwSNUXYLoJeGsLbSZNyyMlionOXYjbRWoYOHNniR9LhHm70/s1600/nl-twitter@2x.png" />    </a>    <iframe allowtransparency="true" class="social-box twitter-follow-button twitter-follow-button" data-twttr-rendered="true" frameborder="0" id="twitter-widget-0" scrolling="no" src="http://platform.twitter.com/widgets/follow_button.1399599786.html#_=1399785529920&amp;id=twitter-widget-0&amp;lang=en&amp;screen_name=thinhtk41&amp;show_count=false&amp;show_screen_name=false&amp;size=m" style="height: 20px; width: 60px;" title="Twitter Follow Button">    </iframe>    <script>      !function(d,s,id){        var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?&#39;http&#39;:&#39;https&#39;;        if(!d.getElementById(id)){          js=d.createElement(s);          js.id=id;          js.src=p+&#39;://platform.twitter.com/widgets.js&#39;;fjs.parentNode.insertBefore(js,fjs);}}(document, &#39;script&#39;, &#39;twitter-wjs&#39;);    </script>  </div><div class="newsletter-form"><fieldset><h2>       Đăng ký mail để nhận tất cả bài viết hay.      </h2><div class="fields"><form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=DemoByCandythinh', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input class="email" id="email" name="email" onblur="ifundefinedthis.value=='')this.value=this.defaultValue;" onfocus="ifundefinedthis.value==this.defaultValue)this.value='';" type="text" value="Nhập email của bạn vào đây.." />          <input name="uri" type="hidden" value="DemoByCandythinh" />          <input name="loc" type="hidden" value="en_US" />          <input class="subscribe" name="commit" type="submit" value="Đăng ký" />        </form></div></fieldset></div></div></section><style>.newsletter{text-align:center;margin:20px 0;}.newsletter .social.facebook{background:none repeat scroll 0 0 #3661A0}.newsletter .social{padding-top:20%;width:20%;float:left;position:relative}.newsletter #form-newsletter{display:block;width:90%;max-width:500px;min-width:400px;margin:0 auto}.newsletter:before,.newsletter:after{content:&quot; &quot;;display:table}.newsletter:after{clear:both}.newsletter h2{color:#3B434D;font-family:Open Sans,sans-serif;font-size:1.5em;font-weight:300;width:65%;margin:1em auto}.newsletter .social.twitter{background:none repeat scroll 0 0 #00ACED}.newsletter .social a{display:block;left:30%;position:absolute;top:20%;width:40%}.newsletter .social a img{max-width:100%;width:100%;transition: transform 0.3s ease-out 0s}.newsletter .social a:hover img{transform:scale(1.1)}.newsletter .social .social-box{bottom:20px;left:50%;position:absolute}.newsletter .social .social-box.fb-like{margin-left:-45px}.newsletter .social .social-box.twitter-follow-button{margin-left:-30px}.newsletter .newsletter-form{background:none repeat scroll 0 0 #1E293B;float:left;padding-top:20%;position:relative;width:60%}.newsletter .newsletter-form fieldset{height:38px;left:10%;position:absolute;top:10%;width:80%;border:none}.newsletter .newsletter-form fieldset h2{color:#FFF;font-family:Open Sans, sans-serif;font-weight:300;width:100%;margin:0 0 1.5625em;font-size:16px;}.newsletter .newsletter-form fieldset .fields{position:relative}.fields .email{border-radius:10px 0 0 10px;outline:0 none;width:84%;border:0;left:0;position:absolute;padding:10.5px}.fields .subscribe{background:none repeat scroll 0 0 #F0553B;border:medium none;border-radius:0 10px 10px 0;color:#FFF;right:0;position:absolute;padding:10.5px;transition:all ease 0.6s;}.fields .subscribe:hover {background: none repeat scroll 0 0 #161616;}</style><script type="text/JavaScript">fontsize = function () {    var abtSubs = $(".newsletter #form-newsletter").width() * 0.025; // 10% of container width    $(".newsletter .newsletter-form fieldset h2").css('font-size', abtSubs);};$(window).resize(fontsize);$(document).ready(fontsize);</script>
Friday, May 12, 2017

Template bán hàng blogger responsive miến phí 2017

Bạn đang tìm template bán hàng bloger, bạn đã tìm nhiều trang web, mỏi cả mắt mà không thấy, vậy thì hôm nay mình xin giới thiêu chó các bạn 3 theme blogspot để làm trang bán hàng trực tuyến đẹp và quan trọng là free, có giao diện Responsive 


Template blospot bán hàng đẹp nhất 2017

1. BlogrStore




Mẫu blogger này hoàn toàn phù hợp với trang web thương mại điện tử. Chủ đề này có các tính năng tuyệt vời như thanh bên phải cột 2 cột, trang chủ cột 3 cột, hóa đơn qua email, tùy chọn thêm vào giỏ hàng, ba cột cột và thanh trượt.



2. Betacommerce



Betacommerce là một mẫu Thương mại Điện tử mà làm cho một trang web mua sắm trực tuyến thiết kế bằng blogger,  nhanh chóng và dễ dàng thiết lập. Nó có nhiều tùy chọn để tùy biến, tùy chọn quản trị viên, phù hợp cho nhưng ai thích mua sắm trực tuyến.



3. Mega Shop



Mega shop là một mẫu blogger tuyệt vời, đẹp dễ nhìn và hiện đại hóa thương mại điện tử. Nó rất tiện lợi cho cửa hàng thời trang trực tuyến, cửa hiệu, cửa hàng quần áo hoặc cửa hàng thư. Mẫu này là hoàn hảo cho những ai muỗn có web bán hàng

Cách tăng tốc độ tải trang web bằng DNS Prefetch hiệu quả



Prefetch DNS là một cách để giải quyết DNS của một domain cụ thể. Đôi khi chúng ta sử dụng hình ảnh, file js, css từ bên ngoài liên kết với trang web của mình và nó ảnh hưởng đến quáy trình hay thời gian tải trang web điều này gây ra ức chế cho người dùng. Vậy làm thế nào để khác phục vấn đề này hãy cùng tôi tham khảo bài viết dười đây

Cách tăng tốc độ tải trang web bằng DNS Prefetch hiệu quả


Như ở bài trước tôi đã hướng dẫn các bạn tối ưu file javascript để tăng tốc độ website, hôm nay tôi sẽ tiếp tục chỉ cho các bạn cách sử dụng Prefetch DNS để tăng tốc độ load cho bloger, chúng ta có thể làm giảm thời gian tải liên kết từ bên ngoài, cũng như cải thiện tình hình website chậm như rùa. Trong hướng dẫn này, chúng ta sẽ tìm hiểu cách thêm DNS Prefetch vào trang blogger dể tăng tốc độ trang web của mình. 

Làm thế nào để Thêm dns-prefetch vào Blogger


Bước 1: Đăng nhập vào tài khoản blogger của bạn

Bước 2: Chuyển đến Chủ đề> Chỉnh sửa HTML

Bước 3: Nhấn CTRL + F từ bàn phím tìm kiếm theo và dán đoạn mã dưới đây bên trong thẻ <head>

1. < Link href = ' //1.bp.blogspot.com ' rel = ' dns-prefetch ' />
2. < link href = ' //28.2bp.blogspot.com ' rel = ' dns-prefetch ' />
3. < link href = ' //3.bp.blogspot.com ' rel = ' dns-prefetch ' />
4. < link href = ' //4.bp.blogspot.com ' rel = 'Dns-prefetch ' />
5. < link href = ' //2.bp.blogspot.com ' rel = ' dns-prefetch ' /> /* Bỏ cũng được*/
6. < link href = ' //www.blogger.com ' rel = ' dns-prefetch ' />
7. < Link href = ' //maxcdn.bootstrapcdn.com ' rel = ' dns-prefetch ' />
8. < link href = ' //fonts.googleapis.com ' rel = ' dns-prefetch ' />
9. < link href = ' //use.fontawesome.com ' rel = ' dns-prefetch ' />
10. < link href = ' //ajax.googleapis.com ' rel = ' dns -prefetch ' />
11. < link href = ' //resources.blogblog.com ' rel = ' dns-prefetch '/> /* Bỏ cũng được*/
12. < Link href = ' //www.facebook.com ' rel = ' dns-prefetch ' />
13. < link href = ' //plus.google.com ' rel = ' dns-prefetch ' />
14. < link href = ' //twitter.com ' rel = ' dns-prefetch ' />
15. < link href = ' //www.youtube.com ' rel = ' dns-prefetch ' />
16. < link href = ' //feedburner.google.com ' rel = ' dns-prefetch ' />
17. < link href = ' //www.pinterest.com ' rel = ' dns -prefetch ' />
18. < link href = ' //www.linkedin.com ' rel = ' dns-prefetch ' />
19. < Link href = ' //feeds.feedburner.com ' rel = ' dns-prefetch ' />
20. < link href = ' //github.com ' rel = ' dns-prefetch ' />
21. < link href = ' // player .vimeo.com ' rel = ' dns-prefetch ' />
22. < link href = ' //platform.twitter.com ' Rel = ' dns-prefetch ' />
23. < link href = ' //apis.google.com ' rel = ' dns-prefetch ' />
24. < link href = ' //connect.facebook.net ' rel = ' dns-prefetch ' />
25. < Link href = ' //cdnjs.cloudflare.com ' rel = ' dns-prefetch ' />
26. <Link href = ' //www.google-analytics.com ' rel = ' dns-prefetch ' />
27. < link href = ' //pagead2.googlesyndication.com ' rel = ' dns-prefetch ' />
28. < link href = '' //googleads.g.doubleclick.net ' rel = ' dns-prefetch ' />
29. < link href = ' //www.gstatic.Com ' rel = ' preconnect ' />
30. < link href = ' //www.googletagservices.com ' rel = ' dns-prefetch ' />
31. < link href = ' //static.xx.fbcdn.net ' rel = ' dns -prefetch ' />
32. < link href = ' //tpc.googlesyndication.com ' rel = ' dns-prefetch '/>
33. < Link href = ' //syndication.twitter.com ' rel = ' dns-prefetch ' />


Bấm lưu mẫu và hưởng thụ kết quả bạn sẽ tháy trang web minh nhanh hơn. Chúc các bạn thành công




Thursday, May 11, 2017

Code tiện ích bài đăng phổ biến trong bloger đẹp chi tiết



Bạn muốn hiển thị bài đăng phổ biến trên widget blogspot ấn tương, nhưng bạn không biết code cho nó như thế nào vậy thì hôm nay tôi sẽ hướng dẫn các bạn viết code cho phần bài đang phổ biến đẹp mắt nhé


Làm thế nào để Thêm Widgets Bài viết Phổ biến: 


Đầu tiên bạn Đăng nhập vào tài khoản blogger của bạn rồi chuyển đến Giao diện => Thêm tiện ích =>  Bài đăng phổ biến

Đặt tiện ích bài đăng phổ biến như bên dưới hình ảnh




Tiếp theo bạn vào Chủ đề => Chỉnh sửa HTML => Ctrl + f tìm </head> thế này này nhé



Copy và dán đoạn CSS dưới đây vào đằng sau the </head>

<style type="text/css">
/************************ Name= Popular Posts* Credit = MD Jillur Rahman* Website = www.codiblog.com* License = Attribution CC BY***********************/ .PopularPosts .item-thumbnail {
margin-bottom: 0;
-webkit-box-shadow: 0 0 9px rgba(0,0,0,0.4) inset;
-moz-box-shadow: 0 0 9px rgba(0,0,0,0.4) inset;
box-shadow: 0 0 9px rgba(0,0,0,0.4) inset;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
margin-right: 10px;
} .PopularPosts ul li img {
height: 50px;
padding-right: 0;
width: 50px;
background: #333;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
} .PopularPosts .widget-content ul li {
background: #00aeef;
} .PopularPosts .widget-content ul li+li {
margin: 0 10px 0 0;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
transition: all 0.4s ease;
} .PopularPosts .widget-content ul li+li+li {
margin: 0 20px 0 0;
} .PopularPosts .widget-content ul li+li+li+li {
margin: 0 30px 0 0;
} .PopularPosts .widget-content ul li+li+li+li+li {
margin: 0 40px 0 0;
} .PopularPosts .widget-content ul li:hover {
-webkit-opacity: 0.8;
-moz-opacity: 0.8;
opacity: 0.8;
} .PopularPosts .widget-content ul li:nth-child(2n+1) {
background: #222;
} .PopularPosts ul li a {
color: #fff;
font-family: Arial,serif;
font-size: 15px;
font-weight: 500;
line-height: 20px;
padding: 12px;
display: block;
}
</style>
Saturday, May 6, 2017

Thủ thuật tối ưu blogspot để tăng tốc độ tải trang chi tiết


Chào anh em! Anh em đang làm website bằng bloger, và website của minh đang chậm dì ì ạch phải không nào? Có bao giờ tự đặt câu hỏi tại sao web load rất chậm, cách tối ưu website/blog để chạy mượt hơn, nhanh hơn vậy thì cùng làm mấy thủ thuật để cải thiện tộc độ web nhé

Blogpsot chỉ đơn giản chỉ là 1 file xml tạo nên toàn bộ trang vì thế nếu anh em không biết cách bố trí sắp xếp hợp lý trong đó thì tốc độ tải trang sẽ rất chậm làm cho blog của mình không thể vươn tới nổi trên công cụ google search.

Thủ thuật tối ưu blogspot để tăng tốc độ tải trang chi tiết


Để cải thiện tốc độ load trang có rất nhiều cách như


Tối ưu file javascript như bài trước minh đã hướng dẫn

Giới hạn số lượng bài viết hiển thỉ ở trang chủ

Sử dụng dấu ngắt nháy (Break Line) với Auto Readmore

Nén lại hình anh cần sử dụng cho blog

Giảm số lượng widget đang có

Đây là một số cách để tăng tốc độ tải trang tuy nhiên để thực hiện việc này bạn phải trả qua quá nhiều bước và mất thời gian. Vậy nên hôm này mình xin sẽ chia sẻ một chút kinh nghiệm giúp blog của anh em tăng tốc độ tải trang đáng kể nhé thủ thuật này cũng khá nhiều chia sẻ trên mạng nhưng phần lớn hơi khó hiểu. Và mình sẽ nói lại một cách đơn giản và dễ hiểu nhất và cách tăng tốc blogspot này nhé.

Như chúng ta đã ở phần Mẫu Chỉnh sửa HTML thì một template có cấu trúc cơ bản các phần như sau

<html>

<head>

<title></title

</head>

<body>

</body>

</html>

Và việc cơ bản để tối ưu tăng tốc độ tải trang cho blogspot theo cách của mình anh em chỉ cần chỉnh sửa lại đôi chút phần bố cục trên như sau

Thủ thuật tối ưu blogspot để tăng tốc độ tải trang chi tiết

Sau đó tiến hành lưu mẫu và kiểm tra thì anh em sẽ cảm thấy tốc độ tải trang blogspot tăng đáng kể rồi phải không nào. Có nhiều mẫu theme thích hợp cho việc này nhưng cúng có khá nhiều mẫu bị lỗi ở phần bài đăng phổ biến thì anh em thêm đoạn code sau trên thẻ </head> nhé


<link type='text/css' rel='stylesheet' href='https://www.blogger.com/static/v1/widgets/1280358568-widget_css_bundle.css' />


Chúc các anh em thành công tăng tốc cho blogspot của mình và đưa website của mình lên một tốc độ chóng mặt nhé.

Cách tối ưu đoạn javasript hay file js cho blogspot


Cách tối ưu hóa javasript để tăng tốc cho blogspot. Là một vẫn đề anh em phải quản tâm bởi nó sẽ giúp website của chúng ta load nhanh quan trong hơn cả là được google đánh giá cao, điều này rất thuận lợi trong seo từ khóa lên top.


Trên mạng có vô số bài viết về tối ưu javascrip, file js để tang tốc độ website. Tuy nhiên phần lớn là nói chung chung khiến một số anh em không hiêu mấy. Vậy nên hôm nay mình rảnh rỗi và chia sẻ ít kinh nghiệm tối ưu file js trong websit nhất là với blogspot cho anh em tham khảo

Cách ối ưu đoạn javasript hay file js cho blogspot

Cách tối ưu đoạn javasript hay file js cho blogspot

Cách 1 : Áp dụng ki thuật async


Khi các anh em áp dụng kĩ thuật async, trình duyệt sẽ không ưu tiên load JS trước, mà chỉ load Javascript sau khi quá trình load HTML hoàn tất.

<script src='//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js'/>

Thay vào đó hãy áp dụng kĩ thuật async vào đoạn JS như thế này nè

<script async='async' src='//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js' type='text/javascript'/>

Xem Thêm : Tối ưu tăng tốc độ tải trang cho blogspot


Cách 2 : hãy sử dụng đoạn Script để trì hoãn quá trình tải Javasript



Ngoài 2 Cách trên thì các anh em có thể sử dụng các công cụ để nén file JavaSript online như :

jscompress.com

javascript-compressor.com


Cập Nhật : Trong trường hợp nếu cách 2 sảy ra lỗi load JS thì anh em có thể sử dụng đoạn Script như sau




Trên đây là cách tối ưu file javascript để blogspot/website tải nhanh hơn cho anh em tham khảo. Chúc các bạn có một website chạy mượt mà.

Nếu thấy bài viết bổ ích xin vui lòng chia sẻ nhé,