Cách xây dựng trang giới thiệu sản phẩm với Divi Builder

Trước khi vào vấn đề chính chúng ta cần tìm hiểu những điều cơ bản về Divi Builder.

Bạn luôn có thể sáng tạo hơn với màu sắc khác nhau, kiểu dáng hoặc nhiều yếu tố hơn. Nhưng đó chỉ là một cái nhìn nhanh chóng. Nhưng đối với Divi Builder bạn có thể xây dựng trang giới thiệu sản phẩm đẹp mắt chỉ trong vòng một giờ.

Tại sao bạn nên xây dựng trang giới thiệu sản phẩm với Divi Builder?

Divi Builder được phát triển bởi một công ty có tên Elegant Themes, công ty đã xây dựng một cộng đồng lớn người dùng Divi hữu ích. Điều đó có nghĩa là bạn có thể tìm thấy vô số tiện ích mở rộng gọn gàng và sự giúp đỡ của bên thứ ba nếu bạn muốn nhận sự hỗ trợ.

Nó cũng có vô số tiện ích sau:

Bởi vì đó là một plugin ( cộng với cả phiên bản chủ đề ), nó hoạt động với tất cả các chủ đề WordPress, bao gồm tất cả các chủ đề WordPress.

Nó bao gồm nhiều mô-đun khác nhau, cho phép bạn thêm các nội dung hữu ích như danh sách tính năng, biểu mẫu,…

Tất cả các thiết kế mà Divi Builder tạo ra đều đáp ứng. Đó là, chúng thân thiện trên điện thoại di động và máy tính bảng.

Và dưới đây là các bước cần làm để xây dựng trang giới thiệu sản phẩm với Divi Builder.

Bước chuẩn bị: Cài đặt Divi Builder và chọn một chủ đề

Divi Builder là một plugin cao cấp, vì vậy, nếu bạn chưa có, bạn sẽ cần mua plugin tại Elegant Themes

Bước 1: Tạo trang mới với mẫu có chiều rộng đầy đủ và khởi chạy Divi Builder

Mẫu trang là những gì xác định bố cục cơ bản của trang của bạn. Về cơ bản, họ định nghĩa các canvas mà Divi Builder được phép hoạt động.

Đầu tiên, điều quan trọng là chọn mẫu có chiều rộng đầy đủ .

Nếu chủ đề của bạn không cung cấp một mẫu có chiều rộng đầy đủ, bạn có thể muốn xem xét việc chọn một chủ đề hiện đại hơn.

Đảm bảo nhấp vào nút Lưu Bản nháp sau khi chọn mẫu của bạn.

Để khởi chạy Trình tạo Divi, nhấp vào nút Sử dụng nút Trình tạo Divi lớn : khởi chạy plugin để xây dựng trang giới thiệu sản phẩm với Divi Builder

Divi Builder cho phép bạn xây dựng các trang theo hai cách khác nhau:

Trình tạo cuối cùng – bạn xây dựng các trang của mình bằng các khối trừu tượng đại diện cho các phần nội dung

Trình xây dựng trực quan – bạn xây dựng các trang của mình trong cùng một chế độ xem.

Mặc dù bạn có thể sử dụng hai trình nàyđể xây dựng trang giới thiệu sản phẩm với Divi Builder, nhưng chúng tôi thấy trình xây dựng trực quan sẽ trực quan hơn cho hầu hết người dùng.

Để khởi chạy trình xây dựng hình ảnh, bấm vào tùy chọn Sử dụng Trình tạo hình ảnh.

Sau đó, bạn sẽ thấy mình trong giao diện trực quan.

Divi sử dụng màu sắc để phân chia các loại nội dung khác nhau trên trang của bạn. Những màu này sẽ giúp ích khi bạn xây dựng trang, vì vậy đây là hướng dẫn nhanh về ý nghĩa của các màu khác nhau trong Divi Builder:

Màu xanh – chỉ định các phần, người giữ nội dung lớn nhất.
Màu xanh lá cây – chỉ định hàng. Hàng đi vào bên trong các phần. Bạn có thể có nhiều hàng trong một phần.
Đen – chỉ định các mô-đun. Các mô-đun là các phần nội dung riêng lẻ đi bên trong các hàng. Bạn có thể có nhiều mô-đun bên trong mỗi hàng.

Bước 2: Xây dựng cấu trúc trang đích cơ bản của bạn

Bây giờ đã đến lúc bạn chọn cấu trúc cơ bản thực tế cho trang đích của bạn.

Để có một trang giới thiệu sản phẩm cơ bản bạn cần kết hợp bốn phần khác nhau:

Phần tiêu đề chính
Danh sách tính năng của người truy cập
Thông tin
Phần chọn tham gia email.

