Bộ danh sách Flatsome icons và cách sử dụng chúng

Trong bài viết này KHATHEME chia sẻ cho các bạn bộ danh sách Flatsome icons tiện lợi đã có trên theme flatsome, lưu lại chúng và cách sử dụng trên website dùng theme Flatsome. Bạn nào đang cần thêm icon vào menu, danh sách tham khảo nhé.

Danh sách Flatsome icons

Dưới đây là danh sách Flatsome Icons dạng text để bạn copy dán vào  HTML của văn bản. Bạn cứ lấy mã icon bên dưới và đặt vào trong đoạn HTML mẫu sau và bỏ vào  nơi bạn muốn trên website dùng Flatsome, ví dụ: <i class="icon-chat"></i>

icon-lockicon-line
icon-chat
icon-user
icon-shopping-cart
icon-tumblr
icon-gift
icon-phone
icon-play
icon-menu
icon-shopping-basket
icon-shopping-bag
icon-google-plus
icon-heart-o
icon-heart
icon-500px
icon-vk
icon-angle-left
icon-angle-right
icon-angle-up
icon-angle-down
icon-twitter
icon-envelop
icon-tag
icon-star
icon-star-o
icon-facebook
icon-feed
icon-checkmark
icon-plus
icon-instagram
icon-pinterest
icon-search
icon-skype
icon-dribbble
icon-certificate
icon-expand
icon-linkedin
icon-map-pin-fill
icon-pen-alt-fill
icon-youtube
icon-flickr
icon-clock
icon-snapchat

Bạn chỉ cần coppy và dán vào chỗ thích hợp trong code của bạn là nó sẽ tự động hiển thị ra ngoài.

Cách sử dụng Flatsome icons

Khi bạn dựng trang với UX builder thì dễ rồi, thích chọn icon nào thì chọn và căn chỉnh trong phần kéo thả đó luôn. Tuy nhiên, trong những trường hợp bạn cần chèn Flatsome icons vào thanh menu, post-info chẳng hạn thì phải viết CSS  riêng cho icon đó. Ví dụ như dưới đây là mình chèn icon vào thanh menu. Mình coppy đoạn code này:  <i class="icon-menu"></i>

Icons đã xuất hiện trước “Trang chủ” trong website của mình. Nếu bạn muốn đẹp hơn nữa và tuỳ chỉnh lớn nhỏ thì CSS lại nhé.

Ngoài ra, nếu bạn thấy icon trên không đủ đáp ứng nhu cầu thì có thể tham khảo thêm phương án dùng icon ảnh hoặc bộ icon của các bên khác như của Google Fonts Icons | Font Awesome Icons