All-In-One Cufon - Plugin hỗ trợ làm đẹp font chữ cho Wordpress

[PVS]

All-In-One Cufon - Plugin hỗ trợ làm đẹp font chữ cho Wordpress

Cài đặt plugin All-in-One Cufon theo cách cài đặt một plugin WordPress thông thường.

Khi cài đặt xong, vào Setting ⇨ All-in-One Cufon sẽ thấy một bảng thông báo màu đỏ bảo bạn phải bổ sung thư mục cufon-fonts trong thư mục wp-plugins.

​

Để giải quyết nó, truy cập vào thư mục wp-content/plugins trên host để tạo một thư mục mới tên là cufon-fonts.

​

Khi tạo xong, vào lại Setting ⇨ All in One Cufon mà không còn thấy thông báo kêu bổ sung thư mục cufon-fonts nữa là ok.

Upload font vào thư mục cufon-fonts
Bước kế tiếp nữa là phải upload file Cufon đã tạo trước đó (xem cách tạo font cho Cufon) vào thư mục cufon-fonts vừa tạo ở bước trên. Ví dụ file font có tên là UVN_Bai_Sau_400.font.js

​

Được rồi, bây giờ vào lại Setting ⇨ All-in-One Cufon sẽ thấy font vừa được upload lên kèm theo các thông tin cần thiết đó là tên fontFamily, ảnh mô tả font. Tích vào dấu Enable lên để kích hoạt nó để sử dụng (nó sẽ tự chèn file font vào theme).

​

Ok, vậy là đã hoàn thành bước cài đặt. Bây giờ cùng nhau xem cách kích hoạt Cufon lên các thành phần trong WordPress nhé.

Sử dụng Cufon cho WordPress
Trong phần setting của All-in-One Cufon sẽ thấy khung Cufón Code, đây là nơi để chèn các đoạn script chèn Cufon vào một website thông thường, chỉ khác là code của chèn ở đây sẽ không có <script type="text/javascript"> </script>

Như ví dụ, nếu muốn sử dụng font UVN Bai Sau cho các thẻ h2 trên blog thì sẽ chèn code như sau vào phần Cufon Code.

Cufon('h2', { fontFamily: 'UVN Bai Sau' });

Kết quả là các thẻ h2 đã được áp dụng font của Cufon.

​

Thế là xong rồi đấy, coi như đã áp dụng Cufon thành công trên blog WordPress.

Bonus: Tìm class của từng thẻ HTML
Nếu dùng code ở trên để áp dụng thì tất cả thẻ h2 trên blog WordPress đều được áp dụng Cufon. Nhưng nếu muốn áp dụng Cufon cho một vùng riêng biệt mà không bị ảnh hưởng đến các thẻ h2 nằm ở ngoài vùng chọn đó thì cần thêm class của thẻ h2 đó khi khai báo trong Cufon. Ví dụ nếu muốn áp dụng Cufon chỉ dành cho tiêu đề bài viết (thẻ h2 trong class entry-title) thì sẽ khai viết code như sau.

Cufon('h2.entry-title', { fontFamily: 'UVN Bai Sau' });

Lúc này chỉ có thẻ h2 trên tiêu đề bài viết là được áp dụng Cufon, còn các phần khác thì vẫn bình thường. Cái này chắc ai có biết qua CSS thì đều biết cả. Vậy làm thế nào để biết class của từng khu vực?

Đơn giản là dùng tính năng Inspect Element trong Google Chrome để “soi”. Cứ rê chuột vào vị trí cần xem, ấn chuột phải chọn Inspect Element là sẽ thấy. Ví dụ muốn xem class của thẻ tiêu đề trong nội dung bài viết.

​

Sẽ thấy thẻ tiêu đề và class của nó.

​

Hy vọng với bài hướng dẫn ngắn này, các bạn có thể áp dụng Cufon thật tốt vào blog WordPress để trang trí các font chữ của mình thêm lộng lẫy.

Cufon có ảnh hưởng tới SEO hay không?
Có nhiều người lo lắng Cufon sẽ ảnh hưởng trực tiếp đến SEO vì khi họ xem nội dung HTML sau khi áp dụng Cufon thì thấy như thế này.

​

Nhưng các bạn hoàn toàn yên tâm, Google vẫn index website bình thường và nó vẫn hiểu ra các text đã áp dụng Cufon vì Google không đọc Javascript, Flash trong website. Mà nội dung này chỉ hiển thị khi file cufon-yui.js hoạt động. Có thể sử dụng exentions Web Developer của Google Chrome và dùng tính năng tắt Javascript trong web để kiểm tra.

Nhưng Cufon cũng ảnh hưởng gián tiếp đến một chút về mặt SEO vì nó sẽ làm chậm website một chút xíu, mà Google bây giờ đã ưu tiên những website có tốc độ tải trang nhanh.

Chúc các bạn thành công.

Nguồn: Thachpham​

 

[hopcung]

Lấy nguồn từ ông thạch phạm đó hả, ông này tối ngày nghiên cứu wordpress không chịu lấy vợ luôn