Tin tức và phân tích của tất cả các thiết bị di động

Cách dễ dàng tạo một chủ đề WordPress tùy chỉnh (không cần bất kỳ mã nào)

Bạn có muốn tạo một chủ đề WordPress tùy chỉnh từ đầu không?

Trước đây, bạn phải theo dõi codex WordPress và có kiến ​​thức mã hóa khá để tạo ra một chủ đề WordPress tùy chỉnh. Nhưng nhờ có các trình tạo chủ đề WordPress mới, giờ đây mọi người có thể tạo một chủ đề WordPress hoàn toàn tùy chỉnh trong một giờ (không cần kiến ​​thức về mã hóa).

Trong bài viết này, chúng tôi sẽ chỉ cho bạn cách dễ dàng tạo một chủ đề WordPress tùy chỉnh mà không cần viết bất kỳ mã nào.

Tạo một chủ đề WordPress tùy chỉnh mà không cần viết bất kỳ mã nào

Tạo một chủ đề WordPress tùy chỉnh cho người mới bắt đầu

Không giống như các trang web HTML tĩnh, chủ đề WordPress là một tập hợp các tệp mẫu được viết bằng PHP, HTML, CSS và JavaScript. Thông thường, bạn sẽ cần có một sự hiểu biết đúng đắn về tất cả các ngôn ngữ thiết kế web này hoặc thuê một nhà phát triển web để tạo một chủ đề WordPress tùy chỉnh.

Nếu bạn thuê một nhà phát triển hoặc đại lý, chi phí của một chủ đề WordPress tùy chỉnh có thể lên tới hàng ngàn đô la.

Vì nhiều chủ doanh nghiệp nhỏ không thể chi trả chi phí cao cho một chủ đề WordPress tùy chỉnh, nhiều người trong số họ chỉ đơn giản giải quyết các chủ đề mặc định đi kèm với WordPress.

Những người không muốn thiết lập và muốn tùy chỉnh, đã sử dụng trình tạo trang kéo và thả WordPress hoặc sử dụng khung chủ đề để tạo chủ đề tùy chỉnh.

Mặc dù các khung chủ đề WordPress giúp dễ dàng tạo chủ đề WordPress, nhưng chúng là một giải pháp cho các nhà phát triển, không phải là chủ sở hữu trang web trung bình.

Mặt khác, các plugin xây dựng trang WordPress giúp dễ dàng tạo bố cục trang tùy chỉnh bằng giao diện kéo và thả, nhưng chúng chỉ giới hạn ở bố cục. Bạn không thể tạo chủ đề tùy chỉnh với nó.

Ngay cả Beaver Builder, một trong những plugin xây dựng trang WordPress tốt nhất đã quyết định giải quyết vấn đề này với plugin có tên Beaver Themer.

Beaver Builder, plugin tạo trang WordPress tốt nhất

Beaver Themer là một plugin xây dựng trang web cho phép bạn tạo các thiết kế chủ đề tùy chỉnh bằng giao diện kéo và thả và không cần học lập trình.

Chúng ta hãy xem cách sử dụng Beaver Themer để dễ dàng tạo một chủ đề WordPress.

Hướng dẫn bằng video

Đăng ký WPBeginner

Nếu bạn không thích video hoặc cần thêm hướng dẫn, hãy đọc tiếp.

Cấu hình Beaver Themer để tạo chủ đề tùy chỉnh

Beaver Themer là một plugin bổ sung cho Beaver Builder, vì vậy bạn sẽ cần cả hai plugin cho bài viết này.

Trước tiên, bạn cần cài đặt và kích hoạt các plugin Beaver Builder và Beaver Themer. Để biết thêm chi tiết, 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.

Beaver Themer cho phép bạn tạo một chủ đề tùy chỉnh, nhưng bạn vẫn sẽ cần một chủ đề để bắt đầu. Chúng tôi khuyên bạn nên sử dụng một chủ đề nhẹ bao gồm một mẫu trang có chiều rộng đầy đủ để hoạt động như chủ đề bắt đầu của bạn.

Bạn có thể tìm thấy nhiều chủ đề này trong thư mục chủ đề WordPress.org. Hầu hết các chủ đề WordPress hiện đại bao gồm một mẫu chiều rộng đầy đủ. Các lựa chọn tốt nhất của chúng tôi là:

  • Astra – Một chủ đề WordPress đa năng miễn phí và nhẹ, đi kèm với hỗ trợ tích hợp cho Beaver Builder.

  • OeanWP – Một chủ đề WordPress đa năng miễn phí phổ biến khác đi kèm với hỗ trợ xây dựng trang đầy đủ.

  • Chủ đề StudioPress: Tất cả các chủ đề của bạn đều tương thích với Beaver Builder và sẽ hoạt động tốt với Beaver Themer.

