Cách cài đặt theme bán hàng Woodmart trên WordPress (Part 2)

Ở bài viết trước chúng ta đã cài đặt và thiết lập 1 số cài đặt cơ bản cho theme Woodmart. Trong bài viết này, chúng ta sẽ đi chỉnh sửa Header, Footer, tạo Menu, cách làm việc với Widget và Sidebar

1. Thiết lập Header (Đầu trang)

Với mẫu Theme Woodmart  bạn có thể dễ dàng tùy chỉnh phần Header. Bạn có thể dễ dàng chọn, logo, giỏ hàng và widget danh sách yêu thích, khối HTML, nút mạng xã hội, tìm kiếm và những thứ khác. Bạn có thể sắp xếp chúng theo bất kỳ thứ tự nào bạn cần và tùy chỉnh phong cách của chúng. Dễ dàng tạo các bố cục khác nhau cho máy tính để bàn và thiết bị di động và làm cho trang web của bạn đáp ứng mà không cần bất kỳ sửa đổi mã nào.

Bạn có thể tìm thấy giao diện trình quản lý trình tạo Header WoodMart trong Bảng điều khiển quản trị -> WoodMart -> Header Builder . Ở đó, bạn có thể xem danh sách tất cả các Header đã tạo. Nó cho phép bạn chỉnh sửa chúng, tạo mới, nhập, xóa hoặc đánh dấu một số Header làm Header mặc định cho trang web của bạn (nút dấu sao).

Cách tạo Header mới
Đi tới Trang tổng quan -> WoodMart -> Header Builder và nhấp vào nút “Tạo Header mới”. Bạn sẽ thấy một cửa sổ bật lên có hai phần. Cái đầu tiên liệt kê tất cả các ví dụ về bố cục Header từ thư viện của chúng tôi. Bạn có thể chọn bất kỳ trong số chúng làm Header của mình và sau đó chỉ cần tùy chỉnh nó. Bên dưới danh sách này, bạn có thể thấy một danh sách khác có chứa Header đã tồn tại trong danh sách trình quản lý Header của bạn. Vì vậy, bạn cần nhấp vào một Header trong những Header này để sử dụng làm Header mới của bạn. Sau hành động này, bố cục mới sẽ được tạo và bạn có thể bắt đầu chỉnh sửa nó.
Trên trang trình quản lý Header, bạn cũng có thể chọn Header nào trong số các Header đã tạo sẽ được sử dụng làm Header mặc định cho trang web của bạn. Để làm điều này, bạn cần nhấp vào nút dấu sao cho Header mong muốn (Đặt nó làm mặc định).
Thiết lập hàng và cột
Khi bạn chỉnh sửa Header của mình bằng Header Builder, bạn có thể thấy một khu vực có ba hàng, mỗi hàng chứa ba cột. Chúng đại diện cho ba phần của Header trang web của bạn: thanh trên cùng, Header và phần dưới cùng của Header. Tất cả các cột này đều là vùng chứa kéo và thả để bạn có thể thêm bất kỳ phần tử nào bên trong chúng và chỉ cần kéo và thả chúng giữa các cột. Theo cách này, bạn có thể soạn bất kỳ loại bố cục nào và đặt bất kỳ thứ tự nào vào Header của bạn.
Mỗi phần của Header có cài đặt riêng và bạn có thể nhấp vào biểu tượng “Chỉnh sửa” để định cấu hình chiều cao, phối màu, đường viền của chúng, v.v. Trên cửa sổ bật lên cấu hình này, bạn cũng có thể đánh dấu hàng này sẽ hiển thị khi cuộn (Sticky), ẩn trên thiết bị di động / hoặc trên các thiết bị máy tính để bàn, thêm đường viền dưới cùng, đặt màu nền hoặc hình ảnh và chọn cấu trúc bố cục hàng.
Cách thêm, sửa, xóa phần tử trong Header
Để thêm phần tử mới vào một số vị trí trên Header của bạn, bạn cần nhấp vào nút “Thêm phần tử” (biểu tượng dấu cộng). Bạn sẽ thấy một cửa sổ bật lên chứa tất cả các phần tử có sẵn
Sau khi thêm tất cả các yếu tố bạn muốn sử dụng trong Header trang web của mình, bạn có thể sắp xếp lại chúng theo bất kỳ thứ tự nào bạn muốn và chỉnh sửa cài đặt của chúng. Để sắp xếp lại thứ tự, bạn có thể chỉ cần kéo và thả các phần tử giữa tất cả các cột trong khu vực
. Khi bạn di chuyển chuột qua một số phần tử, bạn có thể thấy ba nút cho phép bạn chỉnh sửa, sao chép hoặc loại bỏ phần tử này.

