[Web30s – v.3] [Page-Editor] Làm việc với Widget Nút bấm

  • Monday 13/04/2020

Giao diện Widget Nút Bấm

Quý Khách trong phần “Thêm widget” chọn mục “Nút Bấm” để thêm Widget Nút Bấm vào đoạn của Quý Khách đang thao tác rồi bắt đầu sử dụng.

 

 

 

Quý Khách có thể thiết kế lại giao diện nút bấm trong mục “Giao diện” 

  • Quý Khách có thể lựa chọn mẫu nút bấm bên công ty PA thiết kế sẵn hoặc thiết kế lại giao diện nút bấm theo sở thích trong “Tùy chỉnh giao diện”

Thiết kế giao diện nút bấm

Trong đây Quý Khách có thể tùy chỉnh giao diện nút bấm

Mục Thiết Kế

  Nền:

Mặc định sẽ ở chọn màu nền nút bấm theo mẫu Quý khách  chọn. Cài đặt nền nút bắm với:

– Màu cơ bản: Quý khách sẽ có bản màu chuẩn phổ thông để chọn lựa hoặc tự điều chỉnh tham số màu chuẩn RGB hoặc HEXA. Ngoài ra, còn có các thiết lập overlay để phủ lớp màu khác lên màu chính (dạng transparent – trong suốt).

– Hình ảnh: Quý khách sử dụng hình ảnh làm nền cho Nút Bấm. Ngoài ra, còn có các thiết lập nâng cao cho hình nền hiển thị; Nền cho ảnh; Các kiểu thể hiện ảnh như vừa khung, nằm trong khung, v.v…

– Màu Gradient: là dạng màu chuyển sắc, Quý khách có thể thiết lập nhiều lớp chuyển màu tùy nhu cầu.

Thiết lập chữ:

– Kiểu chữ: Quý Khách chọn font-chữ cho chữ viết trong nút bấm

– Độ đậm: thay đổi độ đậm – nhạt của chữ viết trong nút bấm

– Vị trí chữ: căn chỉnh vị trí chữ trong nút bấm gồm : căn trái, căn phải, căn giữa 

– Gạch chân: gạch chân chữ viết trong nút bấm

– Định dạng: định dạng xuất hiện của nội dung trong nút bấm : in hoa, in hoa chữ cái đầu,…

– Màu chữ:  thiết lập màu nội dung trong nút bấm

– Kích thước chữ: tùy chọn kích thước chữ hiện thi (theo pixel)

– Khoảng cách dòng: khoảng cách giữa các dòng chữ trong nút bấm (với các đoạn nội dung nhiều dòng)

– Khoảng cách chữ: khoảng cách giữa các chữ trong nút bấm.

Đổ bóng chữ

– Thiết lập đổ bóng cho chữ viết trong nút bấm

Đổ bóng

– Thiết lập đổ bóng cho nút bấm

Đường viền

– Chỉnh đường viền cho khung bao ngoài của nút bấm

+ Kiểu: Kiểu dáng của đường viền ngoài như: nét đậm, nét đứt,…

+ Màu: Màu sắc của đường  viền ngoài

+ Độ rộng :

Tất cả: kích thước cả đường viền khung nút bấm

Bên phải: kích thước đường viền khung bên phải

Bên trái: kích thước đường viền khung bên trái

Bên trên: kích thước đường viền khung bên trên

Bên dưới: kích thước đường viền khung bên dưới

Căn lề

+ Căn lề các đoạn nội dung chữ viết trong nút bấm

+ Căn lề :

Tất cả: căn lề  đoạn nội dung với khung nút bấm

Căn phải: căn kích thước cách khung bên phải

Căn trái: căn kích thước cách khung bên trái

Căn trên: căn kích thước cách khung bên trên

Căn dưới: căn kích thước cách khung bên dưới

Bo góc

Thiết lập bo tròn góc cho khung nút bấm

 + Bo góc:

Tất cả: bo tròn tất cả các góc

Bo góc phải trên: Bo tròn cạnh góc phải phía trên khung nút bấm

