Khi nói đến việc làm cho một trang web trông chính xác theo cách bạn muốn, số lượng chủ đề WordPress có sẵn là một lợi ích thực sự! Và nếu bạn dành đủ thời gian tìm kiếm, bạn có thể tìm thấy một chủ đề hoàn hảo cho trang web của mình. Tuy nhiên, có một cơ hội là ngay cả khi bạn đến gần với những gì bạn muốn, có lẽ bạn vẫn hơi mất liên lạc. Một chủ đề được xác định trước có thể thực sự đáp ứng nhu cầu của cá nhân lên đến T không? Giáo dục
Phải làm gì nếu bạn đã tìm thấy một chủ đề phù hợp với nhu cầu của mình nhưng vẫn cần thực hiện một số thay đổi? Tất nhiên có kỹ năng không phải là vấn đề, bạn có thể thay đổi nó theo ý muốn. Nhưng nếu bạn không tự tin thay đổi các tập tin cần thiết thì sao?
Hôm nay tôi muốn giới thiệu với bạn một plugin rất hữu ích: CSS Hero, một plugin cho phép bạn thực hiện các điều chỉnh trực quan nhỏ hoặc thậm chí tương đối lớn: mà không cần phải chạm vào một dòng mã!
Anh hùng CSS là gì?
CSS Hero là một plugin tùy biến chủ đề (xem các tính năng)
Do đó, nó chiếm không gian tương tự như các plugin kéo và thả cho người tạo trang. Tuy nhiên, nếu người xây dựng trang khuyến khích bạn tạo bố cục tùy chỉnh từ đầu, bạn có thể sử dụng CSS Hero để tùy chỉnh chủ đề WordPress hiện tại theo ý thích của mình.
Bằng cách này, bạn có thể chơi như một nhà phát triển mà không cần các kỹ năng phát triển chung. Tiếp tục sử dụng chủ đề WordPress được thiết kế chuyên nghiệp, được thiết kế chuyên nghiệp của bạn, chứ không phải ai đó khởi chạy các mô-đun và plugin ngẫu nhiên để tạo trang và thực hiện các thay đổi nhỏ cho nhu cầu của bạn.
Các bài viết trên trang web không bị cấm; bạn có thể tùy chỉnh mọi thứ và mọi thứ. CSS Hero chuyển đổi các tùy chỉnh của bạn thành mã CSS chính xác, sau đó được sử dụng trong biểu định kiểu CSS mới (biểu định kiểu gốc được giữ nguyên để tránh các sự cố trong tương lai).
CSS Hero cũng hoạt động với bất kỳ chủ đề WordPress nào. Những chủ đề đã được kiểm tra rộng rãi về tính tương thích sẽ được đặt tên, trong khi các chủ đề chưa được kiểm tra tiếp tục tương thích.
giá cả
CSS Hero là một plugin cao cấp giá cả phải chăng. Để phản ánh sự cạnh tranh của bạn, Carillo ngang hàng với các plugin Trình tạo trang phổ biến nhất.
Một giấy phép cơ bản có giá chỉ 29 đô la và cung cấp cho bạn quyền truy cập vào plugin CSS Hero đầy đủ (mặc dù bạn chỉ có thể sử dụng nó trên một trang web).
Nếu bạn muốn sử dụng CSS Hero trên nhiều trang, bạn có thể:
Như bạn có thể tưởng tượng, giấy phép nhằm vào các cơ quan sáng tạo và nhà phát triển chuyên nghiệp. Cả giấy phép và giấy phép cũng bao gồm quyền truy cập vào plugin cao cấp Inspector Pro. Chúng tôi sẽ đề cập chi tiết hơn về điều này sau trên trang này.
Tất cả ba giấy phép CSS Hero đều có giá trị trong một năm, cung cấp quyền truy cập vào các bản cập nhật và hỗ trợ trong một năm và đi kèm với bảo đảm hoàn lại tiền trong 30 ngày.
sớm
Sau khi mua, bạn sẽ được chuyển hướng đến bảng điều khiển CSS Hero. Từ đó, bạn có thể truy cập tài liệu mở rộng của plugin, ngoài Học viện anh hùng CSS ấn tượng. Học viện là một liên lạc tốt đẹp với một loạt các video hướng dẫn cho người mới bắt đầu để giúp bạn tận dụng tối đa plugin mới của mình (tôi rất thích xem các plugin nâng cao khác theo ví dụ này).
Bảng điều khiển thực hiện một tính năng quan trọng khác: tại đây bạn tải xuống CSS Hero và, tùy thuộc vào cấp độ giấy phép, các plugin Inspector Pro.
Đăng nhập vào bảng điều khiển WordPress của bạn để tải xuống đầy đủ. Truy cập >> và làm theo hướng dẫn để tải các tệp ZIP của plugin và bật plugin. Nếu bạn đã cài đặt một plugin WordPress, bạn rất quen thuộc với tất cả điều này.
Tuy nhiên, cài đặt CSS Hero yêu cầu một bước khác: xác minh. Nhấp vào nút màu xanh và làm theo hướng dẫn trong khi đăng ký một trong các giấy phép của bạn. Càng xa càng tốt.
CSS Hero hiện là một công cụ và như vậy được chỉnh sửa ở mặt trước nơi bạn có thể thấy những thay đổi trong thời gian thực. Khi bạn mở mặt trước của trang web, một biểu tượng màu xanh mới sẽ xuất hiện ở góc trên bên phải màn hình. Nhấn vào đây để sử dụng plugin mới của bạn.
Trình chỉnh sửa CSS Hero
Sau khi nhấp vào biểu tượng màu xanh, hãy đợi vài giây để CSS Hero bật. Khi plugin được bật, bây giờ bạn có thể bắt đầu thiết kế và tùy chỉnh trang web của mình.
Đầu tiên, nhấp vào biểu tượng màu xanh ở đầu nút radio. Nếu bạn không chắc chắn cách tiến hành, plugin cung cấp các liên kết hữu ích cho tất cả các điều cơ bản. Tuy nhiên, khi bạn sẵn sàng lao vào, bạn có thể bắt đầu điều chỉnh và chỉnh sửa tất cả các yếu tố trên trang của mình.
Cuộn qua chủ đề bạn muốn chỉnh sửa và sau đó nhấp (hãy bắt đầu với phần nội dung tương đối đơn giản, như trong ảnh chụp màn hình sau). Sau khi nhấp, CSS Hero khóa mục của bạn để bạn có thể bắt đầu tùy chỉnh nó.
Để làm cho quá trình dễ dàng nhất có thể, CSS Hero cung cấp cho bạn một danh sách các tùy chọn tùy chỉnh tùy thuộc vào loại mục được chọn. Sau khi chọn một đoạn, bạn có thể thay đổi phông chữ, hình nền và khung và đặt phần tô màu xung quanh văn bản.
Các yếu tố rất dễ chỉnh sửa vì mọi thứ được điều khiển thông qua thanh menu bên phải và các thay đổi được hiển thị trong thời gian thực. Đầu tiên, tôi quyết định tập trung vào các thuộc tính của văn bản. Khi tùy chọn này được chọn, CSS Hero sẽ hiển thị tất cả các tùy chọn cấu hình văn bản có sẵn, bao gồm:
- Phông chữ: chọn từ tất cả các phông chữ Google có sẵn
- Màu phông chữ
- cỡ chữ
- trọng lượng phông chữ
- căn chỉnh văn bản
- Chuyển đổi văn bản: ví dụ chữ hoa
- Khoảng cách từ
- chiều cao giữa các dòng
Thực hiện các thay đổi mong muốn và xem cách văn bản được áp dụng một phần của giây sau.
Sau đó, bạn có thể quay lại và đặt nền cho phần của bạn. Ở đây cũng vậy, CSS Hero cung cấp cho bạn toàn quyền kiểm soát. Bạn có thể tải lên một hình ảnh tùy chỉnh, chọn màu hoặc đặt một gradient để hiển thị làm nền.
Nó cũng có cài đặt lề tương tự với sự linh hoạt hoàn toàn về kiểu khung, chiều rộng và màu sắc.
Thậm chí có một số kiểu cài sẵn thú vị, như lật văn bản vào nút hoặc hiển thị nền hoàn thành trong các bố cục thú vị khác nhau.
Nếu bạn không muốn làm việc với các thay đổi trong một phần cùng một lúc, bạn cũng có thể chọn tùy chọn hiển thị tất cả các tùy chọn tùy chỉnh trên một màn hình thuận tiện.
Hoàn tác thay đổi
Khi bạn thay đổi văn bản, CSS Hero sẽ áp dụng chúng cho phiên bản trực tiếp của trang web của bạn. Đừng lo lắng về những thay đổi vĩnh viễn ngay bây giờ: Trước khi áp dụng các thay đổi, bạn có thể xóa chúng bằng cách nhấp vào chúng hoặc nhấn nút.
Tuy nhiên, ngay cả sau khi nhấn, bạn không bị mắc kẹt với những thay đổi không mong muốn. Để quay lại bản gốc, quay lại cấp cao nhất của menu CSS Hero, điều hướng đến phần và chọn tùy chọn.
Cũng có thể đặt lại một mục duy nhất về cài đặt gốc: chỉ cần nhấp vào mục bạn muốn khôi phục và sau đó nhấp vào biểu tượng nhỏ Reset Reset ở bên phải của menu. Nhấn Confirm và yếu tố nổi loạn của bạn sẽ được khôi phục lại vinh quang trước đây.
Như đã đề cập, tất cả các cài đặt được áp dụng cho một biểu định kiểu. Trong trường hợp xấu nhất, biểu định kiểu gốc cho bài viết của bạn được giữ nguyên. Điều này có nghĩa là bất kể thay đổi nào bạn thực hiện với CSS Hero, không có tác hại lâu dài nào có thể được thực hiện. Nếu tất cả các cài đặt khôi phục khác không thành công, bạn có thể khôi phục chủ đề mặc định và ngủ dễ dàng.
Chỉnh sửa một chủ đề
Một trong những điểm mạnh của CSS Hero là bạn có thể chỉnh sửa bất kỳ yếu tố nào trên trang của mình, bất kể nó lớn hay nhỏ.
Bằng cách nhìn vào hình ảnh tổng thể, bạn có thể chỉnh sửa hình nền, kiểu thanh bên và khu vực chân trang của trang web của bạn.
Điều này được thực hiện bằng cách sử dụng cùng một quy trình mà chúng tôi sử dụng để xử lý phần của chúng tôi. Tuy nhiên, nó cho thấy rằng CSS Hero có thể được sử dụng để thực hiện các thay đổi cơ bản cho tính thẩm mỹ của trang web của bạn. Xem ảnh chụp màn hình bên dưới nơi tôi đã thay đổi nền của thanh bên, thay đổi kiểu tiêu đề tiện ích và cấu hình lại khu vực. Đây là hình ảnh cơ bản:
Và đây là sự phù hợp của tôi: Tôi không phải là nhà thiết kế, tôi thừa nhận điều đó, nhưng chỉ mất vài giây.
Bạn cũng có thể tùy chỉnh các chủ đề nội dung nhỏ, chẳng hạn như hình ảnh, màu liên kết và kiểu danh sách. Danh sách kiểu đặc biệt thú vị vì bạn có thể chọn bóng tùy chỉnh trong phần tương ứng. Sáu viên đạn làm mát được hỗ trợ, bao gồm hình vuông, số thập phân và chữ số La Mã. Bạn cũng có thể tải lên các biểu tượng tùy chỉnh của riêng mình để có giao diện cá nhân hơn. Note để có được.
Hy vọng rằng điều này sẽ cung cấp cho bạn một ý tưởng về cách kiểm soát thiết kế trang web của bạn. Chủ đề WordPress của bạn là nền tảng, nhưng nhờ CSS Hero, bạn có thể tùy chỉnh mọi pixel trên trang web của mình theo ý thích mà không cần chạm vào một dòng mã.
Thêm tính năng
CSS Hero có một số tính năng thú vị khác mà tôi muốn thu hút sự chú ý.
Đầu tiên là vậy. Với sự tập trung ngày càng tăng vào thiết kế đáp ứng, điều quan trọng là trang web của bạn hoạt động trơn tru trên các thiết bị ở mọi hình dạng và kích cỡ. CSS Hero có tính năng tích hợp cho phép bạn xem trang web của mình trên máy tính để bàn, máy tính bảng và thiết bị di động.
Chỉ cần chọn chế độ xem ưa thích của bạn từ thanh công cụ (đây là tùy chọn thứ hai) và để CSS Hero thay đổi kích thước màn hình của bạn thành kích thước phù hợp. Đây là một cách tuyệt vời để kiểm tra những thay đổi bạn đã thực hiện trên các thiết bị nhỏ hơn.
Tiếp theo, chúng ta có chức năng quan trọng. Mỗi lần bạn nhấn nút, CSS Hero sẽ lưu ảnh chụp nhanh trang web của bạn. Những ảnh chụp nhanh này có thể được xem và khôi phục chỉ bằng một nút bấm, điều đó có nghĩa là công việc khó khăn của bạn không bao giờ bị lãng phí. Bạn có thể nhảy qua lại trong thời gian.
Cuối cùng, chúng ta có tùy chọn có sẵn trong phần. Điều này cho phép bạn xuất CSS đã chỉnh sửa của mình để sử dụng ở nơi khác hoặc chỉ cần tải nó lên màn hình để kiểm tra các thay đổi bạn đã thực hiện (một trong những cách tốt nhất để tìm hiểu CSS).
Plugin Inspector Pro
Những người bạn đã cập nhật kế hoạch của họ hoặc đã bao gồm plugin CSS Hero Inspector Pro trong giấy phép của họ.
Inspector Pro đã được công bố vào tháng 5 năm 2015 và gần đây đã bỏ phiên bản beta. Nó được dành cho người dùng CSS nâng cao. Mặc dù CSS Hero là một công cụ không đòi hỏi kiến thức về CSS, Inspector Pro được thiết kế cho những người muốn tùy chỉnh trang web của họ bằng cách tùy chỉnh trực tiếp CSS.
Inspector Pro hiển thị CSS cho chủ đề của bạn trong bản xem trước trực tiếp. Bạn có thể chỉnh sửa mã này theo ý muốn và những thay đổi của bạn sẽ được hiển thị. Khả năng chỉnh sửa CSS trực tiếp giúp bạn kiểm soát hoàn toàn các cài đặt, từng pixel theo từng plugin, với plugin này.
Tuy nhiên, Inspector Pro cũng cung cấp một số tính năng hữu ích để bạn không bao giờ cô đơn. Ví dụ: bạn có thể sử dụng chức năng tìm kiếm tiện dụng để chuyển đến một dòng cụ thể hoặc vô hiệu hóa các dòng loại nhất định để các phần tử chồng lấp không bị thay đổi.
Nếu bạn viết lại CSS của mình từ đầu, bạn sẽ thích plugin này vì bạn không còn phải chuyển từ cửa sổ này sang cửa sổ khác; bạn có thể thực hiện và xem tất cả các thay đổi của mình trên một màn hình. Hầu như!
Hỗ trợ anh hùng CSS
Từ thời điểm bạn đăng nhập vào bảng điều khiển CSS Hero, bạn có thể thấy các nhà phát triển cố gắng giúp bạn tận dụng tối đa plugin của mình như thế nào.
Tôi đã đề cập đến tài liệu mở rộng và Học viện anh hùng CSS (học viện vẫn còn ở giai đoạn sơ khai, nhưng có kế hoạch cụ thể để tiếp tục mở rộng).
Hai phần này rất toàn diện và học viện chứa các video hướng dẫn hữu ích. CSS Hero thoạt nhìn có vẻ khó khăn, vì vậy những hướng dẫn bằng video ngắn này rất hữu ích trong việc tìm kiếm đôi chân của tôi. Vì vậy, các plugin cảm thấy tương đối đơn giản.
Ngoài ra còn có một phần tài liệu mở rộng được gọi là. Điều này dành cho các nhà phát triển plugin / chủ đề thực hiện các bước cần thiết để đảm bảo các sản phẩm của họ tương thích hoàn toàn với CSS Hero, tức là H. sẵn sàng làm anh hùng.
Ngoài ra còn có một diễn đàn hỗ trợ cho những người vẫn không thể giải quyết vấn đề của họ mặc dù có tài liệu chi tiết. Nhân viên hỗ trợ CSS Hero thường có sẵn để trả lời các câu hỏi trong vài giờ. Giấy phép cho phép bạn truy cập vào diễn đàn và nhóm hỗ trợ trong một năm.
Nhìn chung, CSS Hero không thể đổ lỗi cho những nỗ lực hỗ trợ của nó. Các hướng dẫn được ghi lại và ghi trước rất hữu ích và được phân phối trong toàn bộ trải nghiệm người dùng, nơi rất có thể cần thiết.
Khi các plugin WordPress trở nên tinh vi hơn, tôi muốn nhiều nhà phát triển đi theo sự dẫn dắt của CSS Hero và ngay lập tức cung cấp nhiều hỗ trợ hơn để người dùng thiếu kinh nghiệm không bao giờ cảm thấy xa tầm tay.
Suy nghĩ cuối cùng
Nhìn chung, tôi rất ấn tượng với CSS Hero. Với tiềm năng tùy biến không giới hạn, plugin này có thể dễ dàng bị áp đảo. Tuy nhiên, do giao diện người dùng thông minh và trực quan (và hướng dẫn hữu ích), nó rất dễ sử dụng mọi lúc.
Các tùy chọn tùy chỉnh là vô tận và cho phép bạn thay đổi chủ đề của mình theo bất kỳ cách nào có thể. Bằng cách này, bạn có thể tạo một số thiết kế độc đáo và thú vị sử dụng những điều cơ bản của chủ đề và mọi thứ mà không bị bẩn với mã.
Tuy nhiên, CSS Hero không dành cho lập trình viên sở thích. Inspector Pro là một công cụ thú vị cho các nhà phát triển có kinh nghiệm muốn tạo một trang web từ đầu.
Plugin cho phép bạn hoàn toàn tạo một trang web từ đầu và xem cách tạo của bạn đến với cuộc sống theo từng dòng. Tuy nhiên, thực tế hơn là đơn giản hóa việc phỏng đoán bằng cách tùy chỉnh các chủ đề và để tiết kiệm nhiều thời gian cho các nhà phát triển thực hiện công việc của khách hàng.
Nhìn chung, CSS Hero là một plugin ưu việt nên thực sự thu hút người dùng WordPress ở mọi cấp độ. Nếu bạn chưa có, hãy thử nó!
(Nâng cấp – 16 tháng 3 – CSS Hero đã vui lòng cung cấp cho chúng tôi một cái đặc biệt kể từ khi tôi viết bài đăng này Mã phiếu giảm giá Ủy quyền cho độc giả WinningWP để Giảm giá 40% – Xem biên lai).
