Cách sử dụng Công cụ tùy chỉnh chủ đề WordPress giống như một chuyên gia (Hướng dẫn cơ bản)

Nội dung bài viết

Bạn có biết rằng WordPress đi kèm với một công cụ tùy chỉnh chủ đề tích hợp cho phép bạn dễ dàng thực hiện các thay đổi đối với thiết kế trang web của mình trong thời gian thực.

Mặc dù mọi chủ đề đều có một số mức hỗ trợ cho các tùy chọn tùy biến mặc định, nhưng nhiều chủ đề bao gồm các tab và tùy chọn bổ sung cho tùy biến chủ đề WordPress, vì vậy bạn có thể dễ dàng tùy chỉnh chủ đề của mình mà không cần bất kỳ kiến thức mã hóa nào.

Trong bài viết này, chúng tôi sẽ hướng dẫn bạn qua các bảng mặc định và hướng dẫn bạn cách sử dụng tùy biến chủ đề WordPress như một người chuyên nghiệp.

How to Use WordPress Theme Customizer Ultimate Guide

Cách truy cập Trình tùy chỉnh chủ đề WordPress

Tùy biến chủ đề là một tính năng mặc định của WordPress và nó là một phần của mọi trang web WordPress .

Bạn có thể truy cập nó bằng cách đăng nhập vào khu vực quản trị WordPress của mình, sau đó chuyển đến Giao diện » Tùy chỉnh từ thanh bên trái của bảng quản trị WordPress của bạn. Thao tác này sẽ mở giao diện Customizer với chủ đề hiện tại của bạn.

How to access WordPress Customizer

Bạn cũng có thể sử dụng trang tùy biến chủ đề WordPress cho bất kỳ chủ đề nào đã cài đặt trên trang web của mình ngay cả khi chúng không hoạt động.

Điều này cho phép bạn xem bản xem trước trực tiếp của chủ đề đó và thực hiện các thay đổi trước khi kích hoạt.

Để làm điều đó, bạn cần đi tới trang Giao diện » Chủ đề.

Tiếp theo, di con trỏ chuột của bạn qua bất kỳ chủ đề đã cài đặt nào và nhấp vào nút Xem trước Trực tiếp để mở trang tùy biến chủ đề WordPress.

WordPress Theme Live Preview Option

Cách sử dụng Công cụ tùy chỉnh chủ đề WordPress

Sau khi mở tùy biến chủ đề WordPress, bạn sẽ thấy tất cả cài đặt tùy chỉnh ở bên trái màn hình và bản xem trước trực tiếp của trang web của bạn ở bên phải.

WordPress Theme Customizer

Công cụ tùy biến chủ đề WordPress đi kèm với một tập hợp các bảng mặc định bất kể chủ đề bạn đang sử dụng là gì.

Bạn cần nhấp vào từng bảng để thực hiện thay đổi đối với nó. Bạn cũng có thể nhấp vào bất kỳ biểu tượng bút chì màu xanh lam nào ở bên phải màn hình để mở cài đặt cho mục cụ thể đó.

Lưu ý: các chủ đề WordPress nâng cao sẽ thêm các bảng cài đặt bổ sung để có thêm các tùy chọn tùy chỉnh (thêm về điều này sau).

Hãy xem các tùy chọn mặc định có sẵn trong công cụ tùy biến chủ đề WordPress.

Bảng nhận dạng trang web: Thêm tiêu đề, biểu trưng và biểu tượng yêu thích

Bảng Nhận dạng Trang web trong công cụ tùy chỉnh chủ đề WordPress cho phép bạn thêm hoặc thay đổi tiêu đề và dòng giới thiệu của trang web của mình.

Theo mặc định, WordPress thêm “Just Another WordPress Site” làm dòng giới thiệu của trang web.

Bạn nên thay đổi nó sau khi cài đặt WordPress trên trang web của mình . Bạn cũng có thể giữ nó trống nếu bạn muốn.

Site Identity Settings to change Site title, tagline, logo, and favicon

