NỘI DUNG
Khắc phục lỗi favicon không hiển thị trên website WordPress: Hướng dẫn chi tiết
Favicon, biểu tượng nhỏ thường xuất hiện bên cạnh tiêu đề của trang web trên trình duyệt, không chỉ giúp người dùng dễ dàng nhận diện trang web của bạn mà còn góp phần tạo sự chuyên nghiệp cho nó. Tuy nhiên, nhiều quản trị viên WordPress gặp phải tình trạng favicon không hiển thị đúng cách, dù đã thực hiện đầy đủ các bước cài đặt.
Trong bài viết này, chúng tôi sẽ hướng dẫn bạn cách xác định và khắc phục lỗi favicon không hiển thị trên website WordPress của bạn.
Bước 1: Tạo đoạn mã và file favicon
Đầu tiên bạn hãy truy cập vào trang https://realfavicongenerator.net/ để tạo file và các thẻ quan trọng để chèn vào header.
Sau khi truy cập vào bạn chọn vào Select your Favicon image
Và chọn file đã có sẵn dưới máy tính của bạn lên.
Bạn tick vào dòng I cannot or I do not want to place favicon files at the root of my web site. Instead I will place them here:
Và nhập vào đường dẫn wp-content/uploads/favicon
như ảnh đính kèm bên dưới. Khi nhập xong chọn vào Generate your Favicons and HTML code
Sau khi tạo xong thì bạn click vào Favicon package để tải file zip chứa các favicon về. Đồng thời bạn copy lại các đoạn mã trong khung và lưu vào đâu đó để sử dụng ở các bước tiếp theo.
Bước 2: Tạo thư mục và Upload file lên
Ở Bước 1 khi tạo thì tôi có hướng dẫn bạn nhập vào wp-content/uploads/favicon
. Do đó trên hosting bạn hãy truy cập vào thư mục wp-content/uploads/
và tạo mới một thư mục đặt tên là favicon
như ảnh bên dưới.
Sau khi tạo xong, bạn hãy upload file zip đã tải ở Bước 1 lên và tiến hành giải nén file ra. Sau khi giải nén thì bạn sẽ có được các file như sau.
Và giờ bạn hãy quay lại Bước 3 để dán mã vào website
Bước 3: Dán mã vào webiste
Bạn đăng nhập vào WordPress sau đó cài Plugin có tên WPCode – Insert Headers and Footers + Custom Code Snippets – WordPress Code Manager. Plugin này có chức năng sẽ hỗ trợ chèn các mã vào header, footer và cả functions
Sau khi cài đặt và kích hoạt Plugin xong, bạn truy cập vào Code Snippets => Header & Footer => Dán code vào Header => Save Changes
Sau khi lưu xong nếu website bạn có sử dụng Plugin cache, bạn hãy xoá cache đi sau đó truy cập web để xem kết quả nhé.
Và bên dưới là kết quả sau khi tôi thực hiện.
Chúc bạn thực hiện hành công. Nếu bạn chưa thực hiện được hãy liên hệ với tôi, để tôi có thể hỗ trợ bạn nhé.