Trên Laravel, ngoài Bootstrap Icon đã được giới thiệu trong bài viết ở đây. VinaSupport xin giới thiệu và hướng các bạn tích hợp bộ font, icon có tên là “Font Awesome” được sử dụng rất phổ biến vào Laravel.
Font Awesome là gì?
Font Awesome là bộ công cụ phông chữ và biểu tượng dựa trên CSS và Less. Nó đang được sử dụng phổ biến trong các website hiện đại ngày nay. Font Awesome hoạt động hầu hết ở các trình duyệt hiện đại hiện hay. Font Awesome có sẵn ở nhiều định dạng tệp khác nhau, bao gồm otf, eot, ttf, woff, svg, v.v
Cài đặt Font Awesome
Bước 1: Thêm thư viện Font Awesome
npm install @fortawesome/fontawesome-free
Bước 2: Nhúng file stylesheet vào. Các bạn thêm vào file resources/css/app.css của Laravel
@import "@fortawesome/fontawesome-free/css/all.css"; @tailwind base; @tailwind components; @tailwind utilities;
Sau đó chạy lệnh npm run dev hoặc npm run build
Hướng dẫn sử dụng Font Awesome
để sử dụng chúng ta thêm các icon bằng đoạn code như ví dụ sau:
<i class="fa-solid fa-cart-shopping"></i>
Các bạn tham khảo hướng dẫn sử dụng tại trang chủ ở đây: https://fontawesome.com/docs/web/setup/get-started
Nguồn: vinasupport.com