Thiết Lập Chung

1. Thiết lập chung cho trang

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung

1.1. Favicon

Chọn Dùng Favicon, Tải lên hoặc Thay thế thành hình ảnh Favicon mới

1.2. Hình ảnh chia sẻ trang chủ

Bạn có thể Thay thế ảnh mới cho Hình ảnh chia sẻ trang chủ

2. Màu sắc

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Màu sắc

Bạn click vào màu sắc cần thiết lập, chọn màu bằng cách chấm chuột vào vị trí màu muốn hiển thị hoặc nhập mã màu HEX vào ô nhập bên dưới.

• Màu chính: là màu chủ đạo của trang (bao gồm các nút trên trang chủ, đường viền cho nút và nhiều vị trí khác không có thiết lập màu sắc riêng thì sẽ hiển thị theo màu chủ đạo)

  → Màu thanh trình duyệt trên thiết bị di động cũng được hiển thị theo màu chính

• Màu chữ: Chữ hiển thị trên trang sẽ lấy theo màu này (ngoại trừ những chữ có thiết lập riêng)

• Màu nền trang: Màu nền tất cả các trang sẽ thiết lập ở đây

• Màu liên kết khi hover: tức là khi rê chuột vào link thì chữ sẽ đổi sang màu này

• Màu giá, màu nền % giảm giá, màu chữ % giảm giá

• Màu nút thêm vào giỏ, màu chữ thêm vào giỏ, màu nút thanh toán

3. Meta Keywords cho trang chủ (SEO)

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Meta Keywords cho trang chủ (SEO)

4. Thông tin liên hệ chung

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Thông tin liên hệ chung

5. Thiết lập chung cho sản phẩm

5.1. Đổi ảnh khi rê chuột vào sản phẩm

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Thiết lập chung cho sản phẩm > Chọn Đổi ảnh khi rê chuột vào sản phẩm

5.2. Dùng nút xem nhanh (desktop)

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Thiết lập chung cho sản phẩm > Chọn Dùng nút xem nhanh (desktop)

Nút xem nhanh sẽ hiển thị khi khách rê chuột vào ảnh sản phẩm (ở danh sách sản phẩm)

5.3. Dùng nút thêm vào giỏ

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Thiết lập chung cho sản phẩm > Chọn Dùng nút thêm vào giỏ

Trường hợp sản phẩm có:

• Một biến thể (phiên bản): hiển thị nút Thêm vào giỏ → thêm ngay sản phẩm vào giỏ

• Nhiều biến thể (phiên bản): hiển thị nút Tùy chọn → bạn được thiết lập hành động cho nút Tùy chọn này

  • Đi đến trang chi tiết sản phẩm → chọn biến thể sản phẩm → Thêm sản phẩm vào giỏ

  • Thêm nhanh sản phẩm ở Quickview (Popup Xem nhanh) → Chọn biến thể sản phẩm → Thêm sản phẩm vào giỏ

6. Biến thể màu sắc

Biến thể màu sắc sẽ hiển thị ở danh mục sản phẩm và trang chi tiết sản phẩm như hình dưới đây

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Biến thể màu sắc

Có 2 kiểu hiển thị biến thể màu sắc:

• Hiển thị ảnh của biến thể: ảnh biến thể được nhập trong phần quản lý sản phẩm và tên biến thể màu sắc phải đặt trùng với tên quy định trong thiết lập

• Hiển thị dạng nút màu: nhập tên biến thể và tên màu trùng với tên được quy định trong thiết lập

7. Bộ nút icon liên hệ (desktop)

Bộ nút liên hệ được hiển thị neo ở góc dưới bên phải toàn bộ các trang trên desktop

Bao gồm 3 nút: Hotline, Zalo, Facebook Messenger

7.1. Hiển thị bộ nút

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Bộ nút icon liên hệ (desktop) > Chọn hiển thị bộ nút

7.2. Icon Hotline

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Icon Hotline

Bạn có thể thiết lập:

• Bật / tắt hiển thị icon hotline

• Thêm nội dung ghi chú cho nút (ghi chú này sẽ hiển thị khi khách hàng rê chuột vào nút).

Ghi chú

• Số điện thoại sẽ được lấy theo thiết lập ở mục Thông tin liên hệ chung

7.3. Icon Zalo

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Icon Zalo

Bạn có thể thiết lập:

• Bật / tắt hiển thị icon Zalo

• Thêm nội dung ghi chú cho nút (ghi chú này sẽ hiển thị khi khách hàng rê chuột vào nút).

• Thêm link chat Zalo theo ID tài khoản Zalo cá nhân hoặc OA ID Doanh nghiệp.

Cách lấy link chat Zalo:

• Link chat Zalo có cú pháp https://zalo.me/ID

• Trong đó:

  • ID đối với tài khoản Zalo cá nhân là Số điện thoại sử dụng để đăng ký tài khoản đó hoặc Username của tài khoản.

  • ID đối với tài khoản Doanh nghiệp là Official Account ID. Xem thêm hướng dẫn lấy OA ID

7.4. Icon Messenger

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Icon Messenger

Bạn có thể thiết lập:

• Bật / tắt hiển thị icon Messenger

• Thêm nội dung ghi chú cho nút (ghi chú này sẽ hiển thị khi khách hàng rê chuột vào nút).

