.jpg)
Dù google fonts api cung cấp khá nhiều font tuy nhiên bạn có font chữ của mình và muốn sử dụng nó , mỗi người có 1 style mà , giống như blog cái gì cũng phải độc ,để sử dụng font chữ mang style của mình ta sẽ dùng cufón . :))
Bước 1: Tạo font
Trước hết, bạn cần download cufon, và sử dụng công cụ generator của Cufón để tạo và tùy biến cách mà font được thể hiện. Tôi rất ấn tượng với các lựa chọn mà Cufón cung cấp khi tạo font. Sau khi tạo xong bạn sẽ có được link download file javascript với các thông tin về font mà Cufón có thể đọc nó.Bước 2: Thêm javascript Cufón và javascript font của bạn vừa tạo
add mã vừa tạo vào website
1 | <script type="text/javascript" src="js/cufon-yui.js" ></script> |
2 | <script type="text/javascript"src="js/Comfortaa_400.font.js"></script> |
Bước 3: Chọn các phần thay thế
Để thay thế bạn thêm vào đoạn mã sau:1 | <script type="text/javascript" > |
2 | Cufon.replace('#cufon-area h2, #cufon-area h3'); |
3 | </script> |
khi sinh file js từ một file font, chúng ta chỉ nên chọn những tập hợp ký tự mà mình sử dụng, vì nếu chọn tất cả các ký tự sẽ làm file js trở nên phình to, lúc load trang web sẽ ảnh hưởng đến tốc độ. Tập hợp ký tự tiếng Việt của chúng ta được mình gom lại dưới đây.
àáạảãâầấậẩẫăằắặẳẵèéẹẻẽêềếệểễìíịỉĩòóọỏõôồốộổỗơờớợởỡùúụủũưừứựửữỳýỵỷỹđÀÁẠẢÃÂẦẤẬ
ẨẪĂẰẮẶẲẴÈÉẸẺẼÊỀẾỆỂỄÌÍỊỈĨÒÓỌỎÕÔỒỐỘỔỖƠỜỚỢỞỠÙÚỤỦŨƯỪỨỰỬỮỲÝỴỶỸĐđây là code mình dùng cho font chữ tiếng việt có dấu
<script type="text/javascript" src="http://forumr.googlecode.com/files/cufon-yui.js%22%3E%3C/script>
<script type="text/javascript" src="http://forumr.googlecode.com/files/shimithuphap2_400.font.js%22%3E%3C/script>
<script type="text/javascript">
Cufon.replace('.post-title');
</script>Tốc độ load có giảm đôi chút file javascript những 400kb ,tốt nhất nên thay thế ít thôi như title chẳng hạn ,Để tạo phong cách riêng, không đụng hàng cho blog thì Cufón chính là một trong những sự lựa chọn tốt cho bạn.
nguồn tổng hợp ntut và wordpressvn
No comments: