Thêm font Typekit vào WordPress nhanh và đơn giản

Lượt xem
Home

Thêm font Typekit vào WordPress sẽ giúp các nhà thiết kế có thể sử dụng các font chữ web tùy chỉnh đẹp mắt, chất lượng cao trên trang web. Trong bài viết này, Vietnix sẽ hướng dẫn bạn cách thêm font chữ Typekit trong WordPress để giúp website của bạn đẹp hơn.

Tại sao nên sử dụng font web tùy chỉnh trên WordPress?

Typekit là một dịch vụ font chữ dựa trên dịch vụ đăng kí có thể giúp bạn tiết kiệm rất nhiều tiền. Thay vì trả tiền cho các font chữ riêng lẻ, vốn có thể khá đắt đỏ, bạn có thể truy cập miễn phí toàn bộ thư viện gồm hàng trăm font chữ hoặc với mức phí cố định hàng năm.

Thư viện Typekit là một bộ sưu tập lớn gồm hơn 1.000 font chữ. Một số font chữ đẹp nhất mà bạn có thể tìm thấy trên web có sẵn thông qua Typekit, một dịch vụ của Adobe.

Thư viện Typekit
Thư viện Typekit

Gói miễn phí cơ bản của họ đi kèm với quyền truy cập vào hơn 230 font chữ và bạn có thể sử dụng miễn phí 2 họ font chữ trên một trang web. Các gói khác dao động từ $49,99 đến $99,99 mỗi năm.

Có thể dễ dàng thêm các font chữ Typekit này vào bất kỳ trang web nào mà không làm chậm tốc độ tải trang của bạn. Các font chữ được cung cấp từ CDN của Adobe và tải với tốc độ nhanh hơn nhiều so với khi bạn lưu trữ chúng trên trang web của riêng mình.

Kiểu chữ đóng một vai trò quan trọng trong việc thiết kế trang web của bạn. Vì vậy, chọn font chữ phù hợp sẽ truyền đạt rõ ràng thông điệp của bạn tới người đọc. Bất kể bạn muốn thể hiện loại hình ảnh nào, thân thiện hay giản dị, font chữ trên trang web của bạn có thể giúp thể hiện hình ảnh phù hợp.

Chọn font chữ phù hợp cho trang web WordPress của bạn có thể làm cho trang web của bạn chuyển từ một thiết kế đơn giản thành một tác phẩm nghệ thuật đẹp mắt về mặt thẩm mỹ.

Các font chữ web tùy chỉnh phù hợp có thể:

  • Tăng conversion rate.
  • Giảm bounce rate của trang web của bạn.
  • Tăng time on site dành cho trang web của bạn.
  • Tạo trải nghiệm đáng nhớ cho người dùng.

Sử dụng Typekit có thể ảnh hưởng đến tốc độ tải trang web của bạn vì việc tải các font từ Typekit đòi hỏi trình duyệt phải tải thêm tài liệu font từ máy chủ Typekit trước khi hiển thị trang web hoàn chỉnh. Để giảm thiểu ảnh hưởng của Typekit đối với tốc độ tải trang web, bạn cần lựa dịch vụ hosting có khả năng đáp ứng các yêu cầu tải font từ Typekit một cách nhanh chóng và hiệu quả. Từ đó giúp website của bạn hoạt động nhanh hơn và cung cấp trải nghiệm tốt hơn cho người dùng.

Nếu bạn đang tìm kiếm một giải pháp lưu trữ tốc độ cao, tối ưu cho website WordPress của bạn, thì việc sử dụng dịch vụ của Vietnix là một lựa chọn tuyệt vời. WordPress Hosting Vietnix được thiết kế chuyên biệt và tối ưu cho nền tảng WordPress, vì vậy bạn có thể yên tâm rằng website sở hữu tốc độ tải nhanh chóng, hiệu suất cao, ổn định và bảo mật. WordPress Hosting có nhiều tính năng hấp dẫn, bao gồm:

  • Tải trang nhanh chóng dưới 1 giây với ổ cứng NVMe và công nghệ LiteSpeed Enterprise.
  • Đội ngũ kỹ thuật chuyên nghiệp tư vấn và tối ưu hóa mã nguồn WordPress.
  • Hệ thống sao lưu tự động 4 lần/ngày, bảo vệ dữ liệu an toàn.
  • Hạ tầng hiện đại với Firewall chống DDoS, đảm bảo ổn định và an toàn.
  • Dễ dàng tạo website WordPress qua WordPress Toolkit chỉ với một cú nhấp chuột.
  • Thiết kế website an toàn và tiện lợi với khu vực thử nghiệm không giới hạn. 
  • Được tặng miễn phí bộ theme và plugin WordPress có giá lên đến 26.000.000 VND