Bảng Nhận dạng trang web trong công cụ tùy chỉnh chủ đề WordPress cũng cho phép bạn thêm biểu trưng trang web của mình. Chỉ cần nhấp vào tùy chọn Chọn biểu trưng để tải lên biểu trưng của trang web của bạn.

Muốn thêm biểu tượng yêu thích vào trang web của bạn? Bạn có thể làm điều đó bằng cách nhấp vào tùy chọn Chọn biểu tượng trang web. Để có hướng dẫn chi tiết, bạn có thể làm theo hướng dẫn của chúng tôi về cách tạo và thêm biểu tượng yêu thích vào trang web của bạn .

WordPress Theme Customizer: Thay đổi màu sắc trên trang web của bạn

Các điều khiển trên bảng Màu hầu hết sẽ khác nhau tùy thuộc vào chủ đề WordPress bạn đang sử dụng.

Ví dụ: chủ đề Twenty Seventeen cho phép bạn chọn màu văn bản tiêu đề và chọn bảng màu cho toàn bộ trang web của bạn.

Change Colors on Your Website

Các chủ đề WordPress khác có thể cung cấp các tùy chọn màu sắc khác nhau cho các phần tử của trang web như: tiêu đề, liên kết, văn bản nội dung, nền trang web của bạn, v.v.

Thêm menu điều hướng trong tùy biến chủ đề

Bảng Menu cho phép bạn tạo menu điều hướng và kiểm soát vị trí của chúng trên trang web của bạn.

Trên tabl này, bạn sẽ tìm thấy tất cả các menu WordPress hiện có mà bạn đã tạo trước đó. Bạn có thể nhấp vào nút “Xem tất cả các vị trí” để kiểm tra các vị trí menu có sẵn mà chủ đề của bạn hỗ trợ.

Menus Panel in Theme Customizer

Để tạo một menu mới, bạn cần nhấp vào nút Create New Menu .

Sau đó, bạn sẽ cần đặt tên cho menu của mình, để bạn có thể dễ dàng quản lý sau này. Bạn cũng có thể chọn vị trí menu và sau đó nhấp vào Tiếp theo để tiếp tục.

Create a new navigation menu

Để thêm các mục vào menu này, bạn cần nhấp vào nút Thêm Mục để mở bảng điều khiển mới. Giờ đây, bạn có thể thêm các liên kết, trang, bài đăng, danh mục và thẻ tùy chỉnh dưới dạng các mục menu.

Add items to navigation menu

Để sắp xếp lại các mục, bạn có thể nhấp vào liên kết Sắp xếp lại và sau đó sử dụng các biểu tượng mũi tên để điều chỉnh các mục trong menu.

Kiểm soát các widget trên trang web của bạn trong Theme Customizer

Bảng Tiện ích cho phép bạn thêm và quản lý các tiện ích trên trang web của mình.

Nhấp vào nó sẽ hiển thị cho bạn các vị trí khác nhau mà bạn có thể thêm các widget. Điều này sẽ khác nhau tùy thuộc vào chủ đề bạn đang sử dụng.

Ví dụ: chủ đề Twenty Seventeen cung cấp 3 vị trí widget, trong khi chủ đề Twenty Nineteen chỉ có một vị trí.

Widgets panel

Khi bạn nhấp vào bất kỳ một trong số chúng, bạn sẽ thấy các tiện ích mà trước đó bạn đã thêm vào vị trí đó.

Để thêm một widget mới, bạn cần nhấp vào nút “Add a Widget”. Thao tác này sẽ mở ra một bảng điều khiển mới, nơi bạn sẽ thấy danh sách tất cả các tiện ích có sẵn.

Add Widgets to your site

Bạn cần nhấp vào một cái mà bạn muốn thêm. Bạn cũng có thể thực hiện các thay đổi đối với các tiện ích con mới được thêm vào và điều chỉnh vị trí của nó bằng cách kéo chúng lên hoặc xuống.

Bảng cài đặt trang chủ trong Bộ tùy chỉnh chủ đề

Theo mặc định, WordPress hiển thị các bài đăng blog mới nhất trên trang chủ của bạn.

Tuy nhiên, đối với các trang web kinh doanh, người dùng thích sử dụng một trang chủ tùy chỉnh. Nó cho phép bạn có một trang đích phù hợp để hiển thị các sản phẩm và dịch vụ của bạn.