Vì mục đích của hướng dẫn này, chúng tôi sẽ sử dụng Astra, đây là một chủ đề WordPress nhẹ và dễ tùy chỉnh.

Thiết lập chủ đề của bạn cho Beaver Themer

Khi tạo một chủ đề WordPress tùy chỉnh với Beaver Themer, điều quan trọng là phải đảm bảo rằng Beaver Themer có quyền truy cập vào toàn bộ nội dung của trang (từ cạnh này sang cạnh khác).

Đây là bố cục mặc định của Astra. Như bạn có thể thấy, thiết kế này bao gồm một thanh bên có thể khó hoạt động khi sử dụng Beaver Themer.

Bố cục chủ đề mặc định với một thanh bên

Bạn có thể thay đổi điều đó bằng cách truy cập bảng quản trị của trang web của bạn và sau đó điều hướng đến Ngoại hình »Tùy chỉnh trang. Từ đây, bạn nên chuyển sang Thiết kế »Thanh bên lưỡi.

Vô hiệu hóa barras bên trong chủ đề của bạn

Khi đó, chỉ cần chọn "Không có thanh bên" trong tùy chọn bố cục mặc định và nhấp vào nút Xuất bản để lưu các thay đổi.

Chủ đề của bạn bây giờ sẽ bắt đầu sử dụng bố cục mà không cần barras bên Đây là thiết kế tốt nhất để sử dụng với Beaver Themer.

Thiết kế chủ đề không có barras bên

Bố cục toàn trang này cho phép Beaver Themer sử dụng từng inch trên màn hình, do đó bạn có thể tạo ra trải nghiệm hình ảnh từ đầu đến cuối tuyệt đẹp.

Hầu hết các chủ đề WordPress bao gồm một tệp mẫu cho các trang có chiều rộng đầy đủ. Nếu bạn đang sử dụng một số chủ đề khác, bạn có thể tìm thấy một tùy chọn để loại bỏ barras bên trong cài đặt chủ đề của bạn.

Nếu bạn không thể tìm thấy nó, hãy liên hệ với nhà phát triển chủ đề của bạn và họ có thể giúp bạn điều đó.

Khi bạn đã thiết lập chủ đề của mình theo bố cục toàn chiều rộng, bạn đã sẵn sàng tạo chủ đề WordPress tùy chỉnh của mình với Beaver Themer.

Những điều cơ bản về Beaver Themer

Beaver Themer hoạt động trên Beaver Builder. Là một tiện ích bổ sung cho trình tạo trang, Beaver Builder cho phép bạn kéo và thả các phần tử vào một trang để tạo bố cục tùy chỉnh.

Nó có các yếu tố sau mà bạn có thể sử dụng trong thiết kế của mình:

  • Mẫu – Tập hợp các cột, hàng và mô-đun tạo nên bố cục trang đầy đủ.
  • Cột – mô-đun bố trí dọc giúp căn chỉnh nội dung theo chiều ngang.
  • Hàng: tập hợp ngang của nhiều mô-đun
  • Mô-đun: một yếu tố tạo ra thông tin cụ thể như tiêu đề, khối văn bản, bảng, thư viện, v.v.

Chỉ cần chỉnh sửa một trang trong Beaver Builder và sau đó nhấp vào nút Thêm ở góc trên bên phải. Sau đó, bạn có thể kéo và thả các cột, hàng, mô-đun vào trang của mình và bắt đầu chỉnh sửa chúng ngay lập tức.

Sử dụng Beaver Builder

Nếu bạn không muốn bắt đầu từ đầu, hãy chọn một danh sách các mẫu được tạo sẵn để bắt đầu.

Mẫu Beaver Builder

Beaver Builder cũng cho phép bạn lưu các thiết kế của mình và sau đó sử dụng chúng làm mẫu.

Để biết thêm thông tin, hãy xem bài viết của chúng tôi về cách tạo bố cục trang tùy chỉnh với Beaver Builder.

Tuy nhiên, chúng tôi không chỉ muốn tạo bố cục trang. Chúng tôi muốn tạo ra một chủ đề tùy chỉnh hoàn chỉnh.

Đây là khi Beaver Themer đến.

Thêm một yếu tố khác vào Beaver Builder được gọi là "Themer Layout".

Thiết kế theo chủ đề

Bố cục Themer cho phép bạn tạo bố cục tùy chỉnh cho tiêu đề, chân trang, vùng nội dung, trang 404 và các phần khác của mẫu.

Đây là các khối xây dựng của tất cả các chủ đề WordPress và bằng cách sử dụng chúng, bạn sẽ có thể tạo một chủ đề tùy chỉnh đáp ứng nhu cầu của bạn.

