Thêm icon vào menu của Genesis Framework và child theme
Source: Thêm icon vào menu của Genesis Framework và child theme
Hướng dẫn thêm icon vào menu của Genesis Framework và Genesis child theme một cách đơn giản.
Bạn có cảm thấy mệt mỏi khi nhìn vào một thanh menu toàn văn bản cả ngày? Chúng quá đơn điệu và không bắt mắt chút nào. Bạn có muốn một thanh menu sống động, như hình trên không? Đơn giản vô cùng. Ngay sau đây, tôi sẽ hướng dẫn bạn cách thêm biểu tượng vào menu của Genesis Framework hoặc chủ đề con của Genesis chỉ với một vài bước đơn giản. Các hướng dẫn cũng có thể được áp dụng cho các chủ đề WordPress khác.
Tìm hiểu thêm:
Việc thêm biểu tượng vào menu có làm cho web tải chậm hơn không?
Câu trả lời chắc chắn là có. Tùy thuộc vào loại Biểu tượng phông chữ bạn chọn, mức độ ảnh hưởng sẽ khác nhau. Do đó, bạn cần cân nhắc kỹ việc chèn icon vào web có thực sự cần thiết hay không? Nếu bạn ưu tiên tốc độ tải trang web, thì tốt nhất bạn nên tránh xa các loại Phông chữ và Biểu tượng phông chữ của Google, vì chúng là một trong những “kẻ thù” hàng đầu.
Thêm biểu tượng vào menu Genesis và chủ đề con
1. Thêm mã sau vào cuối tệp functions.php của Khung Genesis hoặc chủ đề con bạn đang sử dụng:
Hoặc thay thế nó bằng mã sau nếu bạn muốn sử dụng CDN của CloudFlare để tải xuống Font Awesome:
Bạn cũng có thể sử dụng plugin Code Snippets để chèn mã thay vì chèn trực tiếp vào tệp chủ đề.
2. Truy cập vào Ngoại hình => Thực đơn (nơi các menu được tạo và chỉnh sửa), thêm <span> lớp dưới đây cho mục Nhãn điều hướng, trước các nhãn:
Bạn cũng có thể dùng <i> lớp nếu <span> lớp không có hiệu lực:
Giữa hai dấu (“) là nơi bạn thêm mã của Font Awesome. Danh sách các bảng mã, vui lòng xem tại đây. Ví dụ, tôi muốn thêm biểu tượng nút trang chủ, tôi sẽ nhập mã là fa fa-home, xem hình minh họa bên dưới:
Làm tương tự với các nhãn khác trong menu. Sau khi hoàn thành, hãy lưu và xem kết quả. Đơn giản như vậy. Chúc may mắn!
Bạn có thể chèn biểu tượng vào bất kỳ đâu trên website theo hướng dẫn trên, ví dụ như trong bài viết, widget, tiêu đề widget… nhưng không giới hạn trong menu.
Bạn có phương pháp đơn giản và hiệu quả hơn để thêm biểu tượng vào menu và chủ đề con của Genesis Framework không? Hãy chia sẻ nó với chúng tôi bằng cách sử dụng khung bình luận bên dưới.
Nếu bạn thích bài viết này, hãy đăng ký blog của tôi để thường xuyên cập nhật những bài viết hay nhất và mới nhất qua email. Cảm ơn rất nhiều. 
Via: sieucoder.com
from sieucoder.com https://ift.tt/3d98rVD
via Sieucoder.com
Nhận xét
Đăng nhận xét