• Thêm link chat Messenger theo ID tài khoản Fanpage Facebook.

Hướng dẫn nhập link Facebook Messenger

Trường hợp 1: Với Fanpage hoặc trang cá nhân đã tạo được @username

Cú pháp thiết lập:

• Cách 1: https://m.me/[username]

• Cách 2: https://www.messenger.com/t/[username]

Ví dụ: fanpage có link https://www.facebook.com/EGAnyTech thì username là EGAnyTech

--> Vậy link Facebook messenger là:

• https://m.me/EGAnyTech
• hoặc https://www.messenger.com/t/EGAnyTech

Trường hợp 2: Với Fanpage hoặc trang cá nhân chưa tạo được @username

Cú pháp thiết lập:

• Cách 1: https://m.me/[ID Fanpage Facebook hoặc cá nhân]

• Cách 2: https://www.messenger.com/t/[ID Fanpage Facebook hoặc cá nhân]

Ví dụ: fanpage có link https://www.facebook.com/Báo-giá-thi-công-điện-nước-tphcm-322183071720389 thì ID là 322183071720389

--> Vậy link Facebook messenger là

• https://m.me/322183071720389
• hoặc https://www.messenger.com/t/322183071720389

8. Bộ nút tối ưu chuyển đổi (dưới mobile)

8.1. Hiển thị bộ nút

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Bộ nút tối ưu chuyển đổi (dưới mobile)

Bộ nút sẽ hiển thị ở các trang mặc định như trang chủ, trang danh mục sản phẩm, trang tin tức, trang liên hệ,… Riêng trang chi tiết sản phẩm sẽ hiển thị những nút khác, hỗ trợ việc mua hàng được nhanh chóng hơn.

Bạn được thiết lập ẩn / hiện toàn bộ các nút ở trang mặc định và trang sản phẩm

Hoặc thiết lập ẩn / hiện nút mua hàng ở trang sản phẩm

8.2. Nút điều hướng (dạng liên kết)

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Nút điều hướng 1,2,3

Bạn có thể thiết lập:

• Chọn vị trí hiển thị của nút: từ 1 đến 5

• Nhập tiêu đề cho nút

• Nhập liên kết: khi khách ấn vào nút thì sẽ đến liên kết được nhập

• Tải lên ảnh icon của nút (khuyến nghị ảnh định dạng .png, kích thước 25px x 25px)

8.3. Nút gọi điện

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Nút gọi điện

Bạn có thể thiết lập:

• Chọn vị trí hiển thị của nút: từ 1 đến 5 (chỉ áp dụng cho trang mặc định)

• Tải lên ảnh icon của nút (khuyến nghị ảnh định dạng .png, kích thước 25px x 25px)

• Số điện thoại sẽ được lấy theo thiết lập ở mục Thông tin liên hệ chung

8.4. Nút nhắn tin

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Nút nhắn tin

Bạn có thể thiết lập:

• Chọn vị trí hiển thị của nút: từ 1 đến 5 (chỉ áp dụng cho trang mặc định)

• Tải lên ảnh icon của nút (khuyến nghị ảnh định dạng .png, kích thước 25px x 25px)

• Nhập link Facebook Messenger.

Hướng dẫn nhập link Facebook Messenger

Trường hợp 1: Với Fanpage hoặc trang cá nhân đã tạo được @username

Cú pháp thiết lập:

• Cách 1: https://m.me/[username]

• Cách 2: https://www.messenger.com/t/[username]

Ví dụ: fanpage có link https://www.facebook.com/EGAnyTech thì username là EGAnyTech

--> Vậy link Facebook messenger là:

• https://m.me/EGAnyTech
• hoặc https://www.messenger.com/t/EGAnyTech

Trường hợp 2: Với Fanpage hoặc trang cá nhân chưa tạo được @username

Cú pháp thiết lập:

• Cách 1: https://m.me/[ID Fanpage Facebook hoặc cá nhân]

• Cách 2: https://www.messenger.com/t/[ID Fanpage Facebook hoặc cá nhân]

Ví dụ: fanpage có link https://www.facebook.com/Báo-giá-thi-công-điện-nước-tphcm-322183071720389 thì ID là 322183071720389

--> Vậy link Facebook messenger là

• https://m.me/322183071720389
• hoặc https://www.messenger.com/t/322183071720389

8.5. Nút giỏ hàng

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Nút giỏ hàng

Bạn có thể thiết lập:

• Chọn ẩn / hiển nút giỏ hàng (nút này chỉ hiển thị ở trang sản phẩm)

• Tải lên ảnh icon của nút (khuyến nghị ảnh định dạng .png, kích thước 25px x 25px)

9. Popup khi vào website

Truy cập Admin > Tùy chỉnh giao diện > Thiết lập chung > Popup khi vào website

Bạn có thể thiết lập các mục sau:

• Chọn ẩn / hiện popup

• Nhập thẻ alt cho ảnh

• Tải lên ảnh (kích thước chiều rộng gợi ý tối đa 800px)

• Đặt chiều rộng và chiều cao chính xác cho hình ảnh để cải thiện CLS (https://web.dev/optimize-cls/)

Sau khi thực hiện theo hướng dẫn trên, bạn đã có thể Thiết lập chung cho giao diện trên Haravan. Trong quá trình thiết lập, nếu có thắc mắc vui lòng liên hệ [e-mail]