Bo góc phải dưới: Bo tròn cạnh góc phải phía dưới khung nút bấm

Bo góc trái trên: Bo tròn cạnh góc trái phía trên khung nút bấm

Bo góc trái dưới: Bo tròn cạnh góc trái phía dưới khung nút bấm

Biểu tượng

 Quý Khách có thể chèn thêm các biếu tượng vào khung nút bấm

 

Mục Rê Chuột

Quý Khách có thẻ thay đổi giao diện của nút bấm khi trỏ chuột vào nút bấm.

Với các tính năng tùy chỉnh như trong thiết kế

+ Nền 

+ Thiết lập chữ

+ Đường viền

+ Bo góc

+ Độ trong suốt: tăng- giảm độ trong suốt của nút bấm

Mục Hiệu Ứng

Quý Khách chọn hiệu ứng của nút bấm xuất hiện khi tải trang website.

Cấu hình vị trí Widget nút bấm

Để cầu hình vị tri cho Widget nút bấm, Quý Khách chọn “Cấu hình chung” để thiết lập

Mục Kích thước

+ Vừa khung rộng: Chỉnh khung nút bấm rộng bằng đoạn

+ Chiều cao co giãn theo nội dung: Cố định nút bấm thay dôi vị trí theo nội dung trong đoạn tránh widget đè lên đoạn văn.

+ Cố định chiều cao: Cố định kích thước chiều cao của widget

+ Cố định chiều rộng: cố định kích thước chiều rộng của widget

Chiều cao, chiều rộng: tùy chỉnh kích thước chiều cao, chiều rộng của widget ( tính theo pixel)

Mục Vị Trí

+ Cố định vị trí trái: cố định khoảng cách  widget với khung trái của đoạn

+ Cố định vị trí trên: cố định khoảng cách widget với khung trên của đoạn

+ Vị trí(Trái): khoảng cách  widget với khung trái của đoạn

+ Vị trí(Trên): khoảng cách  widget với khung trên của đoạn

Độ lệch trái, phải: độ lệch giữa của widget so với vị trí thiết lập trong mục Vị trí(Trái)

Độ lệch trên, dưới: độ lệch giữa của widget so với vị trí thiết lập trong mục Vị trí(Trên)

Khác

Trong mục này Quý Khách thiết lập được:

 + Độ ưu tiên: ưu tiên widget hiện thị so với widget khác. Áp dụng khi Quý Khách muốn thiết lập 2 widget đè nhau.

+ Tràn nội dung: thiết lập nội dung hiện thị khi widget đè nhau.

Tính năng chung

Tính năng:

+ Trượt Lên trên: thiết lập cho widget xếp lên trước một widget khác ở trên

+ Trượt Xuống dưới: thiết lập cho widget xếp xuống dưới một widget khác ở dưới.

+ Nhân bản: sao chép và tạo ra 1 bản sao của widget hiện tại

+ Xóa widget: xóa bỏ widget hiện tại

+ Ẩn widget: ẩn widget hiện tại không hiện thị lên trang website

+ Chỉnh sửa nội dung; chỉnh sửa nội dung text xuất hiện trong widget

+ Liên kết: thêm link kết nối widget với trang website bên ngoài hoặc tới trang con trong website.

Thiết lập dữ liệu

Trong mục này, Quý Khách có thể thiết lập nội dung xuất hiện lên widget.

+ Mặc định: khi chọn dạng mặc định Quý Khách sẽ cần phải thêm nội dung cho widget trong phần “Chỉnh sửa nội dung”.

+ Dữ liệu trang: Quý Khách thiết lập lấy các dữ liệu Quý Khách đã thêm trong mục Quản lý website trong trang Admin.

Thiết lập Liên Kết
Hiện tại có 3 widget có thể sử dụng phần liên kết này là Widget Tiêu đề, Widget Hình ảnh và Widget Nút bấm ạ

Trên đây là các hướng dẫn để Quý khách có thể thao tác với Widget Nút bấm.

Cảm ơn Quý khách đã sử dụng dịch vụ của PA Việt Nam!

P.A Việt Nam – Web30s