Nhanh tay liên hệ Vietnix để được tư vấn gói hosting phù hợp. 

Dưới đây là cách sử dụng Typekit để tùy chỉnh thiết kế WordPress của bạn.

Bắt đầu sử dụng với Typekit

  • Trước tiên, bạn sẽ cần tạo một tài khoản Typekit. Để làm điều này, chỉ cần truy cập Typekit.com để chọn các gói có sẵn.
  • Bạn sẽ cần phải chọn kế hoạch mà bạn muốn đăng ký. Gói miễn phí giới hạn bạn tạo một trang web và quyền truy cập vào các font chữ nhất định. Bạn có thể muốn bắt đầu với gói miễn phí để dùng thử và sau đó nâng cấp sau. Bản nâng cấp cung cấp cho bạn một thư viện font chữ lớn hơn và bạn có thể sử dụng chúng trên nhiều trang web hơn.
Gói đăng ký Typekit
Gói đăng ký Typekit

Bước tiếp theo là tạo một bộ, tập hợp một thư viện font chữ và cài đặt cụ thể cho trang web của mình, vì vậy Typekit chỉ tải các file và code cần thiết. Để tạo bộ công cụ của bạn, hãy thêm tên trang web và tên miền của bạn rồi nhấp vào Continue.

Tạo bộ công cụ cho trang web của bạn
Tạo bộ công cụ cho trang web của bạn

Sau khi bạn điền xong thông tin cho bộ công cụ của mình, Typekit sẽ cung cấp cho bạn một đoạn code JavaScript để thêm vào trang web. Bạn có thể sao chép và dán code này vào trình soạn thảo văn bản như Notepad để lưu.

Hiện tại, bạn có thể bắt đầu chọn font chữ của mình. Bạn có thể duyệt qua thư viện font chữ và lọc theo các tùy chọn như classification, weight, width, x-height, v.v.

Chọn font chữ từ Typekit
Chọn font chữ từ Typekit

Khi bạn chọn được font chữ mình thích, bạn có thể nhấp vào font chữ đó để biết thêm chi tiết và ví dụ. Nếu bạn muốn thêm nó vào bộ công cụ web của mình, hãy nhấp vào nút Web Use: Add to Kit ở bên phải.

Thêm font chữ Typekit vào bộ công cụ web
Thêm font chữ Typekit vào bộ công cụ web

Thao tác này sẽ hiển thị cửa sổ popup nơi bạn cần thêm font chữ bạn đã chọn vào bộ công cụ bạn vừa tạo.

Thêm font chữ web tùy chỉnh vào bộ công cụ
Thêm font chữ web tùy chỉnh vào bộ công cụ

Giờ đây, bạn có thể nhấp vào nút Publish để lưu các thay đổi vào bộ công cụ của mình. Bây giờ, bộ font chữ của bạn đã có thể được sử dụng.

Xuất bản bộ font của bạn
Xuất bản bộ font của bạn

Cách thêm font chữ Typekit trong WordPress

Cách dễ dàng nhất để thêm font chữ web tùy chỉnh mới vào blog WordPress của bạn là sử dụng plugin Typekit Fonts cho WordPress. Sau khi cài đặt và kích hoạt plugin, bạn có thể truy cập Settings » Typekit Fonts để định cấu hình plugin.

Sử dụng plugin WordPress Typekit để tùy chỉnh phông chữ
Sử dụng plugin WordPress Typekit để tùy chỉnh phông chữ

Trước tiên, bạn cần dán code JavaScript mà bạn đã lưu trước đó vào trường mã nhúng Typekit. Sau đó, bạn có thể thêm bộ chọn CSS để chỉ định nơi bạn muốn sử dụng font chữ trên trang web của mình. Trong ảnh chụp màn hình ở trên, Vietnix đã thêm font chữ vào h1.site-title vào bộ chọn CSS.

