Cách Thiết Lập Favicon và Biểu Tượng Webclip Của Bạn

Tóm tắt nhanh / Tổng quan

Favicon và biểu tượng chạm giúp cá nhân hóa giao diện website của bạn trên tab trình duyệt, dấu trang và màn hình chính của điện thoại. Với Nilead, tải lên và kích hoạt các biểu tượng này chỉ mất vài thao tác. Hướng dẫn này sẽ giúp bạn chuẩn bị hình ảnh và cập nhật các cài đặt website.

Yêu cầu trước khi bắt đầu

• Một tập tin PNG hoặc ICO 32×32 cho favicon

• Một hình ảnh PNG 192×192 cho Webclip hoặc biểu tượng chạm

• Truy cập vào trang quản trị Nilead

• Quyền thay đổi cài đặt website toàn hệ thống

Hướng dẫn chi tiết

Bước 1: Chuẩn bị các tập tin biểu tượng

Trước khi tải lên, hãy đảm bảo hình ảnh của bạn đáp ứng các yêu cầu sau:

💡 Mẹo: Nên dùng nền trong suốt và thiết kế đơn giản để đảm bảo hiển thị rõ nét ở kích thước nhỏ.

Bước 2: Mở bảng Cấu hình Tổng quan

1. Đăng nhập vào trang quản trị Nilead

2. Bấm vào Menu Nhanh (góc phải trên hoặc bằng phím tắt bên trái)

3. Nhập vào ô tìm kiếm: General Configuration

4. Nhấp vào Website Logo & Favicon

Bước 3: Tải lên các biểu tượng

1. Trong mục "Website Logo & Favicon":

   • Tải lên tập tin favicon 32×32 vào trường "Favicon"

   • Tải lên hình biểu tượng chạm 192×192 vào trường "Webclip Icon" hoặc "Mobile Icon" (nhãn có thể khác tùy phiên bản)

2. Bấm Lưu để lưu các thay đổi

Bước 4: Kiểm tra trên website thực tế

1. Mở trang web của bạn ở tab mới hoặc ở chế độ ẩn danh

2. Làm mới trình duyệt để bỏ qua cache

3. Kiểm tra:

   • Tab trình duyệt đã hiển thị favicon mới chưa

   • Khi lưu website vào màn hình chính điện thoại, đã dùng đúng biểu tượng chưa

⚠️ Lưu ý: Một số thay đổi có thể mất vài phút để hiển thị do bộ nhớ đệm của trình duyệt. Dùng Ctrl + F5 (Windows) hoặc ⌘ + Shift + R (Mac) để làm mới hoàn toàn.

Câu hỏi thường gặp

1. Nếu không tải biểu tượng Webclip thì sao?
Trả lời: Trên một số thiết bị di động (như iOS), website của bạn có thể hiển thị biểu tượng trắng hoặc chung chung khi lưu lên màn hình chính.

2. Tôi có thể tải lên biểu tượng SVG thay cho PNG không?
Có. Đối với favicon và icon chạm, định dạng PNG và ICO được hỗ trợ rộng rãi và khuyến nghị sử dụng. Tuy nhiên, favicon dạng SVG cũng đã được hỗ trợ ở nhiều trình duyệt hiện đại.

3. Tại sao favicon mới không hiển thị?
Trình duyệt của bạn có thể vẫn lưu cache icon cũ. Hãy làm mới trình duyệt (Ctrl + F5) hoặc xóa cache trang web.

4. Tôi có thể cài favicon cho 2 chế độ sáng và tối khác nhau không?
Hiện tính năng này chưa hỗ trợ trực tiếp, nhưng bạn có thể liên hệ bộ phận hỗ trợ Nilead để yêu cầu tùy biến.

5. Tôi có cần thêm các kích cỡ khác cho favicon.ico không?
Không bắt buộc. Một favicon 32x32 phù hợp với hầu hết trình duyệt hiện đại.