2. Thiết lập Footer (Chân trang)

Với theme của Woodmart, bạn có thể tạo chân trang có bố cục và màu sắc khác nhau Trong Tùy chọn chủ đề -> Chân trang một số biến thể được xác định trước của cấu trúc cột.
Ví dụ: nếu bạn đặt bố trí chân trang thành “Ba Cột”, bạn sẽ tìm thấy 3 khu vực tiện ích trong Giao diện -> Tiện ích để bạn có thể thêm bất kỳ tiện ích nào vào đây và sẽ thấy chúng ở 3 cột bằng nhau.

Trong chủ đề này, bạn có thể lấy các đoạn mã ví dụ cho phép bạn tạo khu vực chân trang như trên bản demo của theme. Chỉ cần sao chép chúng và đặt vào cột chân trang của bạn trong Giao diện -> Tiện ích bằng tiện ích Văn bản WordPress .

Cách 2: Sử dụng Trình tạo trang WPBakery

Cách khác là thêm Khối HTML vào khu vực tiện ích chân trang. Để làm điều này, bạn cần chọn bố cục “Cột đơn” và thêm vào đó một tiện ích có tên là Woodmart HTML Block . Bạn có thể tạo khối này bằng cách sử dụng tất cả các yếu tố và bố cục của plugin WPBakery Page Builder trong HTML Blocks -> Add New .

 

3. Tạo Menu

Tất cả các menu được áp dụng trong trang web được tạo trong Bảng điều khiển -> Giao diện -> Menu. Theme WoodMart cung cấp hai vị trí menu: Menu chính và menu Di động. Ngoài ra, Theme WoodMart cung cấp các tùy chọn khác nhau để hiển thị menu ở bất kỳ vị trí nào của trang web, bao nhiêu menu tùy theo nhu cầu

Để truy cập vào trang quản lý Menu, bạn vào Appearance –> Menus trong Dashboard.

Thêm Menu vào trang Web

Main Menu( Menu chính)

Menu chính được hiển thị bằng phần tử menu Chính trong Header Builder: Woodmart -> Header Builder -> Chọn Header -> Cài đặt Header-> thêm phần tử vào trình tạo Header

Mobile Menu (Menu di động)

Mobile Menu được tạo và gán trong menu Giao diện> Menu> Chọn và được hiển thị bằng phần tử Mobile Menu trong Header Builder trong chế độ xem Di động . Một menu có thể là Main menu và Mobile Menu. Mobile Menu không hỗ trợ các khối menu lớn vì không có đủ diện tích cho các khối lớn. Do đó, cần tạo một bản sao của menu Chính mà không có khối menu lớn. Mobile Menu có thể nhiều cấp. Phần tử Mobile Menu có tùy chọn để hiển thị menu Danh mục, được tạo trong Giao diện> Menu. Phần tử menu di động cũng có tùy chọn để hiển thị hoặc ẩn tìm kiếm.

WoodMart Widget và Sidebar

Bạn có thể tìm thấy một số tiện ích hữu ích được cung cấp bởi chủ đề WoodMart trong Giao diện -> Widget. Có 1 số Widget cơ bản:

  • Điều hướng phân lớp WOODMART WooCommerce
  • WOODMART WooCommerce Sắp xếp theo
  • Bộ lọc giá WOODMART
  • Tìm kiếm WOODMART AJAX
  • Bảng điều khiển người dùng WOODMART
  • WOODMART Instagram
  • Biểu ngữ WOODMART
  • Khối HTML WOODMART
  • Thông tin tác giả WOODMART
  • WOODMART Bài viết gần đây
  • Menu Mega của WOODMART Sidebar
  • WOODMART Twitter
  • Tình trạng còn hàng của WOODMART

Mỗi trang, một bài đăng và trang sản phẩm có thể có một thanh bên tùy chỉnh. Thậm chí có thể đặt các thanh bên khác nhau cho các trang hoặc sản phẩm khác nhau. Tùy chọn “Tạo Thanh bên” trong Bảng điều khiển.

OK, vậy là trong bài viết này mình đã hướng dẫn các bạn cách thiết lập và chỉnh sửa Header/Footer. Cách tạo, chỉnh sửa Menu, cách làm việc với Widget và Sidebar. Trong bài viết kế tiếp chúng ta sẽ cùng tìm hiểu về tùy chọn cho các trang, tạo Menu danh mục sản phẩm, tạo sản phẩm đơn và sản phẩm có biến thể.

 

Chia sẻ bài viết:
Share on facebook
Share on twitter
Share on google
Share on telegram

1 thought on “Cách cài đặt theme bán hàng Woodmart trên WordPress (Part 2)”

Leave a Comment

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *