Th6 09, 2022 Show
Hai G. 5ít nhất Đọc  Trong bài hướng dẫn này, chúng tôi sẽ chỉ bạn cách chèn CSS vào WordPress. Có 3 cách để chèn CSS riêng (custom CSS) trong WordPress:
Ngoài ra, để bạn hiểu rõ tường tận, chúng tôi còn giải thích CSS là gì trước, để sau cùng bạn có thể biết rõ mình đang làm gì. Việc sử dụng CSS sẽ giúp bạn tăng kỹ năng xây dựng website, điều chỉnh một số element nhất định, và tự làm được website thân thiện người dùng, bắt mắt hơn. Hãy bắt đầu thôi!
CSS là gì?Cách 1 — Chèn Custom CSS WordPress bằng PluginsCascading Style Sheet, có thể hiểu CSS đơn giản như sau:
Sửa lỗi thông dụng của Custom CSS WordPress Cách 1 — Chèn Custom CSS WordPress bằng PluginsLựa chọn 2 — Chèn Custom CSS vào WordPress bằng Theme CustomizerPlugins › Add New trong trang admin WordPress. Cách 3 — Chèn CSS vào WordPress bằng Child ThemeSửa lỗi thông dụng của Custom CSS WordPress Lời kếtAppearance › Custom CSS. Cách sử dụng vô cùng đơn giản. Điền bất kỳ giá trị nào bạn cần trong editor và lưu lại là xong. CSS, viết tắt của Cascading Style Sheet, có thể hiểu CSS đơn giản như sau: CSS mô tả, định dạng, bố cục thành phần của HTML hiển thị như thế nào trên màn hình, website, hoặc trên các phương tiện media khácCSS tiết kiệm thời gian định dạng, vì nó có thể điều khiển bố cục, màu sắc, màu chữ,… của nhiều trang web cùng một lúc. Bạn có thể tìm hiểu thêm về Inline CSS, External CSS và Internal CSS tại bài viết này. Vì đóng vai trò lớn trong định hình phong cách của website, CSS rất quan trọng trong việc thiết kế website. Và khi bạn muốn website của mình không giống của bất kỳ ai, độc đáo và độc nhất trên internet, cũng là lúc bạn cần phải tìm hiểu thêm cách chèn Custom CSS (CSS riêng) vào website của bạn. Trong bài hướng dẫn này, chúng tôi sẽ chỉ bạn 3 cách để chèn CSS vào WordPress, CMS mã nguồn mở lớn nhất thế giới hiện nay. Cách dễ dàng nhất để chèn Custom CSS vào WordPress là bằng plugin. Nói đến WordPress plugin thì bạn sẽ có rất nhiều lựa chọn, chúng tôi sẽ giới thiệu vài plugin custom CSS WordPress phổ biến nhất, và đều có thể cài trong mục Plugins › Add New trong trang admin WordPress.từng bài viết nếu cần. Simple Custom CSS Đây là một plugin WordPress custom CSS phổ biến nhất. Nó giúp chỉnh styles và ghi đè lên CSS hiện hành của theme. Giá trị được thiết lập trong đây cũng sẽ vẫn giữ nguyên khi thay đổi theme.Khi được kích hoạt, tool này sẽ hiện trong mục Appearance › Custom CSS. Cách sử dụng vô cùng đơn giản. Điền bất kỳ giá trị nào bạn cần trong editor và lưu lại là xong. Sau đó, bạn sẽ thấy thay đổi bằng cách refresh trang web.Appearance › Custom CSS. WP Add Custom CSS Một tool mạnh mẽ khác để chèn CSS vào WordPressKhi cài đặt xong, nó sẽ hiện ra một mục riêng trong dashboard. Tại đó, bạn có chỉnh custom css riêng cho bạn và áp dụng CSS vào toàn bộ trang. Điểm tiện lợi là bạn cũng nhìn thấy Custom CSS WordPress editor dưới mỗi bài viết. Vì vậy bạn có thể chèn nhiều CSS khác nhau vào từng bài viết nếu cần. Cuối cùng là xem lại thay đổi bằng cách tải lại trang:h2. Site Origin CSS Lựa chọn 2 — Chèn Custom CSS vào WordPress bằng Theme CustomizerCách 3 — Chèn CSS vào WordPress bằng Child ThemeAppearance › Customize trong dashboard. Sửa lỗi thông dụng của Custom CSS WordPressAdditional CSS. Lời kết CSS, viết tắt của Cascading Style Sheet, có thể hiểu CSS đơn giản như sau: Cách 3 — Chèn CSS vào WordPress bằng Child ThemeSửa lỗi thông dụng của Custom CSS WordPress Sửa lỗi thông dụng của Custom CSS WordPressĐôi khi, bạn có thể gặp nhiều vấn đề nhỏ khi chèn CSS vào WordPress. Hãy xem qua các lỗi thông dùng nhất và làm thế nào để xử lý chúng. Thay đổi không được hiển thịCustom CSS WordPress có thể bị áp dụng thất bại vì cache. Nếu bạn đang có cài caching pluing nào, các thay đổi có khi không được áp dụng ngay mà nếu muốn thấy thay đổi ngay phải xóa WordPress cache. Hãy xem bài hướng dẫn này để biết cách xóa cache. Một giải pháp khác là tạm thời vô hiệu plugin cache đi. Nếu bạn cũng đang cài browser caching để tăng tốc website, vậy thì chỉ cần xóa cache đi như hướng dẫn ở trên là đủ. Ngoài ra một số nhà cung cấp hosting cũng có công cụ tự động lưu cache để tăng hiệu năng cho WordPress site của bạn, như là Hostinger. Plugin caching đã được tích hợp vào wordpress và cần tạm thời vô hiệu trong mục Plugins › Installed Plugins › Must-Use . Plugins › Installed Plugins › Must-Use . Misspelled CSS Syntax – Lỗi cú pháp CSSLỗi cú pháp thường dễ mắc phải nên custom CSS sẽ không hiển thị đúng. Nếu bạn thấy trang web hiển thị không đúng mà lại không do cache, hãy sử dụng CSS validator để rà soát lỗi. Chỉ cần dán code CSS vào và chạy. Nó sẽ hiện lỗi lên cho bạn, hoặc các lỗi đánh máy sẽ hiện ra. Quá nhiều lựa chọnĐôi khi trường hợp bạn sử dụng custom CSS wordpress quá đà. 2 hoặc nhiều lựa chọn của một thành phần mà được gán trùng nhau sẽ gây ra xung đột. Vì CSS không thể biết được bạn muốn dùng cái nào, giá trị nào. Lỗi này thường gặp khi gọi stylesheet lên trên một stylesheet đã có sẵn. Nếu bạn thử thay đổi h2 heading mà không có gì xảy ra, hãy kiểm tra lại style sheet cho entries cũ.. Không có ý tưởngMặc dù đây không phải là lỗi, nhưng có rất nhiều trường hợp phần khó khăn nhất là sử dụng custom CSS nào cho WordPress. Vì có quá nhiều lựa, bạn có thể lúng túng dẫn đến … nhứt đầu hoa mắt, nhưng đừng lo, cứ xem qua những trang sau để dùng một vài ý tưởng hay ho của những người đi trước là được:
Lời kếtTóm lại, chèn CSS vào WordPress là việc mà ai quản lý WordPress cũng đã từng làm hoặc sẽ làm, vì nó tạo cho WordPress một bố cục độc đáo và duy nhất theo phong cách riêng. Chúng ta đã học cách làm thế nào để chèn custom CSS vào WordPress bằng plugin, bằng công cụ có sẵn và bằng child theme trong bài hướng dẫn này. Ngoài ra chúng tôi còn nêu các lỗi thường gặp khi đụng tới custom CSS. Nếu bạn thấy bài này hữu dụng, hãy share nó lên Facebook, Twitter nhé ;). Ngoài ra, nếu bạn có bất kỳ thủ thuật nào khác hay ho, hãy chia sẽ cùng với mọi người ở phần bình luận nhé! Hải G. là chuyên gia quản lý, vận hành các dịch vụ website. Anh có nhiều năm kinh nghiệm về VPS, Hosting, technical SEO, CMS. Đặc biệt yêu thích WordPress và đã dùng nó hơn 5 năm nay. Sở thích của anh là đọc, viết blog, đi du lịch và tư vấn cho các bạn trẻ khởi nghiệp. |
