Đánh giá CSS Hero: Tùy chỉnh bố cục WordPress thật dễ dàng

Nếu bạn là một trong số nhiều người mới bắt đầu muốn tùy chỉnh thiết kế trang web WordPress của bạn mà không cần chạm vào CSS, bạn sẽ gặp may. Plugin CSS Hero cho WordPress cho phép bạn tùy chỉnh bố cục mà không cần chạm vào một dòng mã nào. Trong bài đánh giá CSS Hero được cập nhật này, chúng tôi chỉ cho bạn cách sử dụng CSS Hero để tùy chỉnh trang web của bạn và lý do tại sao chúng tôi nghĩ rằng đó là một trong những plugin mà mọi người mới bắt đầu WordPress nên thử.

Đánh giá anh hùng CSS

Đánh giá anh hùng CSS của chúng tôi

CSS Hero là một plugin WordPress cao cấp cho phép bạn thiết kế chủ đề WordPress của riêng bạn mà không cần viết một dòng mã (không yêu cầu HTML hoặc CSS).

Nó có khả năng hoàn tác các thay đổi, cực kỳ hữu ích cho người mới bắt đầu. Tất cả các thay đổi được lưu dưới dạng mẫu bổ sung, có nghĩa là bạn có thể cập nhật chủ đề WordPress của mình mà không lo mất các thay đổi.

Nếu bạn là một nhà thiết kế hoặc nhà phát triển thì bạn sẽ thấy CSS Hero là tốt. Nó hoạt động tốt với tất cả các chủ đề và khung WordPress phổ biến. Bạn có thể nhanh chóng thực hiện các thay đổi cho một chủ đề con và sau đó xuất nó để sử dụng trên trang web của khách hàng.

CSS Hero có thể tiết kiệm rất nhiều thời gian và sự thất vọng khi tùy chỉnh thiết kế.

Chúng tôi thường rất nghi ngờ về các tùy chỉnh thiết kế plug-and-click vì kích thước tăng cao của chúng. Nhưng CSS Hero thực sự gây ấn tượng với chúng tôi ngay từ đầu.

Nếu bạn yêu cầu chúng tôi đánh giá CSS Hero trung thực, chúng tôi sẽ xếp hạng 5 trên 5 sao.

Cách sử dụng CSS Hero để tùy chỉnh chủ đề WordPress của bạn

Trước tiên, bạn phải cài đặt và kích hoạt plugin CSS Hero. Để biết thêm thông tin, hãy xem hướng dẫn từng bước của chúng tôi về cách cài đặt plugin WordPress.

Nó là một plugin WordPress cao cấp có giá từ 29 đô la cho một trang web (đáng để đầu tư cho thời gian và rắc rối nó sẽ giúp bạn tiết kiệm).

Sử dụng mã phiếu giảm giá CSS Hero: WPBeginner để được giảm giá đặc biệt 34%. Nếu bạn mua gói PRO, mã tương tự sẽ giảm giá 40% cho bạn.

Khi kích hoạt, bạn sẽ được chuyển hướng để lấy khóa giấy phép CSS Hero. Chỉ cần làm theo các hướng dẫn trên màn hình và bạn sẽ được chuyển hướng đến trang web của mình với một vài cú nhấp chuột.

Mục tiêu của CSS Hero là cung cấp cho bạn giao diện WYSIWG (những gì bạn thấy là những gì bạn nhận được) để chỉnh sửa chủ đề của mình. Chỉ cần truy cập trang web của bạn khi được kết nối và bạn sẽ thấy nút CSS Hero trong trường quản trị viên WordPress.

Nút CSS Hero

Bằng cách nhấp vào nút, trang web của bạn sẽ là bản xem trước trực tiếp. Bây giờ bạn có thể thấy thanh công cụ CSS Hero.

CSS Hero biên tập trực tiếp

Sau đó, chỉ cần nhấp vào bất kỳ mục nào trên trang web của bạn và CSS Hero sẽ hiển thị cho bạn các thuộc tính CSS được sử dụng bởi chủ đề của bạn cho mục cụ thể đó.

thuộc tính phần tử

Chúng sẽ bao gồm các thuộc tính CSS phổ biến cho thành phần được chọn, chẳng hạn như nền, kiểu chữ, đường viền, khoảng cách và hơn thế nữa. Bạn có thể nhấp vào bất kỳ yếu tố nào để mở rộng nó và sau đó chỉnh sửa các thuộc tính CSS bằng giao diện người dùng đơn giản.

Chỉnh sửa tài sản

Khi bạn thực hiện các thay đổi, bạn sẽ nhận thấy rằng CSS tùy chỉnh xuất hiện một cách kỳ diệu bên dưới. Nếu bạn học CSS, sẽ rất hữu ích khi xem các thay đổi CSS khác nhau được áp dụng như thế nào với kết quả trong bản xem trước trực tiếp.

Chỉnh sửa kiểu cho các thành phần khác nhau với CSS Hero

Gặp khó khăn khi tìm hình ảnh miễn phí bản quyền trên trang web của bạn? CSS Hero đi kèm với tích hợp Bapt tích hợp cho phép bạn duyệt, tìm kiếm và sử dụng những bức ảnh đẹp trong thiết kế web của bạn.

Sử dụng hình ảnh miễn phí bản quyền trong thiết kế trang web của bạn