Ngoài ra, theme WordPress của bạn có thể sử dụng các lớp khác nhau cho các yếu tố khác nhau. Bạn sẽ cần sử dụng công cụ Inspect Element trong trình duyệt web của mình để tìm ra các lớp CSS đó.

Sử dụng plugin WordPress Typekit để tùy chỉnh font chữ
Sử dụng plugin WordPress Typekit để tùy chỉnh font chữ

Lời kết

Vietnix hy vọng bài viết này đã giúp bạn tìm hiểu cách thêm các font chữ bắt mắt vào WordPress với Typekit. Bạn cũng có thể muốn xem hướng dẫn của Vietnix về hướng dẫn cách thay đổi font chữ theme WordPress để giúp trang web của bạn đẹp hơn, chúc bạn thành công!

Chia sẻ lên

Theo dõi trên

Logo Google new

Đánh giá

5/5 - (162 bình chọn)

Hoàng Vui

Kết nối với mình qua

Icon Quote
Icon Quote
Đăng ký nhận tin
Để không bỏ sót bất kỳ tin tức hoặc chương trình khuyến mãi từ Vietnix

Bình luận

Chỉ số tăng trưởng

Điểm Desktop

100 (+39)

Điểm Mobile

100 (+67)

Core Web Vitals

Passed

Lĩnh vực

Ecommerce

Chỉ số tăng trưởng

Điểm Desktop

99 (+28)

Điểm Mobile

100 (+50)

Core Web Vitals

Passed

Lĩnh vực

SEO

Chỉ số tăng trưởng

Điểm Desktop

99 (+26)

Điểm Mobile

98 (+59)

Core Web Vitals

Passed

Lĩnh vực

Ecommerce

Chỉ số tăng trưởng

Điểm Desktop

100 (+8)

Điểm Mobile

98 (+35)

Core Web Vitals

Passed

Lĩnh vực

Giáo Dục

Chỉ số tăng trưởng

Điểm Desktop

100 (+61)

Điểm Mobile

100 (+61)

Core Web Vitals

Passed

Lĩnh vực

Giáo Dục

Võ Thiên Tòng

25 Tháng 2 lúc 21:09

·