Để sử dụng trang chủ tùy chỉnh, bạn cần chọn nút radio “Trang tĩnh” trên bảng Cài đặt Trang chủ.

Homepage Settings in theme customizer

Thao tác này sẽ mở ra hai menu thả xuống mới mà bạn có thể sử dụng để chọn một trang cho trang chủ của mình và một trang khác để hiển thị các bài đăng trên blog của bạn.

Trong trường hợp bạn không có các trang trên trang web của mình, bạn có thể tạo một trang mới bằng cách nhấp vào liên kết “+ Thêm trang mới” có bên dưới trình đơn thả xuống. Thao tác này sẽ tạo ra một trang trống với tên bạn chọn.

Bảng điều khiển CSS bổ sung để thêm CSS tùy chỉnh

Bạn có muốn thêm mã CSS tùy chỉnh để tạo kiểu cho trang web của mình không? Bạn có thể làm điều đó trong bảng CSS bổ sung.

Người dùng WordPress trung cấp và nâng cao thường tùy chỉnh trang web của họ bằng cách thêm mã CSS trực tiếp vào tệp style.css trong chủ đề của họ. Điều này bổ sung các bước bổ sung như có quyền truy cập FTP vào lưu trữ WordPress của bạn, sửa đổi tệp chủ đề, v.v.

Một giải pháp dễ dàng hơn cho người mới bắt đầu là thêm mã CSS tùy chỉnh của bạn vào bảng CSS bổ sung trong tùy biến chủ đề WordPress. Điều này sẽ cho phép bạn thực hiện các thay đổi đối với trang web của mình và xem chúng trực tiếp ở bên phải màn hình của bạn.

Add Custom CSS code to Additional CSS pane;

Khi bạn bắt đầu viết một số mã CSS, WordPress sẽ tự động đề xuất các thuộc tính cho bạn dựa trên các chữ cái bạn nhập. Nó cũng sẽ hiển thị thông báo lỗi nếu bạn chưa viết câu lệnh CSS thích hợp.

Lưu ý: Nếu bạn muốn tùy chỉnh trang web của mình mà không cần viết bất kỳ mã nào, hãy tiếp tục đọc. Chúng tôi sẽ chia sẻ hai tùy chọn thân thiện với người mới bắt đầu sẽ cho phép bạn dễ dàng tùy chỉnh chủ đề của mình và thậm chí tạo chủ đề WordPress tùy chỉnh .

Các tùy chọn tùy biến chủ đề khác

Một số chủ đề miễn phí và cao cấp cung cấp nhiều tùy chọn tùy biến chủ đề hơn.

Tùy thuộc vào chủ đề bạn đang sử dụng, bạn có thể thay đổi kiểu phông chữ, thêm hình nền , thay đổi bố cục, sửa đổi màu sắc, thêm hình ảnh tiêu đề ngẫu nhiên và hơn thế nữa.

Bạn cũng có thể thêm các tính năng cụ thể vào tùy biến chủ đề của mình với sự trợ giúp của các plugin. Ví dụ: bạn có thể thêm phông chữ tùy chỉnh trong WordPress bằng cách sử dụng plugin Easy Google Fonts .

Xem trước trang web của bạn trên các độ phân giải màn hình khác nhau

Điều quan trọng đối với mọi chủ sở hữu trang web là đảm bảo rằng trang web của họ đáp ứng trên thiết bị di động và trông đẹp trên mọi kích thước màn hình.

Nhờ công cụ tùy biến chủ đề WordPress, bạn có thể dễ dàng kiểm tra trang web của mình trông như thế nào trên các kích thước màn hình khác nhau.

Ở cuối bảng tùy chỉnh Chủ đề, bạn sẽ tìm thấy ba biểu tượng và liên kết “Ẩn điều khiển”.

Preview website on different screen resolutions

Các biểu tượng này cho phép bạn kiểm tra trang web của mình trên các độ phân giải màn hình khác nhau như máy tính để bàn, máy tính bảng và thiết bị di động.

