Trong bài viết trước đã hướng dẫn Tích hợp Font Awesome vào Genesis child theme, giờ làm sao để sử dụng – áp dụng Font Awesome vào trong Genesis theme, bài viết hoặc bất kỳ đâu bạn muốn áp dụng – Bài viết này sẽ hướng dẫn bạn thực hiện điều đó.
Như đã đề cập ở bài viết trước thì việc sử dụng Font Awesome trong Genesis thông qua 02 cách, cụ thể là:
- Sử dụng Font Awesome thông qua class thông thường
- Tạo shortcode để sử dụng Font Awesome dễ dàng trong Genesis
Chi tiết hướng dẫn như sau:
Sử dụng Font Awesome thông qua class HTML thông thường
Hiện tại danh sách icon của Font Awesome có hơn 369 biểu tượng, để sử dụng những biểu tượng này theo cách thông thường thông qua mã HTML class thông thường bạn chỉ cần copy mã và chèn vào website của bạn theo mỗi mã tương ứng với mỗi icon.
Ví dụ, mình muốn chèn biểu tượng Camera Retro thì mình sẽ dùng đoạn mã như sau:
Cực kỳ đơn giản đúng không nào. Bạn có thể xem thêm về cách tùy biến cách sử dụng icon của Font Awesome tại đây.
Tạo shortcode để sử dụng Font Awesome dễ dàng trong Genesis
Tạo shortcode trong WordPress nhằm mục đích rút ngắn bớt những đoạn code dài lê thê và rắc rối trong quá trình sử dụng. Đối với Font Awesome cũng vậy, hiện tại nó có khả nhiều thuộc tích nào là kích thước – size, xoay – rotate, chuyển động – animate… áp dụng đoạn mã bên dưới nhằm tạo shortcode cho Font Awesome sẽ rút ngắn bớt những đoạn mã rắc rối ấy.
Cách sử dụng shortcode cho Font Awesome như sau:
Trong trường hợp bạn muốn thêm các thuộc tính cho mỗi biểu tượng bạn có thể tham khảo thêm tại đây.
Chúc bạn thành công.
Nếu bạn có bất kỳ góp ý, thắc mắc nào, vui lòng góp ý giúp mình nha!
Xét nghiệm ADN says
Hic, mình xài class Html trước giờ, nếu mà chuyển qua shortcode thì phải sửa lại quá trời. Để dành cho site mới vậy, hihi.
Thanks Đông.
Nguyễn Nhật Đông says
Lợi bất câp hại 😀
Shortcode cũng hay nhưng đổi theme cái thì cũng phải copy code kít nữa mệt!
Cứ xài HTML class cho nó nhanh tuy hơi bất tiện xíu 😀