Mình muốn gửi lời cảm ơn chân thành đến Team Vietnix, anh Hưng Nguyễn, anh Vietnix Trung, em Quốc Huy đã hỗ trợ tối ưu Page Speed Insight (PSI) cho website vanvoiminhhoa.vn của mình.
Biết đến anh Hưng đã lâu nhưng chưa có duyên sử dụng dịch vụ bên anh. Tình cờ thấy được bài Post của anh về việc hỗ trợ tối ưu PSI miễn phí chỉ với vài Slot, thấy AE cmt khá nhiều nên cũng không nghĩ tới lượt mình. Hôm sau đánh liều inbox 1 phen xem sao thì may mắn được đưa vào danh sách. Vài ngày sau được Team Vietnix liên hệ và hỗ trợ.
Kết quả đạt được:
• Điểm xanh lè xanh lét
• Tốc độ tải trang nhanh hơn hẳn
• Các chỉ số cũng được cải thiện đáng kể
• Và mình tin rằng với việc PSI được cải thiện cũng thúc đẩy những thứ khác đi lên theo!
Mình thực sự hài lòng với dịch vụ của Vietnix và muốn giới thiệu đến tất cả mọi người:
• Dịch vụ Wordpress Hosting: Tốc độ nhanh, ổn định, bảo mật cao, hỗ trợ kỹ thuật 24/7. (https://vietnix.vn/wordpress-hosting/)
• Dịch vụ Business Hosting: Dung lượng lớn, phù hợp cho website có lượng truy cập cao, tích hợp nhiều tính năng cao cấp. (https://vietnix.vn/business-hosting/)
Đặc biệt, Vietnix đang có chương trình ưu đãi:
• Giảm giá 20% trọn đời khi nhập code THIENTONG_PAGESPEED tại trang thanh toán (Chu kỳ 12 tháng trở lên)
• Tặng 1 lần tối ưu điểm Page Speed Insight cho 1 website
Cám ơn Vietnix một lần nữa!
#Vietnix #Vanvoiminhhoa #Pagespeedinsight
Trước khi tối ưu
Sau khi tối ưu
Thiện Nguyễn - CEO SEO Dạo

5 Tháng 3 lúc 16:21

·

CORE WEB VITAL YẾU TỐ XẾP HẠNG TÌM KIẾM SEO
Core Web Vitals là một tập hợp các chỉ số đo lường hiệu suất của trang web từ góc độ người dùng, được Google sử dụng để đánh giá trải nghiệm người dùng trên các trang web. Các chỉ số chính bao gồm:
– Largest contentful paint (LCP): Tốc độ render của page. Mục tiêu là dưới 2,5 giây.
– First input delay (FID): Tốc độ phản hồi của website với tương tác của người dùng. Mục tiêu là dưới 100ms.
– Cumulative Layout Shift (CLS): Độ ổn định của bố cục trang. Mục tiêu là dưới 0.1.
Tất cả các chỉ số này đo lường các khía cạnh quan trọng của trải nghiệm người dùng trên trang web. Google đã công bố rằng từ tháng 5 năm 2021, các Core Web Vitals sẽ được sử dụng làm một trong các yếu tố đánh giá trong việc xếp hạng trang web trên kết quả tìm kiếm. Do đó, hiểu và cải thiện các Core Web Vitals là rất quan trọng đối với SEO.
Tóm lại, Core Web Vitals không chỉ giúp cải thiện hiệu suất và xếp hạng trang web trên công cụ tìm kiếm, mà còn cải thiện trải nghiệm của người dùng khi họ truy cập và tương tác với trang website.
P/s: mình đang có gói hỗ trợ đặc biệt cho anh em tối ưu tốc độ bên VIETNIX:
– Giảm 20% lifetime dịch vụ Hosting Business và Hosting Wordpress chu kỳ 12 tháng trở lên.
– Tặng 1 lần tối ưu điểm Page Speed Insight cho 1 website.
Anh em có nhu cầu đăng ký qua bạn Vietnix Trung này nhé và nhập mã SEODAO_PAGESPEED để được ưu đãi nhé.😁
Trước khi tối ưu
Sau khi tối ưu SEO Dạo
Icharm review

5 Tháng 3 lúc 15:43

·

[Mình vừa được hỗ trợ tối ưu page speed website]
Trước khi được tối ưu, web của mình điểm rất thấp, đặc biệt là mobile chỉ có 39. Cơ duyên thế nào lúc lướt face lại va phải chương trình tối ưu pagespeed bên Vietnix.
Sau khi được Trần Hoàng Phúc và team Vietnix hỗ trợ nhiệt tình, điểm web vọt lên 98 99 (như hình bên dưới). Dùng thử web thì thấy quá là mượt, 10 điểm cho team Vietnix.
Nói thật thì mình thật sự ấn tượng về sự nhiệt huyết, tận tâm và rất chuyên nghiệp bên Vietnix.
Anh em có nhu cầu về hosting hay có vấn đề về website như:
1. Web load chậm
2. Khách rời web vì đợi tải nội dung, hình ảnh lâu
3. Hay tất tần tật mọi thứ về website
THÌ LIÊN HỆ NGAY VIETNIX NHÉ!
Và đừng quên dùng pass “ICHARM_PAGESPEED” để được giảm 20% trọn đời hosting business và wp hosting. Quả code này còn được tặng 1 lần tối ưu pagespeed nữa nhé, ưu đãi chắc cũng phải nhất nhì thị trường luôn.
Trước khi tối ưu
Sau khi tối ưu
Hoàng Nguyễn

29 Tháng 2 lúc 17:04

·

Xin chào mọi người! Vừa rồi mình có sử dụng dịch vụ tối ưu website, tăng tốc độ tải trang pagespeed của Vietnix kết quả trên cả tuyệt vời nên mình viết bài này để chia sẻ thông tin với các bạn.
Lý do mình chọn dịch vụ tối ưu tốc độ website của Vietnix:
✅ Đội ngũ chuyên gia giàu kinh nghiệm: Đã tối ưu thành công cho hàng nghìn website trong nhiều lĩnh vực khác nhau. Các bạn nhân viên rất thân thiện, nhiệt tình và chủ động trong quá trình làm việc để cập nhật tiến độ.
✅ Quy trình chuyên nghiệp:
– Kiểm tra và phân tích: Vietnix sử dụng các công cụ tiên tiến để kiểm tra và phân tích tốc độ website của bạn.
– Xác định nguyên nhân: Vietnix xác định nguyên nhân khiến website tải chậm và đưa ra giải pháp tối ưu phù hợp.
– Tối ưu hóa website: Vietnix áp dụng các kỹ thuật tối ưu tiên tiến nhất để tăng tốc độ tải trang.
– Báo cáo kết quả: Vietnix cung cấp báo cáo chi tiết về kết quả tối ưu hóa website.
Công nghệ tiên tiến: Vietnix sử dụng các công nghệ tối ưu mới nhất như LiteSpeed, LSCache, Memcached, Redis, v.v.
✅ Cam kết kết quả: Vietnix cam kết tăng tốc độ website của bạn lên tối thiểu 90%.
✅ Giá cả cạnh tranh: Vietnix cung cấp dịch vụ tối ưu tốc độ website với mức giá cạnh tranh nhất trên thị trường.
📣 Để đăng ký sử dụng dịch vụ tối ưu tốc độ website và các dịch vụ khác như hosting, vps, domain… các bạn có thể đăng ký tại https://portal.vietnix.vn/aff.php?aff=57 hoặc Inbox cho sếp Vietnix Trung nhé.
Các bạn có thể kiểm tra tốc độ trang của mình https://lasan.edu.vn hoặc một vài trang khác đã sử dụng dịch vụ của Vietnix như sau:
https://pagespeed.web.dev/…/https…/v8beqewyt2…
https://pagespeed.web.dev/…/https…/etiohjvtl4…
https://pagespeed.web.dev/…/https…/yczuqpw6d1…
https://pagespeed.web.dev/…/https…/xf9y65kuzk…
https://pagespeed.web.dev/…/https…/fdrsms15en…
https://pagespeed.web.dev/…/https…/s7p9cgzeri…
Trước khi tối ưu
Sau khi tối ưu
Dũng cá xinh

30 Tháng 1 lúc 19:09

·

[Đỉnh]
Em có dùng hosting, vps, cloud vps, cloud server, dedicated server của rất nhiều bên từ trong nước đến nước ngoài để hosting khoảng 2,000+ domain. Mỗi bên đều có ưu nhược khác nhau, nhưng có 1 số bên đặc biệt “bá đạo”, trong đó có: Vietnix!!!!

Lần đầu tiên em được cả CEO Hưng Nguyễn lẫn Master về dev Vietnix Trung của 1 đơn vị hàng đầu liên quan đến Hosting, Server support từ A – Z (từ Zalo, Tele, đến FB và cả Phone)

Em có khá nhiều web dạng Big Data (bài, ảnh, database, data) lên đến hàng trăm Gb. Càng to thì nó càng có nhiều vấn đề về phần phản hồi ban đầu (nhược điểm cố hữu của php wordpress so với nativejs, reactjs, html, headless,…), và anh em Vietnix có nhã ý hỗ trợ xử lý phần Speed Insight này.

Kết quả thực sự kinh ngạc, từ cách trao đổi đến xử lý vấn đề, cut off những cái cần cut off, xử lý rất sâu vấn đề và gợi ý rất nhiều ý tưởng optimize hệ thống!!!! Thực sự quá hài lòng về kết quả cũng như cách tương tác của các đầu tầu bên Vietnix ^^!!!

Nhân cơ duyên được kết nối với những cao thủ của Vietnix, em xin chia sẻ và lan tỏa để nhiều anh em có cơ hội được sử dụng những dịch vụ tốt nhất với giá vô cùng hợp lý!!!!

1 – Với anh em chưa có hosting, em đặc biệt recommend sử dụng hosting bên Vietnix:
– Sử dụng mã DUNGCAXINH_PAGESPEED sẽ được giảm 20% trọn đời (lifetime luôn)
– Áp dụng các gói Hosting Business, Hosting wordpress và reg 1 năm trở lên
– Anh em chưa biết cách reg thì còm men hoặc ib để em hướng dẫn hoặc nhờ các bạn bên Vietnix support từ A – Z

2 – Anh em có hosting rồi và muốn build blog hoặc web = wordpress mà chưa có giao diện thì nhân tiện em đang có tài khoản Premium bên Envato, em sẽ tặng bất kỳ giao diện nào có trên Envato Themes (Link em để dưới còm men) ạ. Cả nhà còm hoặc ib em Themes mà mọi người “chim ưng”, em sẽ cho anh em tải về, up drive và gửi ạ!!! (Chương trình này kéo dài đến ngày 29 tết âm lịch ạ)

3 – BEST NHẤT luôn!!!! Anh em nào mua hosting dùng mã DUNGCAXINH_PAGESPEED sẽ được tối ưu 100 điểm tốc độ cho 1 web (đây là ưu đãi riêng của CEO Hưng Nguyễn dành cho bạn bè của #dungcaxinh ^^) (Giá trị nhất là cái vụ số 3 này anh chị em nhé ^^), cơ hội vàng để move về đơn vị hosting uy tín là đây ^^!!!!

Một lần nữa xin chân thành cám ơn 2 đồng chí em: Hưng Nguyễn và Vietnix Trung đã giải được một bài toán khó cho các trang WP Big data mà anh loay hoay bao lâu nay chưa tìm ra đáp án!!! Chúc Vietnix ngày càng phát triển và có một năm 2024 đại đại thắng nhé ^^ !!!!!
#SEO #Vietnix #dungcaxinh

Trước khi tối ưu
Sau khi tối ưu
Hiếu AI

2 Tháng 2 lúc 21:06

·

UY TÍN – TẬN TÂM – TỐC ĐỘ

3 từ trên là vẫn chưa đủ để nói về quy trình làm việc cực chuyên nghiệp của team Vietnix.Chuyện là mình có con website chính đang có lượt truy cập organic hàng ngày cũng tương đối (hình 1)

Vấn đề là, con site này đang nằm trên hosting dùng chung nên tốc độ load chưa nhanh, tốc độ load chưa nhanh thì trải nghiệm visitor chưa tốt, trải nghiệm visitor chưa tốt thì tỷ lệ chuyển đổi ra đơn hàng kiểu gì thì kiểu cũng sẽ bị ảnh hưởng.

Biết rõ là đang mất tiền nhưng không biết xử lý như lào, nghĩ mà cay.

Đang loay hoay thì vận may nó tới, hôm qua đang lướt phở bò thấy a Nguyễn Việt Dũng đăng bài, rảnh nên thả cái comment hóng hớt, ai ngờ ngoằng phát thấy ông Dũng tạo nhóm với Vietnix Trung luôn.

Ae Vietnix thì siêu tốc độ, lập tức lấy thông tin vào việc, không hỏi han lằng nhằng, không kỳ kèo chốt đơn dù lúc đấy cũng đang đêm muộn.
Sáng hôm sau dậy vẫn còn đang lơ ngơ mở điện thoại check tin nhắn thì đã thấy ae Vietnix báo xong việc, trong khi mình vẫn chưa biết có chuyện gì xảy ra @@.

Được cái bấm thử website thì thấy load siêu nhanh, chưa tới một giây là thông tin các thứ hiện hết. Quá phê, thả con ảnh trước sau (hình 2,3) để ace tiện đối chiếu nhé. Thế này thì mình gửi gắm nốt 15 em website còn lại cho team Vietnix thôi chứ không cần nghĩ ngợi gì nữa. 10/10.

Nên là:

  1. Anh chị em muốn có một con website tốc độ load nhanh như tốc độ trở mặt của nyc – Dùng ngay dịch vụ hosting của Vietnix
  2. Anh chị em có website rồi muốn tìm bên hosting uy tín, chuyên nghiệp hỗ trợ không quản ngày đêm – Liên hệ ngay Vietnix Trung
  3. Anh chị em quan tâm đến trải nghiệm khách hàng, từ những cái nhỏ nhất như tăng tốc độ website – Better call Vietnix Trung

Và đừng quên dùng pass “HIEUAI_PAGESPEED” để được giảm 20% trọn đời hosting business và wp hosting, quả code này còn được tặng 1 lần tối ưu pagespeed nữa nhé, ưu đãi chắc cũng phải nhất nhì thị trường luôn.
#SEO #Vietnix #hieuai

Website
Trước khi tối ưu
Sau khi tối ưu

Chỉ số tăng trưởng

Điểm Desktop

100 (+43)

Điểm Mobile

100 (+74)

Core Web Vitals

Passed

Lĩnh vực

AI