CSS Hero cũng đi kèm với một số trích xuất làm sẵn mà bạn có thể sử dụng trên các yếu tố khác nhau của trang web của mình. Chỉ cần chuyển sang tab Snippets ở cột bên trái.

Đoạn trích anh hùng CSS

Khi bạn thay đổi trang web của mình, CSS Hero sẽ tự động lưu những thay đổi này nhưng không xuất bản chúng. Để áp dụng những thay đổi này cho trang web trực tiếp của bạn, bạn phải nhấp vào nút Lưu & Xuất bản.

Lưu và xuất bản các thay đổi của bạn

Cách hoàn tác các thay đổi trong CSS Hero

Một trong những tính năng tốt nhất của CSS Hero là khả năng hoàn tác mọi thay đổi bạn thực hiện bất cứ lúc nào. CSS Hero theo dõi tất cả các thay đổi bạn thực hiện cho chủ đề của mình. Chỉ cần nhấp vào nút lịch sử trên thanh công cụ CSS Hero để xem danh sách các thay đổi.

Câu chuyện anh hùng CSS

Bạn có thể nhấp vào một ngày và thời gian để xem trang web của bạn trông như thế nào sau đó. Để trở về trạng thái đó, lưu hoặc tiếp tục chỉnh sửa từ thời điểm đó.

Điều này không có nghĩa là những thay đổi bạn thực hiện sau thời điểm đó sẽ biến mất. Chúng vẫn sẽ được lưu trữ và bạn cũng có thể quay lại thời điểm đó. Không có gì dễ dàng hơn thế.

Nhưng nếu bạn chỉ muốn quay lại những thay đổi bạn đã thực hiện cho một bài viết cụ thể thì sao?

Trong trường hợp đó, bạn không cần sử dụng công cụ lịch sử. Chỉ cần nhấp vào mục bạn muốn quay lại, và sau đó nhấp vào nút đặt lại.

Đặt lại một bài viết

Điều này sẽ thay đổi mục thành cài đặt mặc định được xác định bởi chủ đề WordPress của bạn.

Tùy chỉnh trang web của bạn cho các thiết bị di động trong CSS Hero

Khía cạnh thách thức nhất của thiết kế web là khả năng tương thích thiết bị. Bạn cần đảm bảo rằng trang web của bạn trông giống như tuyệt vời trên tất cả các thiết bị và kích thước màn hình. Các nhà thiết kế web sử dụng các công cụ khác nhau để kiểm tra khả năng tương thích với trình duyệt và thiết bị. May mắn cho bạn, CSS Hero đi kèm với một công cụ xem trước tích hợp.

Chỉ cần nhấp vào biểu tượng máy tính để bàn trong thanh công cụ CSS Hero, sau đó nhấp vào loại thiết bị. Bạn có thể chọn giữa các thiết bị di động, máy tính bảng và máy tính để bàn. Khu vực xem trước sẽ được thay đổi thành thiết bị đã chọn của bạn.

Chỉnh sửa ở các chế độ thiết bị khác nhau

Bây giờ bạn có thể chỉnh sửa trang web của mình trong khi xem trước nó cho các thiết bị di động. Công cụ này đặc biệt hữu ích để thay đổi bố cục của chủ đề điện thoại di động và máy tính bảng của bạn.

Hỗ trợ chủ đề CSS Hero

Trang web CSS Hero chính thức có một danh sách ngày càng nhiều các chủ đề tương thích. Danh sách này chứa nhiều chủ đề WordPress miễn phí tốt nhất. Nó cũng có các chủ đề cao cấp phổ biến nhất từ ​​các cửa hàng như CSSIgniter, Themify, StudioPress và nhiều hơn nữa.

Làm thế nào về các chủ đề không có trong danh sách tương thích chủ đề?

CSS Hero đi kèm với một tính năng gọi là Tự động phát hiện trong Chế độ tên lửa. Nếu bạn sử dụng một chủ đề không có trong danh sách tương thích chủ đề, CSS Hero sẽ tự động bắt đầu sử dụng chế độ tên lửa.

Chế độ tên lửa cố gắng tự đoán các bộ chọn CSS cho chủ đề của bạn. Điều này hoạt động hoàn hảo cho hầu hết các phần. Nếu chủ đề của bạn tuân theo các tiêu chuẩn mã hóa WordPress, bạn có thể chỉnh sửa hầu hết mọi thứ.

Bạn cũng có thể liên hệ với nhà phát triển chủ đề của mình và yêu cầu họ cung cấp hỗ trợ CSS Hero.

Những plugin nào tương thích với CSS Hero?

CSS Hero thường xuyên được kiểm tra với các plugin WordPress tốt nhất để tương thích. Điều này bao gồm các plugin biểu mẫu liên hệ, người xây dựng trang phổ biến, WooC Commerce và những người khác.

Nếu bạn đang sử dụng một plugin WordPress tạo đầu ra CSS Hero không thể chỉnh sửa, bạn có thể yêu cầu tác giả plugin sửa nó. Họ thực sự không phải làm gì nhiều để cung cấp khả năng tương thích CSS Hero.

Chúng tôi hy vọng bạn thấy bài đánh giá CSS Hero hữu ích. Bạn cũng có thể xem hướng dẫn dứt khoát của chúng tôi về cách cải thiện tốc độ và hiệu suất mới của WordPress.

Nếu bạn thích bài viết này, đăng ký kênh của chúng tôi YouTube để xem video hướng dẫn WordPress. Bạn cũng có thể tìm thấy chúng tôi tại Twitter và Facebook.