Bạn có biết rằng WordPress có sẵn một công cụ tùy biến theme (theme customizer) cho phép bạn dễ dàng thực hiện các thay đổi thiết kế trên trang web của bạn ngay lập tức?
Hầu như mọi theme đều hỗ trợ các tùy chọn tùy biến mặc định, cũng như các tab và tùy chọn bổ sung để tùy biến theme WordPress. Vì vậy, bạn có thể dễ dàng tùy chỉnh theme 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 sử dụng bảng tùy biến mặc định và sau đó bạn sẽ có thể sử dụng công cụ theme customizer WordPress như một chuyên gia.
Vì đây là một hướng dẫn toàn diện và tương đối dài, chúng tôi đã tạo sẵn một mục lục ngay bên dưới để bạn tiện theo dõi.
Cách truy cập Theme Customizer WordPress
Theme customizer là một tính năng mặc định của WordPress và là một phần của mọi trang web WordPress.
Bạn có thể truy cập bằng cách đăng nhập vào khu vực quản trị WordPress của bạn, sau đó chuyển đến Appearance » Customize từ thanh bên trái của bảng quản trị WordPress. Giao diện Customizer sẽ mở ra với theme bạn đang sử dụng.
Bạn cũng có thể sử dụng trang tùy biến theme WordPress cho bất kỳ theme nào được cài đặt trên trang web của bạn ngay cả khi chúng không hoạt động.
Tính năng này cho phép bạn xem bản xem trước trực tiếp của theme đó và thực hiện thay đổi trước khi bạn kích hoạt nó.
Để làm điều đó, bạn cần phải đi đến trang Appearance » Themes.
Tiếp theo, di con trỏ chuột lên bất kỳ theme đã cài đặt nào và nhấp vào nút Live Preview để mở trang tùy biến theme WordPress.
Cách sử dụng Theme Customizer WordPress
Sau khi mở trang tùy biến theme WordPress, bạn sẽ thấy tất cả các cài đặt tùy chỉnh ở bên trái màn hình và bảng xem trước trực tiếp trang web của bạn ở phía bên phải.
Theme customizer WordPress đi kèm với một tập hợp các bảng mặc định bất kể theme bạn đang sử dụng là gì.
Bạn cần phải bấm vào các bảng này để tiến hành thay đổi. Bạn cũng có thể nhấp vào biểu tượng bút chì màu xanh ở bên phải màn hình của bạn để mở cài đặt cho mục cụ thể đó.
Lưu ý: các theme WordPress nâng cao sẽ thêm bảng cài đặt bổ sung cho các tùy chọn tùy chỉnh bổ sung (chúng ta sẽ nói nhiều hơn về điều này ở phần sau).
Thêm tiêu đề, logo và icon trang web với Site Identity
Các bảng Site Identity trong công cụ tùy biến theme WordPress cho phép bạn thêm hoặc thay đổi tiêu đề và tagline của trang web của bạn.
Theo mặc định, WordPress sẽ thêm dòng “Just Another WordPress Site” vào tagline của trang
Bạn nên thay đổi nó sau khi cài đặt WordPress trên trang web của bạn. Bạn cũng có thể xóa tagline nếu muốn.
Bảng Site Identity trong theme customizer WordPress cũng cho phép bạn thêm logo trang web. Chỉ cần nhấp vào tùy chọn Site Identity để tải lên logo của trang web của bạn.
Bạn muốn thêm icon vào trang web của bạn hay không? Bạn có nhấp vào tùy chọn Select site icon để tạo và thêm hình đại diện vào trang web của bạn .
Thay đổi màu sắc trên trang web của bạn bằng WordPress Theme Customizer
Các tùy chọn trên bảng Colors sẽ thay đổi chủ yếu tùy thuộc vào theme WordPress mà bạn đang sử dụng.
Ví dụ, theme 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.
Các theme WordPress khác có thể cung cấp các tùy chọn màu khác nhau cho các thành phần trang web như: tiêu đề, liên kết, nội dung, nền của trang web,…
Thêm Menu điều hướng trong theme customizer
Các bảng menu cho phép bạn tạo các menu chuyển hướng và kiểm soát vị trí của chúng trên trang web của bạn.
Trên tab 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 “View All Locations” để kiểm tra các vị trí menu có sẵn mà theme của bạn hỗ trợ.
Để 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 Next để tiếp tục.
Để thêm các mục vào menu này, bạn cần nhấp vào nút Add Items để mở một bảng điều khiển mới. Tại bảng này bạn có thể thêm các liên kết, trang, bài đăng, category và tag tùy chỉnh làm các mục menu.
Để sắp xếp lại các mục, bạn có thể nhấp vào liên kết Reorder và sau đó sử dụng các biểu tượng mũi tên để điều chỉnh vị trí các mục trên menu.
Kiểm soát các widget trên trang web của bạn bằng Theme customizer
Bảng Widgets cho phép bạn thêm và quản lý các widget trên trang web của mình.
Nhấp vào bảng này sẽ hiển thị cho bạn các vị trí khác nhau mà bạn có thể thêm widget. Chúng sẽ thay đổi tùy thuộc vào theme bạn đang sử dụng.
Ví dụ, theme Twenty Seventeen cung cấp 3 vị trí widget, trong khi đó theme Twenty Nineteen chỉ có một vị trí.
Khi bạn nhấp vào bất kỳ mục nào trong số chúng, bạn sẽ thấy các widget mà bạn đã thêm trước đó.
Để thêm một widget mới, bạn cần nhấp vào nút “Add a Widget”. Một bảng điều khiển mới sẽ mở ra, bạn sẽ thấy một danh sách tất cả các widget có sẵn.
Bạn cần phải bấm vào widget mà bạn muốn thêm. Bạn cũng có thể thay đổi các widget 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.
Tùy biến trang chủ với Homepage Settings trong Theme customizer
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 trang chủ tùy chỉnh. Một công cụ tùy chỉnh trang chủ sẽ cho phép bạn tạo nên trang đích thích hợp hiển thị các sản phẩm và dịch vụ của bạn.
Để sử dụng một trang chủ tùy chỉnh, bạn cần chọn nút “A static page” trên bảng Homepage Settings.
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 bạn 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 “+ Add New Page” bên dưới menu thả xuống. Sau đó bạn có thể tạo một trang mới tùy thích.
Thêm CSS tùy chỉnh bằng bảng Additional CSS
Bạn có muốn thêm mã CSS tùy chỉnh để tạo kiểu trang web của mình không? Bạn có thể làm điều đó trong bảng Additional CSS .
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 theme của họ. Điều này đồi hỏi cần các bước bổ sung như bạn phải có quyền truy cập FTP vào hosting WordPress của bạn , sửa đổi tệp theme, ..
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 Additional CSS trong theme customizer WordPress. Điều này sẽ cho phép bạn thay đổi trang web của mình và xem chúng trực tiếp ở phía bên phải màn hình của bạn.
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ị các thông báo lỗi nếu bạn chưa viết mộ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, bạn hãy tiếp tục đọc nội dung ngay bên dưới. 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 cho phép bạn dễ dàng tùy chỉnh theme của mình và thậm chí tạo một theme WordPress tùy chỉnh mà không cần viết bất cứ đoạn code nào.
Các tùy chọn khác trong Theme customizer
Một số theme miễn phí và cao cấp cung cấp nhiều tùy chọn theme customizer hơn.
Tùy thuộc vào theme 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à nhiều hơn nữa.
Bạn cũng có thể thêm các tính năng cụ thể vào theme customizer 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 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ọ phản hồi nhanh trên thiết bị di động và trông đẹp trên mọi kích thước màn hình.
Nhờ Theme customizer WordPress, bạn có thể dễ dàng kiểm tra xem trang web của bạn trông như thế nào trên những kích thước màn hình khác nhau.
Ở dưới cùng của bảng theme customizer, bạn sẽ tìm thấy ba biểu tượng và liên kết “Hide Controls”.
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.
Hide Controls giúp bạn ẩn công cụ WordPress Customizer để bạn có thể xem trang web hiển thị như thế nào trong chế độ desktop.
Xuất bản, lưu hoặc lên lịch cài đặt tùy biến 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ả những nỗ lực từ trước tới giờ của bạn coi như đổ sông đổ biển.
Đi trước và nhấp vào nút Publish để á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 bên trái màn hình của bạn, để thoát Theme customizer.
Nếu bạn cần thêm thời gian để hoàn thiện thiết kế mới của bạn 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 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 Publish. Thao tác này sẽ mở bảng Action.
Tại đây bạn sẽ tìm thấy ba tùy chọn: Publish, Save Draft, và Schedule.
Bạn cần chọn nút Save Draft trên bảng Action và sau đó nhấp vào nút Save Draft để lưu 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 Schedule 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 thay đổi theme của mình để phát trực tiếp tại thời điểm bạn nhận được ít lưu lượng truy cập nhất.
Cuối cùng, nếu bạn muốn đặt lại các thay đổi chưa được công bố, thì bạn có thể nhấp vào liên kết Discard changes trên bảng Action.
Xem trước các theme khác mà không cần kích hoạt
Đôi khi bạn muốn kiểm tra xem một theme 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 để kiểm tra các theme mới mà không cần kích hoạt ngay lập tức.
Trên bảng Customizer, bạn sẽ tìm thấy tên của theme đang hoạt động và nút Change.
Nếu bạn nhấp vào nút đó, WordPress sẽ hiển thị tất cả các theme đã cài đặt của bạn ở bên phải của trang.
Để kiểm tra một theme cụ thể, bạn cần nhấp vào nút Live Preview .
Bạn cũng có thể xem trước các theme từ WordPress Themes Repository. Để làm điều đó, bạn cần chọn checkbox “WordPress.org themes” trên bảng điều khiển bên trái.
Thao tác này sẽ hiển thị các theme từ thư mục WordPress.org. Bạn có thể nhấp vào nút “Install & Preview” để kiểm tra theme bạn thích.
Bạn cũng có thể lọc các theme bằng cách nhấp vào nút Filter Themes có ở góc trên bên phải màn hình của bạn.
Bạn nên sử dụng trang web stagging WordPress để kiểm tra các theme mới thay vì sử dụng trình customizer trực tiếp trên trang web của mình.
Nhập hoặc xuất cài đặt theme customizer
Bạn có biết rằng bạn có thể nhập và xuất các cài đặt theme customizer của mình không?
Điều này cực kỳ hữu ích khi bạn thực hiện thay đổi theme của mình trên máy chủ cục bộ hoặc trang web stagging. Thay vì sao chép thủ công các cài đặt vào trang web trực tiếp của bạn, bạn chỉ cần xuất các cài đặt theme customizer để 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 theme customizer trong WordPress.
Lựa chọn thay thế khác cho Theme Customizer WordPress
Mặc dù WordPress Customizer cho phép bạn thay đổi trang web của mình, số lượng bảng điều khiển sẽ thay đổi tùy thuộc vào theme bạn đang sử dụng.
Điều gì nếu bạn thích theme của bạn, nhưng muốn rằng nó có thêm nhiều tùy chọn tùy chỉnh hơn nữa?
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 công cụ theme customizer WordPress có sẵn.
CSS Hero
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 code nào. Bạn có thể tự do định kiểu mọi yếu tố của trang web của bạn mà không gặp rắc rối.
Bạn có muốn tùy chỉnh trang đăng nhập của trang web 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 ở lối vào để đả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ị.
Beaver Builder
Beaver Builder là một trong những plugin xây dựng trang WordPress tốt nhất trên thị trường. Cho phép bạn xây dựng các trang tuyệt đẹp bằng giao diện kéo và thả đơn giản.
Phần tốt nhất là Beaver Builder hoạt động với hầu hết mọi theme WordPress, giúp bạn sử dụng Beaver Builder với theme hiện tại của bạn.
Beaver Builder cũng hỗ trợ shortcodes 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 để biết hướng dẫn chi tiết.
Bạn cũng có thể sử dụng Beaver Builder để tạo một theme WordPress hoàn toàn tùy chỉnh mà không cần viết bất kỳ đoạn code 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 Theme Customizer WordPress 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ý YouTube Channel của chúng tôi để xem thêm các video hướng dẫn. Bạn cũng có thể tìm thấy chúng tôi trên Twitter và Facebook.