Liên kết Hide Controls hữu ích để ẩn bảng WordPress Customizer để bạn có thể xem trang web của mình đúng cách ở chế độ máy tính để bàn.

Xuất bản, lưu hoặc lên lịch cài đặt công cụ tùy chỉnh của bạn

Khi bạn đã thực hiện các thay đổi cần thiết, bạn cần áp dụng chúng cho trang web của mình. Nếu không, tất cả công việc khó khăn của bạn sẽ bị mất.

Hãy tiếp tục và nhấp vào nút Xuất bản để áp dụng các thay đổi. Sau khi hoàn tất, bạn có thể nhấp vào nút đóng, hiện ở góc trên cùng bên trái của màn hình, để thoát khỏi công cụ tùy chỉnh chủ đề.

Publish WordPress Customizer settings

Nếu bạn cần thêm thời gian để hoàn thiện thiết kế mới của mình thì sao? Trong trường hợp đó, bạn có thể lưu nó dưới dạng bản nháp và thậm chí chia sẻ thiết kế mới của mình với ai đó mà không cần cấp cho họ quyền truy cập vào khu vực quản trị của bạn.

Để làm điều đó, bạn cần nhấp vào biểu tượng bánh răng ngay bên cạnh nút Xuất bản. Thao tác này sẽ mở ra bảng Hành động.

WordPress Customizer Save Draft option

Tại đây, bạn sẽ tìm thấy ba tùy chọn: Xuất bản, Lưu bản nháp và Lên lịch.

Bạn cần chọn nút radio Lưu Bản nháp trên bảng Hành động và sau đó nhấp vào nút Lưu Bản nháp để lưu trữ các thay đổi của bạn.

Bây giờ bạn có thể sao chép liên kết xem trước và chia sẻ nó với những người khác để nhận phản hồi.

Mặt khác, tùy chọn Lịch biểu cho phép bạn xuất bản các thay đổi của mình vào một ngày và giờ cụ thể. Bạn có thể sử dụng tùy chọn này để lên lịch cho các thay đổi chủ đề của mình xuất hiện trực tuyến vào thời điểm bạn nhận được ít lưu lượng truy cập nhất.

Schedule Customizer settings on a specific date

Cuối cùng, nếu bạn muốn đặt lại các thay đổi chưa được xuất bản, thì bạn có thể nhấp vào liên kết Hủy thay đổi trên bảng Hành động.

Xem trước các chủ đề khác nhau mà không cần phát trực tiếp

Đôi khi bạn muốn kiểm tra xem một chủ đề mới sẽ trông như thế nào trên trang web của bạn. Tuy nhiên, bạn không muốn kích hoạt chúng trên trang web trực tiếp của mình.

Trong trường hợp đó, bạn có thể mở WordPress Customizer để thử nghiệm các chủ đề mới mà không cần xuất hiện trực tuyến.

Trên bảng Customizer, bạn sẽ tìm thấy tên của chủ đề đang hoạt động và nút Thay đổi.

Change WordPress Theme from Customizer

Nếu bạn nhấp vào nút đó, thì WordPress sẽ hiển thị tất cả các chủ đề đã cài đặt của bạn ở phía bên phải của trang.

Để kiểm tra một chủ đề cụ thể, bạn cần nhấp vào nút Xem trước trực tiếp.

Preview Installed themes on Theme Customizer

Bạn cũng có thể xem trước các chủ đề từ Kho chủ đề WordPress. Để làm điều đó, bạn cần chọn hộp kiểm “WordPress.org themes” trên bảng điều khiển bên trái.

Điều này sẽ hiển thị các chủ đề từ thư mục WordPress.org. Bạn có thể nhấp vào nút “Cài đặt & Xem trước” để kiểm tra chủ đề bạn thích.

WordPress themes directory

Bạn cũng có thể lọc các chủ đề bằng cách nhấp vào nút Bộ lọc Chủ đề có ở góc trên cùng bên phải của màn hình.

Lưu ý: chúng tôi khuyên bạn nên sử dụng trang web dàn dựng WordPress để thử nghiệm các chủ đề mới thay vì sử dụng công cụ tùy chỉnh trên trang web trực tiếp.

