Loading...

Chèn icon vào Blogspot dễ dàng với Font Awesome

Trước đây, để tạo các icon nhúng vào blog/website, chúng ta phải vất vả thiết kế nó từ một phần mềm đồ họa, sau đó dùng code đưa lên blog. Việc này rất mất công sức và không phải ai cũng có khả năng làm được. 


Nhưng giờ đây, có một giải pháp khắc phục vấn đề này đơn giản hơn rất nhiều đó là dùng Symboy Font (font chữ ký hiệu). Bài hôm nay, mình xin hướng dẫc các bạn cách chèn icon vào blogspot bằng 1 dạng Symboy Font có tên là Font Awesome.

1. LỢI ÍCH KHI SỬ DỤNG FONT AWESOME


Đẹp và đẹp! – Việc chèn icon vào blog sẽ giúp blog trông thân thiện, tăng tính thẩm mỹ và gây hứng thú hơn cho người đọc.
Dễ sử dụng – bạn có thể thêm và tùy biến icon chỉ với vài đoạn mã đơn giản.
Tăng tốc blog/website – vì Font Awesome suy cho cùng vẫn chỉ là một dạng font chữ. Do đó nó sẽ giúp tốc độ load trang nhanh hơn rất nhiều so với việc chèn trực tiếp một icon hình ảnh vào blog.

2. THÊM FONT AWESOME VÀO BLOGSPOT


Tại trang quản trị blogger, bạn vào Chủ đề > Chỉnh sửa HTML. Sau đó dùng tổ hợp phím Ctrl + F tìm thẻ , dán vào phía trên thẻ này đoạn mã dưới đây:

Code:
<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet'/>

Ví dụ:

Chèn icon vào Blogspot dễ dàng với Font Awesome Chen-font-awesome-vao-blog

Chèn Font Awesome vào blogspot

Chọn Lưu chủ đề để hoàn tất quá trình cài đặt.

3. CHÈN ICON VÀO BLOGSPOT VỚI FONT AWESOME


Để xem danh sách các icon mà Font Awesome hỗ trợ, các bạn truy cập vào: fontawesome.io/icons
Click vào icon mà bạn cần dùng để lấy code hiển thị. Xem ví dụ minh họa bên dưới.

Chèn icon vào Blogspot dễ dàng với Font Awesome Lay-code-font-awesome

Khi bạn đã có được đoạn code rồi, tiếp theo bạn quay trở lại blog của mình, chọn ví trị muốn hiển thị và dán đoạn code này vào. Nếu bạn sử dụng chúng trong bài viết, hãy nhớ chuyển qua tab HTML.

4. TỔNG KẾT


Cách cài đặt và sử dụng Font Awesome không quá khó phải không. Vậy bạn đang dùng cách thức nào để trang trí cho blog của mình? Bạn biết thủ thuật gì có thể thay thế Font Awesome hiệu quả hơn? Cùng nhau chia sẻ ý kiến xuống phía dưới bài viết nhé.

Nếu bạn thích bài viết này, hãy subscribe blog của mình để thường xuyên cập nhật những bài viết hay nhất, mới nhất qua email nhé. Cảm ơn rất nhiều.

Có thể bạn sẽ thích
Loading...
avatar

4/20/2017, 05:19

Chào bạn! Mình được báo cáo bạn đã sử dụng nội dung bài viết từ Blog của mình, mình không phản đối việc này nhưng phiền bạn vui lòng trích đúng nguồn bài viết về http://quantriblog.com . Cảm ơn bạn
Please Enable Javascript!Enable JavaScript