Hướng dẫn sử dụng thành phần Single image

Single image đúng như tên gọi, nó cho phép chúng ta chèn ảnh đơn vào trong Row và để hiểu hơn về công cụ này chúng ta sẽ làm một mẫu sử dụng chức năng Single image trong WPBakery page builder. Dịch vụ thiết kế website của chúng tôi hỗ trợ nhiều block khác nhau giúp bạn có thể tùy biến trang của mình một cách dể dàng. Và đây là bài hướng dẫn sử dụng block Single image.

Mẫu ảnh

Hướng dẫn

Bước 1: Bạn vào chức năng trang trên thanh menu và tạo cho mình một trang mới

Bước 2: Bạn chọn vào Backend Editor trên trang thêm trang mới

 

Tiếp theo bạn chọn vào Add element để hiện trình chỉnh sửa Backend Editor của WPBakery page builder

Bước 3: Bạn chọn vào Block Row

Bước 4: Tại Row đầu tiên bạn chọn vào dấu cộng trên nó → Chọn Block Custom heading

 

Bước 4: Trong bảng Custom heading settings bạn điền thông tin như hình sau:

 

  1. Bạn điền tên cho Custom heading nếu theo mẫu trên sẽ là: Nature of Description
  2. Chọn thành phần thẻ (Element tag) là: h1

Kết quả điền

 

Sau khi điền đầy đủ thông tin như vậy bạn chọn Save changes

Bước 5: Bạn chọn vào dấu cộng bên dưới Custom heading → Chọn Block text

Bước 6: Tại bảng Text block setting bạn nhập dòng chữ giống như hình mẫu → Chọn save changes

Bước 7: Bạn chọn dấu cộng bên dưới Row thứ nhất → Chọn Block Row (Tạo một Row thứ 2)

Bước 8: Chia số cột ra làm 3, phần bằng nhau (Nếu bạn chưa xem hướng dẫn sử dụng chức năng row thì có thể xem nhanh đường dẫn này: Hướng dẫn sử dụng thành phần Row)

Bước 9: Bạn chọn vào dấu cộng ở cột Row thứ nhất (1) → Chọn Block Single image

Bước 10: Tại bảng single image settings bạn chọn ảnh đầu tiên trên mẫu vào, bằng cách nhấn vào dấu cộng màu xanh bên dưới chữ image → chọn save changes

Bước 11: Bạn chọn vào dấu cộng bên dưới Single image → Chọn Block Text

Bước 12: Tại bảng Text block settings nhập chữ giống hình mẫu → Chọn save changes

Tương tự như ở cột Row (1) Bạn cũng làm thế với cột Row (2) và cột Row thứ (3)

 

Sau khi hoàn tất sẽ như hình sau:

Như vậy là chúng ta đã hoàn thành mẫu bây giờ hãy xem kết quả 

Lời kết

Sử dụng dịch vụ thiết kế website của freewebapp.net để có tính năng mạnh mẽ phục vụ chiến dịch marketing của bạn tốt nhất.

Để lại nhận xét

X