Bắt đầu với Website Builder
Nếu đây là lần đầu tiên bạn sử dụng Website Builder, chúng tôi sẽ hỗ trợ bạn bắt đầu khởi tạo website của bạn, đồng thời làm quen với giao diện và các tính năng cơ bản của Website Builder.
A. Truy cập vào Website Builder
B. Tổng quan về giao diện Website Builder
C. Header bar
D. Web front
E. Side bar settings
F. Layer panel
G. Insert panel
H. Quick bar settings
I. Styling settings
Bạn có thể truy cập Website Builder khi tạo 1 sản phẩm hoặc 1 trang mới trên website của bạn
Từ trang quản trị ShopBase Creator, đi tới Products. Sau đó, nhấp Add product và tạo sản phẩm của bạn.
Khi sản phẩm của bạn đã được tạo, nhấp Design sales page để truy cập vào Website Builder và bắt đầu khởi tạo trang sản phẩm của bạn.
Tại trang chọn template, tìm và lựa chọn template phù hợp với sản phẩm của bạn. Sau đó, nhấp vào Apply để sử dụng template trên trang web của bạn.
Vui lòng tham khảo bài viết này để biết thêm về template trên Website Builder.
Từ trang quản trị ShopBase Creator, đi tới Website > Pages. Sau đó, nhấp vào Add new page và tạo trang mới của bạn.
Trong mục Look & Feels, nhấp chọn Customize.
Bạn cũng có thể nhấp vào nút Customize tại trang của bạn ở danh sách Pages để truy cập Website Builder.
Tại trang chọn template, tìm và lựa chọn template phù hợp với sản phẩm của bạn. Sau đó, nhấp vào Apply để sử dụng template trên trang web của bạn.
Vui lòng tham khảo bài viết này để biết thêm về template trên Website Builder.
Giao diện Website Builder có thể được chia thành 3 mục chính:
Header bar (Thanh đầu trang) được hiển thị trên đầu cửa sổ giao diện, bao gồm tất cả các lựa chọn và nút lệnh liên quan tới tập tin, lựa chọn, layer, loại, v.v.
Side bar (Thanh bên) hiển thị toàn bộ các thiết lập về nội dung và giao diện cho từng yếu tố trên trang web của bạn.
Web front (Giao diện trang web) là khu vực bạn có thể xem và tuỳ chỉnh trang web của bạn. Bạn có thể nhấp chọn và kéo từng yếu tố để thay đổi thứ tự của chúng trên trang web tuỳ ý.
Vui lòng tham khảo danh sách các lựa chọn và nút lệnh trên Header bar dưới đây.
Exit (Tắt): Đóng Website Builder và quay trở lại trang quản trị.
Nút layer: Mở bảng điều khiển Layer.
Nút style: Mở bảng điều khiển Styling settings (thiết lập giao diện).
Nút insert: Mở bảng điều khiển Insert giúp bạn chèn thêm nhiều yếu tố vào trang web.
Tên của trang web bạn đang chỉnh sửa.
Thông báo trạng thái lưu trang.
Nút Undo (hoàn tác).
Nút Redo (khôi phục).
Nút xem trước: Xem trước trang web trên website của bạn.
Nút chuyển đổi thiết bị*: Chuyển đổi giữa giao diện máy tính và điện thoại.
Nút lưu.
Nút tuỳ chọn: Các tính năng thiết lập nâng cao.
Phần này hiển thị toàn bộ giao diện trang web sau khi trang này được đăng tải. Bạn có thể chọn để hiển thị giao diện máy tính hoặc di động để dễ dàng hình dung hơn.
Bạn có thể nhấp chọn và kéo từng khối thiết kế trong phần Web front để thay đổi vị trí của chúng trên trang web.
Khi hiển thị trên giao diện máy tính và di dộng, tất cả nội dung và thiết lập của từng khối thiết kế sẽ được đồng bộ hoá. Tuy nhiên, Website Builder cũng bao gồm một chức năng cho phép người dùng điều chỉnh màu sắc, kiểu dáng và kích thước khác nhau cho từng loại thiết bị.
Mục này bồm gồm các thiết lập thanh bên (Side bar), bảng điều khiển Layer (Layer panel), và bảng Insert (Insert panel) giúp bạn dễ dàng thiết lập các giá trị và thuộc tính của từng mục (section), hàng (row), cột (column), và khối (block).
Vui lòng tham khảo các bài hướng dẫn dưới đây của chúng tôi:
Thiết lập mục (section) trên Website Builder
Thiết lập khối (block) trên Website Builder
Trong bảng điều khiển Layer (Layer panel), bạn có thể xem danh sách các layer của trang web mà bạn đang thiết kế:
Mỗi layer sẽ có các cấu trúc sau: Mục (Section) > Hàng (Row) > Cột (Column) > Khối (Block).
Mỗi layer có thể chứa các layer con (sublayer) mà bạn có thể tuỳ chỉnh theo ý thích.
Danh sách các layer sẽ được xếp theo thứ tự hiển thị các yếu tố trên trang web của bạn, từ trên xuống dưới. Bạn có thể dễ dàng chọn và kéo để sắp xếp lại thứ tự của các layer.
Khi bạn thêm các yếu tố mới vào 1 trang web, chúng cũng sẽ hiển thị của bảng điều khiển Layer.
Vui lòng tham khảo các bài hướng dẫn dưới đây của chúng tôi:
Thiết lập mục (section) trên Website Builder
Thiết lập khối (block) trên Website Builder
Bảng Insert (Insert panel) sẽ giúp bạn thêm nhiều khối (block) và mục (section) vào trang web của bạn.
Bạn có thể chọn 1 khối hoặc mục từ thư viện có sẵn của chúng tôi để sử dụng và tuỳ chỉnh.
Khối và mục được lưu về thư viện của bạn cũng được hiển thị ở đây để bạn dễ dàng lựa chọn và thiết lập đồng nhất trang web của bạn.
Bạn có thể sử dụng quick bar settings (thanh thiết lập nhanh) để chỉnh sửa nhanh các yếu tố trên trang web. Tuỳ thuộc vào cách sử dụng và thuộc tính thực tế của từng yếu tố, các thanh thiết lập nhanh khác nhau sẽ được hiển thị. Dưới đây là danh sách của các thiết lập nhanh thông dụng nhất:
Di chuyển yếu tố lên trước/xuống sau 1 lớp.
Ẩn yếu tố được chọn.
Nhân bản yếu tố được chọn.
Lưu yếu tố vào thư viện của bạn.
Xoá yếu tố được chọn.
Styling settings (Thiết lập giao diện), bao gồm giao diện toàn website (Site style) và giao diện trang riêng (Page style), cho phép người dùng dễ dàng thiết lập màu, phông chữ, và kiểu nút bấm giống nhau cho toàn bộ website của bạn. Các thiết lập này giúp website của bạn có 1 giao diện đồng nhất.
Nếu bạn cần thiết kế 1 trang web riêng biệt với giao diện và màu sắc khác, bạn có thể sử dụng thiết lập giao diện trang riêng (Page style). Các tính năng này sẽ tạo ra 1 giao diện riêng cho trang web bạn đang chỉnh sửa mà không ảnh hưởng tới giao diện chung của toàn bộ website.
Sau khi thiết lập giao diện, bạn cũng có thể lưu lại về thư viện để dùng sau.
Vui lòng tham khảo bài hướng dẫn dưới đây của chúng tôi:
Hiểu về thiết lập giao diện trên Website Builder
Trong bài viết này
A. Truy cập vào Website Builder
B. Tổng quan về giao diện Website Builder
C. Header bar
D. Web front
E. Side bar settings
F. Layer panel
G. Insert panel
H. Quick bar settings
I. Styling settings
A. Truy cập vào Website Builder
Bạn có thể truy cập Website Builder khi tạo 1 sản phẩm hoặc 1 trang mới trên website của bạn
Tạo sản phẩm mới
Từ trang quản trị ShopBase Creator, đi tới Products. Sau đó, nhấp Add product và tạo sản phẩm của bạn.
Khi sản phẩm của bạn đã được tạo, nhấp Design sales page để truy cập vào Website Builder và bắt đầu khởi tạo trang sản phẩm của bạn.
Tại trang chọn template, tìm và lựa chọn template phù hợp với sản phẩm của bạn. Sau đó, nhấp vào Apply để sử dụng template trên trang web của bạn.
Vui lòng tham khảo bài viết này để biết thêm về template trên Website Builder.
Tạo trang mới
Từ trang quản trị ShopBase Creator, đi tới Website > Pages. Sau đó, nhấp vào Add new page và tạo trang mới của bạn.
Trong mục Look & Feels, nhấp chọn Customize.
Bạn cũng có thể nhấp vào nút Customize tại trang của bạn ở danh sách Pages để truy cập Website Builder.
Tại trang chọn template, tìm và lựa chọn template phù hợp với sản phẩm của bạn. Sau đó, nhấp vào Apply để sử dụng template trên trang web của bạn.
Vui lòng tham khảo bài viết này để biết thêm về template trên Website Builder.
B. Tổng quan về giao diện Website Builder
Giao diện Website Builder có thể được chia thành 3 mục chính:
Header bar (Thanh đầu trang) được hiển thị trên đầu cửa sổ giao diện, bao gồm tất cả các lựa chọn và nút lệnh liên quan tới tập tin, lựa chọn, layer, loại, v.v.
Side bar (Thanh bên) hiển thị toàn bộ các thiết lập về nội dung và giao diện cho từng yếu tố trên trang web của bạn.
Web front (Giao diện trang web) là khu vực bạn có thể xem và tuỳ chỉnh trang web của bạn. Bạn có thể nhấp chọn và kéo từng yếu tố để thay đổi thứ tự của chúng trên trang web tuỳ ý.
C. Header bar
Vui lòng tham khảo danh sách các lựa chọn và nút lệnh trên Header bar dưới đây.
Exit (Tắt): Đóng Website Builder và quay trở lại trang quản trị.
Nút layer: Mở bảng điều khiển Layer.
Nút style: Mở bảng điều khiển Styling settings (thiết lập giao diện).
Nút insert: Mở bảng điều khiển Insert giúp bạn chèn thêm nhiều yếu tố vào trang web.
Tên của trang web bạn đang chỉnh sửa.
Thông báo trạng thái lưu trang.
Nút Undo (hoàn tác).
Nút Redo (khôi phục).
Nút xem trước: Xem trước trang web trên website của bạn.
Nút chuyển đổi thiết bị*: Chuyển đổi giữa giao diện máy tính và điện thoại.
Nút lưu.
Nút tuỳ chọn: Các tính năng thiết lập nâng cao.
D. Web front
Phần này hiển thị toàn bộ giao diện trang web sau khi trang này được đăng tải. Bạn có thể chọn để hiển thị giao diện máy tính hoặc di động để dễ dàng hình dung hơn.
Bạn có thể nhấp chọn và kéo từng khối thiết kế trong phần Web front để thay đổi vị trí của chúng trên trang web.
Khi hiển thị trên giao diện máy tính và di dộng, tất cả nội dung và thiết lập của từng khối thiết kế sẽ được đồng bộ hoá. Tuy nhiên, Website Builder cũng bao gồm một chức năng cho phép người dùng điều chỉnh màu sắc, kiểu dáng và kích thước khác nhau cho từng loại thiết bị.
E. Side bar settings
Mục này bồm gồm các thiết lập thanh bên (Side bar), bảng điều khiển Layer (Layer panel), và bảng Insert (Insert panel) giúp bạn dễ dàng thiết lập các giá trị và thuộc tính của từng mục (section), hàng (row), cột (column), và khối (block).
Vui lòng tham khảo các bài hướng dẫn dưới đây của chúng tôi:
Thiết lập mục (section) trên Website Builder
Thiết lập khối (block) trên Website Builder
F. Layer panel
Trong bảng điều khiển Layer (Layer panel), bạn có thể xem danh sách các layer của trang web mà bạn đang thiết kế:
Mỗi layer sẽ có các cấu trúc sau: Mục (Section) > Hàng (Row) > Cột (Column) > Khối (Block).
Mỗi layer có thể chứa các layer con (sublayer) mà bạn có thể tuỳ chỉnh theo ý thích.
Danh sách các layer sẽ được xếp theo thứ tự hiển thị các yếu tố trên trang web của bạn, từ trên xuống dưới. Bạn có thể dễ dàng chọn và kéo để sắp xếp lại thứ tự của các layer.
Khi bạn thêm các yếu tố mới vào 1 trang web, chúng cũng sẽ hiển thị của bảng điều khiển Layer.
Vui lòng tham khảo các bài hướng dẫn dưới đây của chúng tôi:
Thiết lập mục (section) trên Website Builder
Thiết lập khối (block) trên Website Builder
G. Insert panel
Bảng Insert (Insert panel) sẽ giúp bạn thêm nhiều khối (block) và mục (section) vào trang web của bạn.
Bạn có thể chọn 1 khối hoặc mục từ thư viện có sẵn của chúng tôi để sử dụng và tuỳ chỉnh.
Khối và mục được lưu về thư viện của bạn cũng được hiển thị ở đây để bạn dễ dàng lựa chọn và thiết lập đồng nhất trang web của bạn.
H. Quick bar settings
Bạn có thể sử dụng quick bar settings (thanh thiết lập nhanh) để chỉnh sửa nhanh các yếu tố trên trang web. Tuỳ thuộc vào cách sử dụng và thuộc tính thực tế của từng yếu tố, các thanh thiết lập nhanh khác nhau sẽ được hiển thị. Dưới đây là danh sách của các thiết lập nhanh thông dụng nhất:
Di chuyển yếu tố lên trước/xuống sau 1 lớp.
Ẩn yếu tố được chọn.
Nhân bản yếu tố được chọn.
Lưu yếu tố vào thư viện của bạn.
Xoá yếu tố được chọn.
I. Styling settings
Styling settings (Thiết lập giao diện), bao gồm giao diện toàn website (Site style) và giao diện trang riêng (Page style), cho phép người dùng dễ dàng thiết lập màu, phông chữ, và kiểu nút bấm giống nhau cho toàn bộ website của bạn. Các thiết lập này giúp website của bạn có 1 giao diện đồng nhất.
Nếu bạn cần thiết kế 1 trang web riêng biệt với giao diện và màu sắc khác, bạn có thể sử dụng thiết lập giao diện trang riêng (Page style). Các tính năng này sẽ tạo ra 1 giao diện riêng cho trang web bạn đang chỉnh sửa mà không ảnh hưởng tới giao diện chung của toàn bộ website.
Sau khi thiết lập giao diện, bạn cũng có thể lưu lại về thư viện để dùng sau.
Vui lòng tham khảo bài hướng dẫn dưới đây của chúng tôi:
Hiểu về thiết lập giao diện trên Website Builder
Cập nhật vào: 27/10/2023
Cảm ơn!