Nhập hoặc xuất cài đặt tùy biến chủ đề

Bạn có biết rằng bạn có thể nhập và xuất cài đặt tùy biến chủ đề của mình không?

Điều này cực kỳ hữu ích khi bạn thực hiện các thay đổi đối với chủ đề của mình trên máy chủ cục bộ hoặc một trang web dàn dựng . Thay vì sao chép các cài đặt theo cách thủ công vào trang web trực tiếp của bạn, bạn có thể chỉ cần xuất cài đặt tùy biến chủ đề để tiết kiệm thời gian của mình.

Để có hướng dẫn chi tiết, bạn có thể làm theo hướng dẫn của chúng tôi về cách nhập và xuất cài đặt tùy biến chủ đề trong WordPress .

Các lựa chọn thay thế cho WordPress Theme Customizer

Mặc dù WordPress Customizer cho phép bạn thực hiện các thay đổi đối với trang web của mình, nhưng số lượng điều khiển sẽ khác nhau tùy thuộc vào chủ đề bạn đang sử dụng.

Điều gì sẽ xảy ra nếu bạn thích chủ đề của mình, nhưng ước rằng nó có thêm các tùy chọn tùy chỉnh?

Trong trường hợp đó, giải pháp tốt nhất là sử dụng một trong hai plugin tùy chỉnh hoạt động cùng với tùy biến chủ đề WordPress.

Anh hùng CSS

CSS Hero plugin

CSS Hero là một plugin WordPress cho phép bạn tùy chỉnh trang web của mình mà không cần viết một dòng mã nào. Bạn có quyền tự do tạo kiểu cho mọi thành phần trên trang web của mình mà không gặp bất kỳ rắc rối nào.

Bạn có muốn tùy chỉnh trang đăng nhập của trang WordPress của mình không? CSS Hero cho phép bạn làm điều đó trong vòng vài phút.

Bạn cũng có thể chỉnh sửa và xem trước các thay đổi trong giao diện người dùng để đảm bảo rằng thiết kế của bạn trông hoàn hảo trên mọi thiết bị.

Thợ xây hải ly

Beaver Builder plugin

Beaver Builder là một trong những plugin tạo trang WordPress tốt nhất trên thị trường. Nó cho phép bạn tạo các trang tuyệt đẹp cho trang web của mình bằng cách sử dụng giao diện kéo và thả.

Phần tốt nhất là Beaver Builder hoạt động với hầu hết mọi chủ đề WordPress. Điều này cho phép bạn sử dụng nó với chủ đề hiện tại của bạn.

Beaver Builder hỗ trợ việc sử dụng các mã ngắn và widget. Nó cũng cung cấp các loại mô-đun khác nhau mà bạn có thể sử dụng để dễ dàng tạo kiểu cho trang web của mình. Xem hướng dẫn của chúng tôi về cách tạo bố cục tùy chỉnh trong WordPress để được hướng dẫn chi tiết.

Bạn cũng có thể sử dụng Beaver Builder để tạo một chủ đề WordPress hoàn toàn tùy chỉnh mà không cần viết bất kỳ mã nào.

Chúng tôi hy vọng hướng dẫn này đã giúp bạn tìm hiểu cách sử dụng WordPress Theme Customizer như một người chuyên nghiệp. Bạn cũng có thể muốn xem hướng dẫn của chúng tôi về các plugin và công cụ WordPress tốt nhất cho trang web của bạn .

Nếu bạn thích bài viết này, vui lòng đăng ký Kênh YouTube của chúng tôi để biết thêm các video hướng dẫn về WordPress. Bạn cũng có thể theo dõi chúng tôi trên TwitterFacebook .

Chia sẻ để ủng hộ ad nhé
Share on facebook
Facebook
Share on twitter
Twitter
Share on linkedin
LinkedIn
0 0 Đánh giá
Xếp hạng bài viết
Đăng ký
Thông báo về
guest
0 Bình luận
Phản hồi nội tuyến
Xem tất cả bình luận
0
Để lại ý kiến của bạnx
()
x
error: Cảnh báo: Không có quyền !!