Favicon là biểu tượng nhỏ của website hiển thị ở trên thanh địa chỉ của trình duyệt. Favicon giúp khách viếng thăm website dễ nhận diện và phân biệt website này với các website khác.
Đối với Blogger, mặc định favicon là biểu tượng chữ B. Có khá nhiều hướng dẫn làm thay đổi favicon cho Blogger. Tôi cũng có thử làm theo, nhưng lúc được, lúc không. Hôm trước trong lúc dọn dẹp lại đống header của template thì phát hiện ra cách làm mới nên chia sẻ cùng các bạn.
Blogger tự chèn favicon thông qua dòng code sau trong file template:
Như đã nói ở bài trước, dòng code này sẽ chèn nhiều thứ vào phần head của blog như link feed, openid, 1 vài script và tất nhiên gồm cả favicon:
Cách đơn giản nhất để thêm favicon vào Blogger là tìm và loại bỏ dòng trên trong template, sau đó thêm dòng sau vào trước thẻ </head> trong template:
trong đó file favicon có thể có định dạng *.ico hoặc *.png.
Tất nhiên bạn có thể lo lắng rằng loại bỏ dòng include header của Blogger có thể sẽ dẫn đến những lỗi tiềm tàng. Để khắc phục điều đó, chúng ta tự chèn tay 1 số dòng quan trọng bao gồm: link feed, link openid, link canonical và thẻ meta content-type là đủ. Những thứ khác (như bạn thấy ở trên) có thể bỏ qua mà không ảnh hưởng gì:
Đối với Blogger, mặc định favicon là biểu tượng chữ B. Có khá nhiều hướng dẫn làm thay đổi favicon cho Blogger. Tôi cũng có thử làm theo, nhưng lúc được, lúc không. Hôm trước trong lúc dọn dẹp lại đống header của template thì phát hiện ra cách làm mới nên chia sẻ cùng các bạn.
Blogger tự chèn favicon thông qua dòng code sau trong file template:
<b:include data='blog' name='all-head-content'/>
Như đã nói ở bài trước, dòng code này sẽ chèn nhiều thứ vào phần head của blog như link feed, openid, 1 vài script và tất nhiên gồm cả favicon:
<script type="text/javascript">(function() { var a=window;function e(b){this.t={};this.tick=function(c,h,d){d=d?d:(new Date).getTime();this.t[c]=[d,h]};this.tick("start",null,b)}var f=new e;a.jstiming={Timer:e,load:f};try{a.jstiming.pt=a.chrome&&a.chrome.csi?Math.floor(a.chrome.csi().pageT):a.gtbExternal&&a.gtbExternal.pageT()||a.external&&a.external.pageT}catch(g){};a.tickAboveFold=function(b){b=b;var c=0;if(b.offsetParent){do c+=b.offsetTop;while(b=b.offsetParent)}b=c;b<=750&&a.jstiming.load.tick("aft")};var i=false;function j(){if(!i){i=true;a.jstiming.load.tick("firstScrollTime")}}a.addEventListener?a.addEventListener("scroll",j,false):a.attachEvent("onscroll",j); })();</script>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<meta content='true' name='MSSmartTagsPreventParsing'/>
<meta content='blogger' name='generator'/>
<link href='http://www.blogger.com/favicon.ico' rel='icon' type='image/vnd.microsoft.icon'/>
<link href='http://rilwis.blogspot.com/' rel='canonical'/>
<link rel="alternate" type="application/atom+xml" title="Rilwis's Blog - Atom" href="http://rilwis.blogspot.com/feeds/posts/default" />
<link rel="alternate" type="application/rss+xml" title="Rilwis's Blog - RSS" href="http://rilwis.blogspot.com/feeds/posts/default?alt=rss" />
<link rel="service.post" type="application/atom+xml" title="Rilwis's Blog - Atom" href="http://www.blogger.com/feeds/3270503718766096751/posts/default" />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://www.blogger.com/rsd.g?blogID=3270503718766096751" />
<link rel="openid.server" href="http://www.blogger.com/openid-server.g" />
<!--[if IE]> <script> (function() { var html5 = ("abbr,article,aside,audio,canvas,datalist,details," + "figure,footer,header,hgroup,mark,menu,meter,nav,output," + "progress,section,time,video").split(','); for (var i = 0; i < html5.length; i++) { document.createElement(html5[i]); } })(); </script> <![endif]-->Cách đơn giản nhất để thêm favicon vào Blogger là tìm và loại bỏ dòng trên trong template, sau đó thêm dòng sau vào trước thẻ </head> trong template:
<link href='url tới file favicon' rel='shortcut icon' type='image/x-icon'/>
trong đó file favicon có thể có định dạng *.ico hoặc *.png.
Tất nhiên bạn có thể lo lắng rằng loại bỏ dòng include header của Blogger có thể sẽ dẫn đến những lỗi tiềm tàng. Để khắc phục điều đó, chúng ta tự chèn tay 1 số dòng quan trọng bao gồm: link feed, link openid, link canonical và thẻ meta content-type là đủ. Những thứ khác (như bạn thấy ở trên) có thể bỏ qua mà không ảnh hưởng gì:
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link rel="alternate" type="application/rss+xml" title="Tiêu đề Blog" href="http://tên_blog.blogspot.com/feeds/posts/default?alt=rss" />
<link rel="openid.server" href="http://www.blogger.com/openid-server.g" />
<link rel='canonical' expr:href='data:blog.url'/>
<link href='url tới file favicon' rel='shortcut icon' type='image/x-icon'/>
