cach dang ky m88 |

Thiết kế giao diện với Font Awesome

Nếu bạn muốn thiết kế giao diện WordPress mà không cần đến hình ảnh thì bài viết này Sáu sẽ hướng dẫn cho bạn cách làm như vậy. Font Awesome là một công cụ tuyệt vời để bạn tạo giao diện website, có hơn 400 icon cho bạn lựa chọn, chỉ cần tích hợp css và font vào là sử dụng, không cần đến javascript hoặc những cái gì cao siêu.

Tạo giao diện WordPress với Font Awesome

Trong bài viết hôm trước Sáu đã hướng dẫn cho bạn cách tích hợp Bootstrap vào WordPress, tuy nhiên với Bootstrap thì bộ icon hỗ trợ kèm theo chưa đầy đủ lắm. Công việc tích hợp Font Awesome cũng tương tự như vậy, bạn chỉ cần tải bộ font và css về, sau đó giải nén và đính kèm vào giao diện của WordPress để sử dụng.

font-awesome.zip

Sau khi tải tập tin về máy tính, bạn giải nén và đổi tên thư mục thành font-awesome, tiếp đến copy nguyên thư mục này bỏ vào giao diện của bạn, sử dụng hàm sau để tích hợp Font Awesome.

1
2
3
4
5
function add_font_awesome() {  
    wp_register_style('font-awesome-style', get_template_directory_uri() . '/lib/font-awesome/css/font-awesome.min.css');
    wp_enqueue_style('font-awesome-style');
}
add_action('wp_enqueue_scripts', 'add_font_awesome');

Nhớ là thay đổi đường dẫn cho phù hợp với tập tin trong giao diện. Sau khi hoàn thành xong thì bạn đã có thể sử dụng font một cách thoải mái. Cách sử dụng cũng cực kỳ dễ, bạn chỉ cần tìm icon ưng ý và sử dụng lại theo cú pháp sau:

1
<i class="fa fa-wordpress"></i>

Xem thêm danh sách tất cả các icon hiện có của Font Awesome trên trang Font Awesome Icons.

Thiết kế giao diện WordPress không cần hình ảnh

Ngoài cách sử dụng trên, bạn có thể chỉnh sửa thuộc tính của css, nếu như các chức năng bạn không thêm được HTML code giống như ví dụ bên trên thì bạn áp dụng phương pháp này:

1
2
3
4
a.button-send:before {
    font-family: 'FontAwesome';
    content: "f1d9";
}

Rất đơn giản và dễ sử dụng phải không nào. Thiết kế website theo phong cách hiện đại là phải gọn nhẹ và chạy nhanh, nếu giao diện bạn không có dùng hình ảnh thì dĩ nhiên sẽ chạy nhanh hơn so với giao diện có nhiều hình ảnh, đặc biệt là những hình nền có kích thước lớn. Chúc bạn thành công.

Hổ trợ

Hổ trợ Hữu Phát

Nhân viên tư vấn thiết kế website Mr. Hữu -
Tư vấn Thiết kế website
0188.525.0716 
Yahoo
 
Nhân viên tư vấn thành lập công ty Mrs. Loan -
Tư vấn thành lập công ty
09.798.17170 
Yahoo
 
Nhân viên hổ trợ kỷ thuật mạng Mr. Công -
Nhân viên kỹ thuật
0985.012.596 
Yahoo
 

Tìm kiếm

Thanh toán:

Trao đổi backlink :
thiet ke website binh duong | thiết kế web tại bình dương |

quang cao google tai binh duong | quang ba web o binh duong |