MẸO THAY THẾ FONT DỄ DÀNG NHẤT

Như chúng ta đã biết thì hiện nay có rất rất nhiều Blogger Template khá đẹp và nhiều tính năng không thua gì các nền tảng khác. Bây giờ chúng không chỉ có mỗi giao diện blog không thôi, mà còn cả giao diện báo chí, phim ảnh,... đủ mọi thứ để tùy chọn. Nhưng có một điều mà mình chắc chắn mọi người đều sẽ gặp trong quá trình sử dụng những template đó chỉnh là lỗi font chữ.

Hiện tại thì có rất nhiều font chữ đẹp ở để phục vụ cho việc thiết kế website, nhưng đa phần lại không hỗ trợ Tiếng Việt, và việc thay thế toàn bộ phần css để đổi font thì khá là vất vả, đôi khi tác giả chèn đủ mọi loại chỗ, sidebar, tiêu đều, footer... Bạn vẫn có thể sử dụng Notepad hoặc những trình soạn thảo để thay thế cho lẹ, nhưng mình có cách này cũng khá là đơn giản để chia sẻ cho các bạn.

Mẹo thay thế Font dễ dàng nhất
Chúng ta cũng biết là hiện tại thì hầu hết mọi người đều lấy font chữ trên Google Fonts để mang về sử dụng, mình sẽ hướng dẫn các bạn mẹo thay thế font qua việc sử dụng font khác hỗ trợ tiếng việt trên đó.

Đầu tiên bạn tìm đến mã nhúng link của font mà bạn muốn thay thế. Ví dụ như font Oswad, bạn tìm với từ khóa Oswald trong phần code của template bạn, bạn sẽ tìm được một đoạn thế này

<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>

bây giờ bạn truy cập vào đường link nằm trong mã nhúng đó và copy toàn bộ mã có trong đó và chèn vào dưới thẻ <b:skin><![CDATA[ nó sẽ thành ra thế này

<b:skin><![CDATA[/*
-----------------------------------------------
KslZone Blogger Template
Name    : ABC
Author  : KSL
Url     : XXX
----------------------------------------------- *
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  src: local('Oswald Regular'), local('Oswald-Regular'), url(http://themes.googleusercontent.com/static/fonts/oswald/v8/-g5pDUSRgvxvOl5u-a_WHw.woff) format('woff');
}
..................
..................
..................
]]></b:skin>

sau khi chèn xong bạn xóa đoạn mã nhúng link lúc đầu thì vì bây giờ ta chã cần xài nó nữa.
Bây giờ bạn vào Google Fonts phần hỗ trợ tiếng việt, chọn một font cho bạn để thay thế, rồi tìm đến mã nhúng để sử dụng cho font đó. Ví dụ mình có mã nhúng font Open Sans

<link href='http://fonts.googleapis.com/css?family=Open+Sans&subset=latin,vietnamese' rel='stylesheet' type='text/css'>

Tương tự như phía trên kia bạn truy cập vào đường link có trong mã nhúng bạn sẽ thấy đoạn mã như thế này

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url(http://themes.googleusercontent.com/static/fonts/opensans/v8/59ZRklaO5bWGqF5A9baEET8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}

Bây giờ là mẹo của mình đây, bạn copy đường link dài trong đoạn mã trên và thay thế với cái đường link dài có trong phần mà mình bảo bạn chèn dưới thẻ <b:skin><![CDATA[ đó. Sau khi làm xong thì nó thành ra thế này

-----------------------------------------------
KslZone Blogger Template
Name    : ABC
Author  : KSL
Url     : XXX
----------------------------------------------- */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  src: local('Oswald Regular'), local('Oswald-Regular'), url(http://themes.googleusercontent.com/static/fonts/opensans/v8/59ZRklaO5bWGqF5A9baEET8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
..................
..................
..................
]]></b:skin>

lưu lại template và xem thành quả.