Khi phát hành phiên bản WordPress 3.8, trang Dashboard của WordPress được thay đổi hoàn toàn, một trong các thay đổi là sử dụng icon font cho các icon trên trang Dashboard.

su dung dashicons

Bộ icon font đó là Dashicons. Có thể bộ icon font này không có nhiều icon như: Font Awesome, Font Entypo,… Nhưng nó được tích hợp sẵn trong WordPress, ta nên tận dụng nó.

Thêm Dashicons vào themes, plugins

Dashicons thì mặc định chỉ load trong trang Dashboard. Bạn cần dùng wp_enqueue_style để thêm nó vào themes hoặc plugins của bạn. Bạn dùng đoạn code sau:

Đoạn code trên sẽ load file dashicons.css vào trong themes, plugins của bạn

Cách sử dụng

Tại phần muốn thêm icon bạn viết

Hoặc sử dụng pseudo-class :before (hoặc :after) trong CSS

Bạn có thể dựa vào các CSS class để thêm màu hoặc tăng/giảm kích thước nếu muốn.

Để biết tên cũng như mã các icon, bạn vào Dashicons, chọn icon mình muốn và phía trên sẽ có tên class CSS của icon đó , bạn cũng có thể click Copy HTML (hoặc Copy CSS) để lấy mã HTML (hoặc mã CSS) của icon đã chọn.

su dung dashicons

Demo

See the Pen DnpiK by Trang Si Hung (@jshung92) on CodePen.1806