Trước khi bắt đầu đi sâu vào hướng dẫn thực tế, hãy để chúng tôi giới thiệu nhanh về cách thức hoạt động của giao diện Divi Builder.

Để thêm một phần, hàng hoặc mô-đun mới, bạn chỉ cần nhấp vào nút cộng tròn cho phần tử được liên kết.

Ngoài ra, hãy nhớ rằng mỗi phần tử phù hợp với bên trong một phần tử khác. Vì lý do đó, bạn sẽ chỉ thấy nút Chèn Mô-đun màu đen nếu bạn đã đặt một hàng bên trong phần của mình.

Khi bạn nhấp vào nút Chèn Mô-đun , bạn sẽ có thể chọn một loại mô-đun cụ thể từ cửa sổ bật lên.

Sau đó, khi bạn chèn một mô-đun, bạn có thể định cấu hình mô-đun đó bằng cách sử dụng cửa sổ bật lên khác.

Chú ý có ba tab ở trên cùng? Điều đó quan trọng vì nó cho phép bạn tùy chỉnh kiểu dáng, khoảng cách và nhiều thứ khác cho mỗi mô-đun. Bạn có thể sử dụng các cài đặt này để tinh chỉnh thiết kế của bạn.

Cuối cùng, bạn luôn có thể truy cập bảng cài đặt cho các phần, hàng và mô-đun bằng cách nhấp vào biểu tượng cho từng thành phần.

Những điều trên sẽ cung cấp cho bạn sự hiểu biết cơ bản về giao diện – bây giờ hãy tìm hiểu cách xây dựng trang giới thiệu sản phẩm với Divi Builder!

Xây dựng phần tiêu đề

Đối với phần đầu tiên này, chúng ta có thể chuyển sang thêm một Hàng (biểu tượng màu xanh lá cây). Hãy chọn cách bố trí hai cột bằng nhau:

Bây giờ, thêm mô-đun Hình ảnh vào cột bên phải và chèn hình ảnh có liên quan.

Sau đó, trong cột bên trái, thêm mô-đun Văn bản . Sử dụng trình đơn thả xuống Tiêu đề 1 để làm tiêu đề và căn giữa văn bản.

Sau đó, đi đến Thiết kế → Khoảng cách để định vị lại tiêu đề để nó trông tốt hơn.

Bây giờ, thêm một mô-đun Văn bản khác bên dưới tiêu đề để hoạt động như tiêu đề phụ của bạn.

Hãy hoàn thành mọi thứ bằng cách thêm một mô-đun Nút bên dưới phân nhóm của chúng tôi.

Xây dựng danh sách tính năng

Tiếp theo, hãy xây dựng phần danh sách tính năng. Để làm điều đó, hãy thêm Phần hoàn toàn mới bằng cách nhấp vào biểu tượng màu xanh lam cộng với màu xanh dương.

Sau đó, thêm một hàng 3 cột bên trong phần:

Một cách dễ dàng để thêm danh sách tính năng là sử dụng mô-đun Blurb . Để định cấu hình mô-đun Blurb giống như ví dụ bên dưới, không sử dụng hộp Tiêu đề . Thay vào đó, hãy sử dụng khu vực Nội dung để thêm tiêu đề của bạn dưới dạng, văn bản con của bạn dưới dạng văn bản thông thường và tập trung vào toàn bộ nội dung.

Sau đó, trong cùng một tab, cuộn xuống Hình ảnh & Biểu tượng. Chọn hộp Sử dụng Biểu tượng và chọn biểu tượng của bạn. Bạn cũng có thể chọn sử dụng hình ảnh của riêng mình, nếu bạn thích cách tiếp cận đó.

Lặp lại quy trình cho các tính năng còn lại của bạn

Xây dựng phần Giới thiệu cơ bản

Để xây dựng phần giới thiệu cơ bản, chúng ta hãy sử dụng một thiết kế hai cột có phần bù.

Ở cột bên trái, bạn có thể thêm mô-đun Hình ảnh bằng ảnh cá nhân hoặc nội dung khác có liên quan.

Sau đó, ở cột bên phải, bạn có thể thêm hai mô-đun Văn bản cho tiêu đề và văn bản con.

Xây dựng phần chọn tham gia email

Divi Builder bao gồm một mô-đun chọn tham gia email được xây dựng trước. Điều đó làm cho phần này khá đơn giản. Các mô-đun như thế này là một trong những lý do rất dễ dàng để xây dựng trang giới thiệu sản phẩm với Divi Builder.

Để sử dụng nó, hãy tạo một phần mới thông thường với bố cục một cột.

Sau đó, thêm mô-đun Email Optin . Bạn có thể sử dụng hộp Tiêu đề và Nội dung để thêm văn bản vào bên trái của optin email của bạn. Và bạn cũng có thể thay đổi màu nền và kết nối với dịch vụ tiếp thị email của mình từ cùng giao diện này.