Sử dụng các mẫu Beaver Themer để tạo một chủ đề WordPress tùy chỉnh

Trong các hướng dẫn sau, chúng tôi sẽ hướng dẫn bạn các bước cần thiết để tạo các yếu tố chủ đề tùy chỉnh phổ biến nhất. Khi bạn hoàn thành, bạn sẽ chuyển đổi hoàn toàn chủ đề cơ bản thành chủ đề con WordPress được tùy chỉnh hoàn toàn.

Tạo tiêu đề tùy chỉnh cho chủ đề của bạn

Hãy bắt đầu với khu vực tiêu đề của trang web của bạn. Tiêu đề tùy chỉnh là một thành phần thiết yếu của một chủ đề và việc xây dựng một tiêu đề có thể khó khăn bằng các phương pháp truyền thống.

May mắn thay, Beaver Themer có các tính năng tiêu đề tích hợp. Bạn có thể sử dụng mẫu được tạo sẵn hoặc sử dụng các mô-đun menu và hình ảnh với bố cục hai cột.

Để đến khu vực tiêu đề này, trước tiên, chúng tôi sẽ cần thiết lập bố cục tiêu đề trong Beaver Themer. Ghé thăm Beaver Builder »Thêm mới trang và cung cấp một tiêu đề cho tiêu đề của bạn.

Tạo bố cục tiêu đề tùy chỉnh

Sau đó, chọn "Giao diện người dùng" làm loại và "Tiêu đề" làm tùy chọn bố cục. Khi bạn đã hoàn tất, hãy nhấp vào nút "Thêm thiết kế Themer" để tiếp tục.

Điều này sẽ đưa bạn đến trang cấu hình bố trí. Từ đây, bạn phải chọn "Toàn bộ trang web" làm vị trí nơi mẫu tiêu đề sẽ được hiển thị.

Tùy chọn bố trí

Sau đó nhấp vào nút "Khởi động Beaver Builder" để mở giao diện trình tạo.

Beaver Builder sẽ khởi chạy với một cột cơ bản đơn giản và bố cục tiêu đề hai hàng làm điểm bắt đầu.

Thiết kế tiêu đề

Bạn có thể sử dụng cùng các công cụ kéo và thả của Beaver Builder để thay đổi nền, màu sắc, văn bản, v.v. Bạn cũng có thể thêm các mô-đun khác, tải các mẫu có sẵn và thêm hàng / cột bằng cách nhấp vào nút Thêm ở góc trên bên phải.

Khi bạn hài lòng với thiết kế, nhấp vào nút Xong để lưu hoặc xuất bản thiết kế của bạn.

Bây giờ bạn có thể truy cập trang web của họ để xem tiêu đề của chủ đề tùy chỉnh của bạn đang hoạt động. Như bạn có thể thấy, chúng tôi đã áp dụng bố cục tiêu đề cho chủ đề tùy chỉnh của mình.

Tiêu đề tùy chỉnh trên chủ đề tùy chỉnh của bạn

Ngoài tiêu đề, nó vẫn không hiển thị bất kỳ nội dung nào và có thể bạn sẽ thấy khu vực chân trang của chủ đề cơ sở.

Hãy thay đổi điều này.

Tạo chân trang tùy chỉnh cho chủ đề của bạn

Bạn có thể tạo chân trang tùy chỉnh cho chủ đề của mình bằng Beaver Themer giống như khi bạn tạo tiêu đề tùy chỉnh.

Đi đến Beaver Builder »Thêm mới trang và cung cấp một tiêu đề cho bố trí chân trang của bạn. Sau đó chọn "Giao diện người dùng" làm loại và "Chân trang" làm tùy chọn bố cục.

Bố trí chân trang

Nhấp vào nút "Thêm thiết kế Themer" để tiếp tục.

Điều này sẽ đưa bạn đến trang cấu hình bố trí. Từ đây, bạn phải chọn "Trang web đầy đủ" làm vị trí nơi mẫu sẽ được hiển thị.

Cài đặt bố trí chân trang

Sau đó, nhấp vào nút "Khởi động Beaver Builder" để mở giao diện trình tạo.

Beaver Builder sẽ khởi chạy với bố cục chân trang ba cột. Bạn có thể sử dụng thiết kế này làm điểm bắt đầu và bắt đầu chỉnh sửa.

Chỉnh sửa bố cục chân trang của bạn

Bạn có thể thêm các mô-đun, khối văn bản hoặc bất cứ thứ gì bạn muốn. Bạn luôn có thể thay đổi màu sắc, phông chữ, thêm hình nền và hơn thế nữa.

