Car Reviews

Auto Show

Sự kiệnThông tinChi tiết
Vietnam Motor Show 20165/10 đến 9/10 tại I.C.E, 91 Trần Hưng Đạo, Hà Nội Tham gia
Vietnam International Motor Show 201626/10 đến 30/10 tại SECC, 799 Nguyễn Văn Linh, Sài Gòn Tham gia

Tuesday, September 25, 2012

Tạo favicon cho web, blog

cách đơn giản để thêm biểu tượng favicon trên tab trình duyệt khi xem trang chủ, trang nhãn và trang bài viết cho blogspot.

Chia sẻ:
http://namkna.blogspot.com/favicon.ico
Khi lướt web bạn thường thấy một icon nhỏ trước địa chỉ website trên thanh address của trình duyệt hoặc trước tiêu đề của trang trên mỗi tab. Đó chính là favicon. Favicon cũng xuất hiện trong Bookmarks. Bài viết dưới đây sẽ giới thiệu với các bạn một vài nét cơ bản về favicon và bạn có thể nhanh chóng tạo một cái cho blog của mình.

Kích cỡ của favicon
Favicon là một icon nhỏ có kích thước 16x16 pixels. Nó thường là một biểu tượng đặc trưng cho web, blog, giúp người truy cập có thể dễ dàng nhận biết.
Tạo favicon
Nếu bạn có thể sử dụng các chương trình đồ họa như Illustrator hay Photoshop thì việc tạo ra một favicon rất đơn giản. Nếu không chỉ cần chọn một bức hình phù hợp với tiêu chí của bạn, có kích cỡ vừa phải và sử dụng các chương trình tạo favicon có sẵn.  
Một số trang web giúp tạo favicon miễn phí
 - Các trang web này cho phép bạn tạo favicon dưới định dạng *.ico. Tuy nhiên không có nhiều trang web hỗ trợ upload định dạng ảnh này trừ khi bạn có host riêng.
Bạn có thể sử dụng favicon có định dạng PNG, GIF để thay thế.

Đưa favicon vào web, blog
Bạn copy đoạn code sau vào trong phần  <head>....</head> , cụ thể mình đặt nó ngay sau  ]]></b:skin>
<link href='favicon URL' rel='shortcut icon'/>
Thay favicon URL bằng đường link tới file favicon mà bạn đã upload, có thể sử dụng định dạng ICO. PNG, GIF.

Sau khi lưu thay đổi, bạn vào trang web để kiểm tra, nếu chưa thấy xuất hiện favicon bạn cần xóa cache và khởi động lại trình duyệt.
- IE: vào Tools, Delete browsing History, (Shortcut: Ctr+Shift+Del),
- Firefox: Tools, Clear recent History, (Shortcut: Ctr+Shift+Del).
- Chrome: Setting (Biểu tượng cái cờ lê), Clear browsing data, (Shortcut: Ctr+Shift+Del).

Đoạn code trên mình sử dụng trong Blogspot, nếu bạn dùng các dịch vụ khác và không thấy favicon hiển thị thì có thể thử một trong những đoạn code sau.
<link href='Favicon URL' rel='icon' type='image/x-icon'/>
Hoặc
<link href='Favicon URL' rel='icon' type='image/png'/>
Hoặc
<link href='Favicon URL' rel='icon' type='image/gif'/>
 Với Wordpress, tham khảo tại đây.
Chúc các bạn thành công!

9 nhận xét:

  1. thank
    mình cũng muon tao 1 favicon cho web minh
    nhung chua bit fai lam sao cho dep va phu hop voi site !!!!!!!
    http://www.fshop14.com

    ReplyDelete
  2. @fshop14 :) Bạn làm về bán hàng nên cũng khó thật nhỉ :P
    Chọn Favicom sao cho toát ra đwoc nội dung của trang cũng khó :P Chúc bạn xớm tìm ra

    ReplyDelete
  3. Bạn hãy tạo favicon cho web của bạn ?

    ReplyDelete
  4. Đã thử toàn bộ và không được :((

    ReplyDelete
    Replies
    1. Bạn chỉ cần vào BỐ CỤC và dán đoạn bấm chỉnh sửa ô FAVICON trên cùng bên trái rồi tải ảnh của bạn lên nữa là được nha.

      Delete
  5. cám ơn bạn rất nhiều về bài viết này, rất dễ hiểu và chính xác. Nhưng mình có 1 thắc mắc đó là tại sao có 1 số blog trước đây khi mình add hình vào favicon từ thể Layout thì thấy xuất hiện favicon trên address liền, nhưng lần này lại không xuât hiện ? để phải thêm câu lệnh của bạn thì favicon nó mới xuất hiện ?

    ReplyDelete
  6. cám ơn ad, nay có thể gắn favicon dạng hình động (gif) vào website rồi, ai quan tâm thì tham khảo thêm bài viết này => Cách tạo và gắn biểu tượng favicon và favicon động ( dạng gif favicon ) cho website

    ReplyDelete
  7. http://thuthuatchobolg000.blogspot.com

    ReplyDelete