Khi bạn hài lòng với thiết kế, nhấp vào nút Xong để lưu hoặc xuất bản thiết kế của bạn.

Tạo khu vực nội dung cho bài viết và trang

Bây giờ chúng tôi đã tạo các tiêu đề và chân trang cho mỗi trang và đăng trên trang web, đã đến lúc tạo bài đăng hoặc nội dung của trang (khu vực nội dung).

Chúng ta sẽ bắt đầu giống như cách chúng ta xây dựng đầu trang và chân trang bằng cách thêm bố cục "Số ít" trên trang Thêm mới.

Tạo bài viết và bố cục trang

Sau đó, bạn sẽ chọn nơi để hiển thị thiết kế này. Bạn có thể chọn số ít để sử dụng cho tất cả các bài đăng và các trang riêng lẻ hoặc bạn có thể chọn các bài đăng hoặc chỉ các trang.

Thiết kế thiết kế độc đáo

Sau đó, nhấp vào nút "Khởi động Beaver Builder" để mở giao diện trình tạo.

Phiên bản thiết kế độc đáo

Beaver Builder sẽ tải một bố cục mẫu duy nhất với tiêu đề bài đăng / trang ở trên cùng, theo sau là nội dung, hộp tiểu sử tác giả và khu vực bình luận.

Bạn có thể chỉ và nhấp để chỉnh sửa bất kỳ mục nào trong số này hoặc thêm mô-đun, cột và hàng mới nếu cần.

Khi bạn hài lòng với thiết kế, nhấp vào nút Xong để lưu và xuất bản các thay đổi của bạn.

Bây giờ bạn có thể truy cập trang web của họ để xem nó trong hành động.

Thiết kế chủ đề với nội dung.

Tạo bố cục tệp cho chủ đề tùy chỉnh của bạn

Bây giờ chủ đề tùy chỉnh của bạn đã bắt đầu hình thành, bạn có thể tiếp tục tạo bố cục cho các phần khác của trang web. Các trang lưu trữ là nơi WordPress hiển thị các danh mục, thẻ, tác giả và tệp hàng tháng của bạn.

Hãy tạo một bố cục trang tệp trên chủ đề tùy chỉnh của bạn.

Bạn sẽ bắt đầu bằng cách truy cập Beaver Builder »Thêm mới trang và cung cấp một tiêu đề cho bố cục tập tin của bạn.

Tạo bố cục tệp cho chủ đề tùy chỉnh của bạn

Sau đó, chọn "Bố cục theo chủ đề" làm loại và "Tệp" làm tùy chọn bố cục. Nhấp vào nút "Thêm thiết kế Themer" để tiếp tục.

Điều này sẽ đưa bạn đến trang cấu hình bố trí. Từ đây, bạn phải chọn "Tất cả các tệp" làm vị trí nơi mẫu sẽ được hiển thị. Bạn cũng có thể tạo bố cục riêng cho từng loại tệp riêng lẻ như ngày, kết quả tìm kiếm, danh mục, thẻ, v.v.

Cài đặt bố cục tệp

Sau đó, nhấp vào nút "Khởi động Beaver Builder" để mở giao diện trình tạo.

Beaver Builder sẽ khởi chạy với bố cục tệp cột đơn cơ bản. Nó sẽ hiển thị tiêu đề tập tin ở trên cùng, tiếp theo là bài viết.

Chỉnh sửa bố cục tệp cho chủ đề của bạn

Bạn có thể chỉ và nhấp vào bất kỳ mục nào để chỉnh sửa thuộc tính của nó. Bạn cũng có thể thêm các mô-đun, hàng và cột mới nếu cần.

Sau đó, nhấp vào nút "Xong" để lưu và xuất bản các thay đổi của bạn.

Tạo các thiết kế khác cho chủ đề WordPress tùy chỉnh của bạn

Beaver Themer cũng cho phép bạn tạo bố cục cho các trang khác trong hệ thống phân cấp mẫu, ví dụ: trang 404, phần mẫu, trang kết quả tìm kiếm, v.v.

Sử dụng chức năng kéo và thả tích hợp của Beaver Builder, bạn có thể dễ dàng tạo chủ đề WordPress tùy chỉnh của riêng mình từ đầu mà không phải viết mã. Đây thực sự là phương pháp phát triển chủ đề WordPress thân thiện với người mới bắt đầu nhất hiện có.

Chúng tôi hy vọng bài viết này đã giúp bạn tìm hiểu cách tạo chủ đề WordPress tùy chỉnh mà không cần học cách viết mã. Bạn cũng có thể xem hướng dẫn của chúng tôi về cách tăng tốc trang web WordPress của bạn để có trải nghiệm người dùng và SEO tốt hơn.

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 y Facebook.