Hướng dẫn chi tiết

Sơ đồ tổng quan

Hướng dẫn sử dụng tính năng

Hướng dẫn chi tiết quy trình các bước để hoàn thiện một Landing Page hoàn chỉnh

Cùng LadiPage thiết kế Landing Page, dễ dàng, nhanh chóng và đạt chuyển đổi cao

Khám phá ngay

I. Quy trình tổng quan

3. Chỉnh sửa desktop/mobile

4. Liên kết icon và nút

5. Thao tác lưu data về email

6. Mua tên miền

7. Trỏ tên miền

8. Xuất bản

1. Lên nội dung chi tiết cho toàn trang

2. Truy cập builder và chọn mẫu giao diện phù hợp

1. Khái niệm Section trong Landing Page?

Section được hiểu là một khối nội dung viết về một chủ đề cụ thể.
Trong 1 trang Landing Page với nội dung rất dài, để làm rõ nội dung và tăng sự lôi cuốn người đọc, bạn cần phải chia ra thành các section nhỏ với các chủ đề khác nhau.

Vì sao cần chia Landing Page thành nhiều Section?

Giúp tạo trang có bố cục rõ ràng, chuyên nghiệp hơn
Giúp tạo các phần nổi bật trên trang (ví dụ form đăng ký) dễ dàng hơn, giúp trang có điểm nhấn, từ đó khách hàng có thể tập trung vào các section được nhấn mạnh
Hỗ trợ chỉnh sửa/di chuyển/kéo thả các phần tử dễ dàng hơn, đặc biệt khi sử dụng kiểu thiết kế Responsive

Hero Section

Section 01

Section 02 II. Hướng dẫn lên nội dung cho từng Section

2. 12 Sections cơ bản thường xuyên sử dụng khi tạo Landing Page

Tùy vào từng nội dung và mục đích sử dụng mà bạn có thể chia Landing Page thành nhiều section khác nhau.

Bạn phải nắm bắt được khách hàng mục tiêu của mình, từ đó khéo léo đưa những thông tin cần thiết vào
Landing Page theo các section phù hợp.
Dưới đây là 12 sections cơ bản mà 1 trang Sales Page hay sử dụng nhất:

2.1 Section Mở Đầu (Intro/Hero)

Xanh- yếu tố bắt buộc:

Dòng tiêu đề trang
Phụ đề: Bổ nghĩa và làm rõ cho tiêu đề
Hình ảnh/video: Giúp thu hút sự chú ý của người đọc, đôi khi chính là ảnh background của section mở đầu
Nút kêu gọi hành động (CTA): Cho người đọc biết họ cần phải làm gì tiếp theo.

Thông điệp chính bạn muốn gửi tới người đọc là gì?
Giá trị tặng kèm cho người đọc (ví dụ voucher, quà khuyến mại, ưu đãi,...)
Sự khác biệt đặc trưng của sản phẩm, dịch vụ
Một lợi ích đặc biệt khi người dùng thực hiện hành động chuyển đổi.

B. Section mở đầu cần gì?

Thay ảnh/video nền cho section
Hiệu ứng phần tử, hiệu ứng animated
Notify: Thông báo đặt hàng ảo
Đồng hồ đếm ngược
Nút bấm
Slide chuyển động: Carousel/Gallery sử dụng full width

C. Gợi ý tính năng

D. Thành phần

Section mở đầu được cấu tạo theo quy tắc Xanh – Vàng – Đỏ.

Vàng - yếu tố bổ sung (không bắt buộc phải có):

Form đăng ký
Liệt kê lợi ích, điểm nổi bật
Logo
Navigation liên kết trong trang
Thông tin liên hệ

Đỏ - yếu tố không nên có:

Liên kết mạng xã hội vì nó dễ khiến lượt traffic bị thất thoát về các kênh khác, còn được gọi là thất thoát chuyển đổi (Leak Conversion). Khi thoát ra ngoài, mục đích ban đầu của người dùng dễ bị phân tán hoặc thậm chí thay đổi.

Hero Section là ấn tượng đầu tiên của khách hàng khi truy cập một trang, đóng vai trò quan trọng trong việc quyết định khách hàng sẽ tiếp tục đọc nội dung của trang hay sẽ thoát.
Đây là phần bạn cần thực hiện một cách sáng tạo, thông minh, lôi cuốn, mục đích chính là giúp cho khách hàng muốn khám phá nội dung của bạn ngay lập tức.

A. Vai trò

Thông tin thú vị

Trong một bài báo khoa học có tên: "Atention web designers: You have 50 milliseconds to make a good frst impression!"

Tạm dịch: “Dân thiết kế website hãy chú ý: Bạn chỉ có 50 mili giây để tạo được ấn tượng ban đầu thật tốt!”

Lời khuyên cho bạn

Lời khuyên cho bạnChúng ta chỉ mất khoảng 50 mili giây (khoảng 0.05 giây) để đưa ra quyết định có tiếp tục ở lại trang hay sẽ rời đi. Ấn tượng ban đầu của khách hàng đối với trang rất quan trọng, ấn tượng càng tốt thì tỷ lệ kéo trang xuống tiếp càng cao và nhiều khả năng thực hiện chuyển đổi hơn.

" Trung bình số người đọc tiêu đề cao gấp 5 lần số người đọc nội dung bài báo. Nếu được trả 1 đô la để viết quảng cáo, hãy đảm bảo bạn đã tiêu 80 Cent và tiêu đề"

- David Ogilvy -

Section mẫu 1

Section mẫu 2

Section mẫu 3

Dưới đây là 1 số section mẫu trong kho giao diện của LadiPage.

ABC FOOD

Chương trình diễn ra trong

:

ĐẶT MUA NGAY

THỊT BÒ NHẬP KHẨU CAO CẤP

YÊU THƯƠNG

Của bữa ăn hạnh phúc

MẢNH GHÉP

500g ba chỉ bò Canada

117.000vnđ

90.

000 VND

500g lõi nạc vai bò Mỹ

199.500vnđ

90.

000 VND

ĐẶT MUA NGAY

Hộp quà Rospemriod

450.000 vnd/ hộp

350.000vnd/ hộp

Sản phẩm bao gồm:

1 Kem bôi

1 Viên uống

&

Giá gốc: 2.200.000 VNĐ

Nay chỉ: 1.470.000 VNĐ

Ngày

Giờ

Phút

giây

Ưu đãi kết thúc sau:

Bấm đặt hàng ngay

Ưu đãi duy nhất hôm nay. Còn 5 hộp cuối cùng!

Mà Các Diễn Viễn Nữ Hạng A Không Muốn Bạn Biết...

Bí mật

LÀN DA TRẮNG HỒNG

CHỈ SAU 21 NGÀY!

LOGO HERE

2.2 Section Đặc điểm nổi bật (Feature)

Để tối ưu nhất section này ta nên liệt kê ngắn ngọn 3 đến 5 đặc điểm nổi bật nhất về sản phẩm dịch vụ sau đó loại trừ bớt và chỉ nên đặt 3 đặc điểm thực sự đắt giá lên Landing Page.

B. Lưu ý

Nội dung được làm nổi bật trên hình hộp, frame
Biểu tượng, hiệu ứng khi rê chuột giúp section thêm sinh động
Tạo nhóm giúp di chuyển các phần tử thêm dễ dàng
Mobile: tính năng Scroll auto giúp cuộn ngang phần tử
Carousel để hỗ trợ có nhiều tính năng cần trình bày

C. Gợi ý tính năng

Đề cập đến những đặc điểm, đặc tính nổi bật của sản phẩm dịch vụ.

A. Vai trò

Section mẫu 1

Section mẫu 2

Section mẫu 3

Dưới đây là 1 số section mẫu trong kho giao diện của LadiPage.

Đăng ký nhận CSBH mới nhất

GIÁ BÁN TỪ

1.16 tỷ

CĂN HỘ STUDIO

QUÀ TẶNG VOUCHER ABC LÊN TỚI

200 tr

*Áp dụng có điều kiện

HỖ TRỢ LÃI SUẤT*

0%

Đến ngày 25/06/2022

TRẢ GÓP TRONG VÒNG

35 năm

10K

+

Sản phẩm được bán ra mỗi năm

1500

Khách hàng

30

Nhà phân phối sỉ

+

99 %

Sự hài lòng đến từ khách hàng

LUÔN ĐẢM BẢO TIÊU CHUẨN QUỐC TẾ

LOREM IPSUM

KHÓA HỌC TẠI

Lộ trình học được phát triển theo khung chuẩn châu Âu CEFR

Phương pháp học tiếng Anh qua giao tiếp linh hoạt

Hoạt động ngoại khóa thường xuyên và hấp dẫn

Môi trường học tập trẻ trung, năng động

Đội ngũ giảng viên, trợ giảng nhiệt huyết

2.3 Section Lợi ích khách hàng (Benefit)

Section đặc điểm nổi bật và lợi ích thường hay bị lẫn với nhau, để dễ dàng phân biệt 2 section này, bạn có thể sử dụng câu hỏi:

1. Sản phẩm dịch vụ của bạn làm được những gì?
Câu trả lời chính là những tính năng (Đặc điểm nổi bật) mà sản phẩm dịch vụ của bạn có được.

2. Sản phẩm dịch vụ của bạn giúp khách hàng giải quyết vấn đề gì?
Đây chính là lợi ích.
Ví dụ nếu sản phẩm của bạn là khóa học Online thì Đặc điểm có thể đặt là “Học trực tuyến qua mạng” và Lợi ích là “Có thể học ở bất cứ đâu, bất cứ khi nào bạn muốn”

Mục lợi ích có thể dùng dạng liệt kê ngắn gọn hoặc chia thành nhiều khối với hình ảnh minh hoạ hấp dẫn kèm theo. Chúng ta nên dựa vào 3 đặc điểm đã đề cập trước đó để tìm hiểu xem những đặc điểm nổi bật ấy sẽ đem lại lợi ích gì.
Đồng thời, những đặc điểm ấy có thể cải thiện vấn đề, khó khăn của khách hàng như thế nào?

Section mẫu 1

Section mẫu 2

Section mẫu 3

Dưới đây là 1 số section mẫu trong kho giao diện của LadiPage.

Reasons Why People Should Buy From You

1

Consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel, tincidunt scelerisque sapien. Quisque commodo orci at odio aliquet pretium.

Here you can write the first

2

Consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel, tincidunt scelerisque sapien. Quisque commodo orci at odio aliquet pretium.

Here you can write the second

CALL TO ACTION

SỰ LỰA CHỌN HOÀN HẢO

Công nghệ thoát hơi ẩm và thoáng khí suốt đêm

Chất liệu siêu mềm mại và thoáng khí của bỉm ABC giúp giải phóng nhanh hơi ẩm bên trong tã cho làn da bé khô thoáng suốt cả đêm

Thấm hút nhanh, chống tràn

- Bỉm mỏng hơn 40 - 50% so với các loại bỉm có mặt trên thị trường.
- Độ thấm hút rất tốt, không hăm không lo tràn...

Đai hông vừa vặn mông bé 360°

Thiết kế đai hông và bẹn quần co giãn, mềm mại - ôm trọn vòng mông trong từng chuyển động, giúp chống tràn, cho bé yêu thật thoải mái.

Tại sao nên chọn Lorem Ipsum?

Với Lorem Ipsum Mọi Thứ Điều Trở Nên Dễ Dàng

3 hương vị yêu thích

100% TruMarine Collagen

Độ ngọt tự nhiên, không đường

Không thành phần biến đổi gen

2500g Lorem mỗi ống

Thích hợp dùng cùng các loại nước trái cây

Thích hợp dùng cùng với nước

2.4 Section Nội dung chi tiết

Nội dung chi tiết là nơi chia sẻ toàn bộ những thông tin chi tiết nhất về sản phẩm dịch vụ.

Đây được coi là Section có nội dung dài nhất trong Landing Page, tuy nhiên việc lựa chọn những thông tin đưa vào Section này nên có sự chọn lọc kỹ lưỡng.

Khách hàng tham khảo nội dung sản phẩm dịch vụ tuy nhiên nếu các thông tin được trình bày quá dài dòng, không có sự thống nhất và liền mạch sẽ dẫn đến tác dụng phụ, khách hàng sẽ nhanh chóng lướt qua thông tin quan trọng nhất.

Vì vậy nội dung không những cần đầy đủ mà phải khiến khách hàng của bạn thích thú với cách thể hiện mà bạn mang lại.

Với một nội dung có ích nhưng không được kết hợp với cách truyền tải thú vị sẽ khiến khách hàng drop-out (Người đọc thoát khỏi trang Landing Page trước khi đọc hết các nội dung).

Vậy các bước cần làm để có Section nội dung chất lượng nhất là gì?

Bước 1: Liệt kê tất cả các nội dung cần có trong Section nội dung chi tiết này.

Bước 2: Chọn lọc những thông tin cần thiết nhất (Nên đặt tối đa 7 nội dung quan trọng nhất, khách hàng ít khi nhớ được nhiều hơn 7 dữ liệu), loại bỏ tất cả các thông tin thứ cấp.

Bước 3: Mỗi nội dung hãy lựa chọn câu từ, cách diễn đạt phù hợp và thu hút đồng thời có sự gắn kết để từ nội dung trước đến nội dung sau có sự liền mạch, lôi cuốn.

Bạn có thể tham khảo các tính năng sau để thiết kế section nội dung chi tiết:

Sử dụng sự kiện ẩn/hiện phần tử giúp bạn ẩn các đoạn nội dung và chỉ hiển thị khi click vào nút bấm tương ứng. Hoặc sử dụng nhóm nút bấm, tạo tabs/section tabs và đi sự kiện chuyển tab cho nút bấm tới nội dung tương ứng.

Section mẫu 1

Section mẫu 2

Section mẫu 3

Dưới đây là 1 số section mẫu trong kho giao diện của LadiPage.

Here you can write the first (second, third…) reason why people should buy from you

The first reason

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel,

Here’s your reasons

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel,

Here’s your reasons

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel,

Here’s your reasons

CALL TO ACTION

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel, tincidunt scelerisque sapien. Quisque commodo orci at odio aliquet pretium. Sed faucibus eget turpis tincidunt tincidunt. Maecenas vel lorem finibus, iaculis diam id, venenatis odio. Curabitur ante metus, luctus quis vestibulum non, rutrum vel nisl. In hac habitasse platea dictumst. Pellentesque varius nisl eget mauris imperdiet, et tempus tortor vehicula. Maecenas eu venenatis dolor.

Reasons why people should buy from you

Đặt trên nền tảng không gian sinh thái của Thành phố biển hồ, các tòa căn hộ Ruby nổi bật với thiết kế kiến trúc ưu tiên nhiều mảng kính lớn, vừa tạo nên vẻ ngoài sang trọng, kiêu hãnh cho cả tòa nhà, vừa mang đến tầm nhìn khoáng đạt cho từng căn hộ.

PHÂN KHU RUBY

Tải thông tin chi tiết

S1.01

S2.01

S1.06

S2.03

S3.01

S3.02

S3.03

S4.01

S4.02

S4.03

Thiết kế căn hộ thông minh, tối ưu diện tích nhưng vẫn đầy đủ công năng sử dụng.
Lối vào tòa nhà thông minh, sử dụng công nghệ Intercom để chủ nhà tự mở cửa cho khách.
Dịch vụ vận hành chuyên nghiệp từ Thương hiệu bất động sản đắt giá nhất Việt Nam – ABC.

Toàn bộ các tòa tháp nằm trong phân khu A đều được quy hoạch theo dòng sản phẩm A, hướng tới giới trẻ năng động, ưa thích công nghệ.

PHÂN KHU ABC

Tải thông tin chi tiết

Phân khu A

Phân khu B

Phân khu C

SẢN PHẨM TỪ CON ABCDEF

LÝ DO BẠN NÊN CHỌN SỬ DỤNG

Giảm đau, chống viêm tự nhiên

Thành phần ABC có chứa các hoạt chất có tác dụng giảm đau, chống viêm nhanh chóng mà không để lại tác dụng phụ như các thuốc tân dược khác. Nhờ tác dụng chống viêm tự nhiên. ABC còn có hiệu quả với Hen suyễn là bệnh viêm mạn tính ở đường hô hấp.

Hạn chế thoái hóa khớp

ABC rất giàu Omega 3, đây là thành phần có tác dụng chống Oxy hóa mạnh giúp trung hòa tế bào gốc tự do, từ đó hạn chế và làm chậm quá trình thoái hóa trong cơ thể bao gồm thoái hóa khớp.

Bảo vệ và tái tạo sun khớp, tăng tiết dịch khớp

Glycosaminoglycans (bao gồm axit hyaluronic, keratin sufate và chondroitin sulfates) là thành phần chính của sụn và dịch khớp. ABC cung cấp nguồn Glycosaminoglycans phong phú (khoảng 12%) cùng với glucosamine, nhiều vitamin và khoáng chất khác có thể ức chế enzyme phá hủy sụn và mô liên kết, giúp bảo vệ và tái tạo sụn khớp, tăng tiết dịch khớp.

MỘT SỐ TÁC DỤNG KHÁC

Phòng chống nguy cơ loãng xương

Calci, magie, kẽm trong ABC và sụn cá mập sẽ giúp tăng cường tái tạo và duy trì sự ổn định của xương, hạn chế loãng xương.

Tăng cường lưu thông máu, tốt cho hệ tim mạch

ABC giàu Omega 3 có tính tăng cường sức bền động mạch, tăng cường lưu lượng máu, ngăn ngừa các cơn đau tim và xơ vữa động mạch.

Tăng cường khả năng sinh sản

ABC giàu kẽm giúp làm tăng độ nhớt, tăng chất lỏng trong tinh dịch của nam giới.

2.5 Section Danh sách sản phẩm

Bạn nên đưa ra những hình ảnh sắc nét và chi tiết, những video clip sống động để trình bày về sản phẩm dịch vụ của mình. Một đoạn video ngắn chính là phương pháp được sử dụng phổ biến nhất hiện nay bởi nó cho khách hàng cảm nhận gần hơn với sản phẩm.

Không nên đưa vào quá nhiều sản phẩm để giới thiệu trừ khi bạn đang cố gắng biến Landing Page thành một gian hàng thương mại điện tử, bạn có thể làm việc đó ở website của mình. Nên phân nhỏ các tệp khách hàng cho từng Landing Page cũng như nhóm sản phẩm phù hợp nhất với tệp đó để giới thiệu sẽ giúp gia tăng tỉ lệ chốt đơn hàng thành công hơn.

Nội dung của section:

Gợi ý tính năng

Hình ảnh thiết kế thêm viền hoặc bo góc/ Gallery hoặc Carousel
Video
Nút bấm kêu gọi hành động cần thiết tại section này
Tính năng chuyển tab sẽ rất hữu ích với ngành giáo dục/ bất động sản để liệt kê các sản phẩm/khóa học

Section mẫu 1

Section mẫu 2

Section mẫu 3

Section mẫu 4

Dưới đây là 1 số section mẫu trong kho giao diện của LadiPage.

Tất Kikiyasock Nữ siêu xịn sò

79.000đ

GIẢM 31%

115.000đ

Thương hiệu: Caramella
Chất liệu: sợi tổng hợp
Màu sắc: nhiều màu
Size: Freesize

4.9 Đánh giá

1200

Đã bán

583 824

XEM TRÊN SHOPEE NGAY

Miễn phí vận chuyển

Shop có Freeship Extra và hoàn xu Extra nha!

The reasons why people should buy from you

BỘ SƯU TẬP ẢNH CƯỚI

STUDIO

1 NGỦ + 1

2 NGỦ + 1 1WC

2 NGỦ + 1 2WC

3 NGỦ

MẶT BẰNG CHI TIẾT CĂN HỘ

2.6. Section đội nhóm

Góp phần tăng uy tín của thương hiệu, giúp nội dung của Landing Page trở nên gần gũi hơn và lan tỏa thêm năng lượng tích cực tới người đọc

1. Đội nhóm gồm những ai?

Đó là ban cố vấn, ban điều hành giàu kinh nghiệm và năng lực,
Bên cạnh đó là đội ngũ bán hàng đầy nhiệt huyết và tận tâm Cá nhân ưu tú có đóng góp hoặc ảnh hưởng trực tiếp tới sản phẩm/dịch vụ của bạn

2. Nội dung của section

Thông tin về nhân sự như kinh nghiệm làm việc, chức vụ, trích dẫn… không nên quá dài, nêu những ý chính trọng tâm nhưng đắt giá.
Số lượng liệt kế lý tưởng: 3-5

3. Gợi ý tính năng

Text được làm nổi bật trên Frame hoặc Hình hộp (ưu tiên sử dụng frame để có đồng điệu về thiết kế)
Carousel/Gallery
Hình ảnh được cách điệu bằng cách bo góc, viền
Trên mobile có thể sử dụng Auto Scroll (giúp nội dung trượt ngang, giảm diện tích landing page)

Section mẫu 1

Section mẫu 2

Section mẫu 3

Dưới đây là 1 số section mẫu trong kho giao diện của LadiPage.

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

OUR TEAM

Thomas Clarckson

Developer

Thomas Clarckson

Tester

Thomas Clarckson

UX/UI Designer

Thomas Clarckson

Founder

CHÚNG TÔI CAM KẾT
ĐẦU RA 700+ TOEIC BẰNG HỢP ĐỒNG

Trình độ giao tiếp >850 TOEIC

Kỹ năng và kiến thức tiếng Anh >900 TOEIC

Đầy đủ chứng chỉ sư phạm

ĐỘI NGŨ GIÁO VIÊN

CHUYÊN NGHIỆP

TẠI LOREM IPSUM

ĐỘI NGŨ BÁC SĨ NỘI TRÚ TẠI thuận ánh

ĐƯỢC ĐÀO TẠO CHUYÊN SÂU VỀ BỆNH LÝ XƯƠNG KHỚP

Ths.Bs LOREM IPSUM

Thạc sĩ đại học Y chuyên ngành Cơ xương khớp

Lorem Ipsum is simply dummy text of the printing
Lorem Ipsum is simply dummy text of the printing

Bs LOREM IPSUM

Bác Sĩ Chuyên Khoa II

30 năm kinh nghiệm
Tốt nghiệp chứng chỉ siêu âm khớpchứng chỉ tiêm khớp

Bs LOREM IPSUM

Bác Sĩ Chuyên Khoa I

10 năm kinh nghiệm
Tốt nghiệp chứng chỉ siêu âm khớp chứng chỉ tiêm khớp Bạch Mai

Ts.Bs LOREM IPSUM

TS.Bác Sĩ Chuyên Khoa I

35 năm kinh nghiệm
Trực tiếp phẫu thuật hàng trăm ca bệnh thay khớp
Tốt nghiệp BSCKI chuyên ngành Ngoại chấn thương chỉnh hình

2.7 Section Đánh giá của khách hàng

Nội dung

Section này áp dụng 1 phần hiệu ứng đám đông, nhất là khi khách hàng sử dụng sản phẩm dịch vụ của bạn là người nổi tiếng, người có tiếng nói nhất định trong cộng đồng thì mức độ tín nhiệm sẽ được nâng lên cao hơn.

Phần lời đánh giá bạn nên lấy phản hồi thực tế của khách hàng, để có được đánh giá này bạn có thể lấy feedback hoặc gọi điện cho khách hàng.

Ý kiến khách hàng được tạo bởi 2 thành phần đó là chân dung và lời đánh giá.
Phần ảnh chân dung phải thể hiện rõ tệp đối tượng khách hàng.
Chân dung giúp khách hàng như đang được “soi gương”, họ thấy hình ảnh của bản thân mình trong đó và nhanh chóng kết luận về những giá trị mình nhận được sau khi sử dụng sản phẩm khi thấy sự hài lòng của khách hàng cũ đã đánh giá sản phẩm.
Phần lời đánh giá bạn nên lấy phản hồi thực tế của khách hàng, để có được đánh giá này bạn có thể lấy feedback hoặc gọi điện cho khách hàng.

3. Gợi ý tính năng

Review hoặc carousel/gallery để chạy slide ảnh/nội dung đánh giá của khách hàng
Một số ngành hàng có thể sử dụng đánh giá dạng video để tăng sức thuyết phục
Đối với các mặt hàng mỹ phẩm/thẩm mỹ có thể sử dụng Ảnh so sánh để kéo xem sự thay đổi trước và sau
Nhúng plugin bình luận của facebook hoặc sử dụng section mẫu bình luận sẵn có của LadiPage

Section mẫu 1

Section mẫu 2

Section mẫu 3

Dưới đây là 1 số section mẫu trong kho giao diện của LadiPage.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel, tincidunt scelerisque sapien. Quisque commodo orci at odio aliquet pretium.

Jezebel Tro

Lorem ipsum dolor sit amet,

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel, tincidunt scelerisque sapien. Quisque commodo orci at odio aliquet pretium.

Lysandra

Lorem ipsum dolor sit amet,

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel, tincidunt scelerisque sapien. Quisque commodo orci at odio aliquet pretium.

Isadora

Lorem ipsum dolor sit amet,

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel,

Reasons why people should buy from you

“Mình đã tham gia thử thách uống bột collagen trong vòng 1 tháng. Trước đây, mình đã từng uống nước ép tươi rồi nên khi dùng bột này thì mình thấy khá thích thú, vì mùi vị hoàn toàn khác biệt của nó. Mùi thơm hơn và vị ngon, dễ uống hơn rất là nhiều. Chính vì vậy nên mình đã quyết định uống trong vòng một tháng để xem có thay đổi gì không. Và đây, các bạn thấy đấy, body mình thon gọn hơn rất là nhiều, khúc nào ra khúc nấy. Mình thực sự thích sản phẩm này và tin dùng bột collagen trước mỗi bữa ăn hàng ngày.”

Nguyễn Nhung - 42 tuổi, HCM

"Sau 1 tháng sử dụng collagen vào mỗi sáng thì mình thấy cơ thể thay đổi rõ rệt. Mình ngủ ngon hơn, không bị đầy bụng, hệ tiêu hóa cũng nhẹ nhàng hơn. Đặc biệt, làn da thì fresh hơn, sáng hơn, và cơ thể cảm thấy thanh thoát hơn rất là nhiều. Thậm chí là mình đã giảm được 2kg luôn nữa. Pha chế thì rất đơn giản thôi, chỉ 15s là mình có một ly nước thơm ngon, thanh mát và dễ uống vô cùng. Đây thực sự là một lựa chọn tuyệt vời cho bữa sáng của mình."

Nguyễn Hằng - 24 tuổi, Lào Cai

"Là một diễn viên tự do, nên mình rất chú trọng đến việc chăm sóc sức khỏe và vóc dáng. Và để có được body này thì mình kết hợp tập Gym, chạy bộ và ăn uống các loại thực phẩm lành mạnh. Mình chọn 1 ly nước collagen mỗi ngày để cơ thể khỏe mạnh.. Một ly sau khi tập xong giúp cơ thể mình khoan khoái và dễ chịu vô cùng. collagen là lựa chọn sau mỗi buổi tập của mình."

Hồng Thái - 24 tuổi, Hà Nội

CẢM NHẬN CỦA KHÁCH HÀNG

VỀ GIẢM CÂN MẬT ONG

1010 Bình luận

Sắp xếp theo

Hàng đầu

Tôi đã dùng A này suốt 2 tháng qua sau khi sinh bé thứ 2, vết chân chim và nếp nhăn ở đuôi mắt, nám tàn nhang đã mờ hẳn đi rất nhiều da trắng sáng hơn hẳn. Cảm ơn Trung Tâm đã chia sẻ bài viết hữu ích này à cảm ơn shop đã mang tới mình sản phẩm chất lượng ạ . Nhân viên tư vấn dễ thương.

Oanh Cáo Phạm Ngũ Lão, Quận 1

Thích - Phản hồi

20 phút trước

Mình dùng Q từ khi có bầu tháng t4 vừa mới sinh em bé xong nên da mình vẫn cứ đẹp như trước ý

Linh Nguyễn Huyện Hiệp Đức, Tỉnh Quảng Nam

Phản hồi -

2 phút trước

Ai đó đang nhập bình luận...

Phản hồi -

20 giờ trước

Mình dùng được 1 tháng rồi ngày nào cũng bôi, kem vẫn còn rất nhiều mà sờ lên da thấy sướng lắm, nếp nhăn ít đi, thích nhất là da căng mịn, trắng sáng hơn hẳn, ai cũng khen dạo này trẻ hơn

Elise Hạnh Nguyễn Tôn Đức Thắng, Tp Sơn LA

Thích - Phản hồi

1 ngày trước

Đã từng không an tâm về việc đặt hàng online nhưng lần này mình đã thử mua xem thế nào và kết quả rất xứng đáng. Da của mình trắng và mịn màng, nếp nhăn mờ đi nhiều so với lúc trước. Các chị em nên tranh thủ làm đẹp đi ạ.

Hoàng Tú Uyên Xã Phước Quang, Huyện Tuy Phước, Bình Định

Hàng chính hãng, giao hàng nhanh và đóng gói kĩ càng, chắc chắn. Đã sử dụng mấy hũ rồi chất lương rất tốt, xóa dc cả nám vs tan nhang, da cũng lên tông nhiều rồi.

Nguyễn Ngọc Thu Thắng Tam, TP. Vũng Tàu

Phản hồi -

20 giờ trước

Mình rất thích em này, xài không bị dị ứng dù da mình rất nhạy cảm, kem mịn, mát da,thơm bồi rất dễ chịu, hiệu quả thì chưa biết vì mới sử dụng nhưng cũng thấy trắng hơn được ít Xài bao nhiêu loại rồi cũng phải quay về với em này

Vân Anh Phường Quang Trung, Thành phố Uông Bí, Quảng Ninh

Thích - Phản hồi

1 ngày trước

Quên chụp hình rồi nhưng sp chất lượng hơn những loại tôi dùng trước đây dùng 1 tuần là cảm nhận được lên tone rõ luôn. Giao hàng nhanh, gói kỹ, rất ưng ý

Nguyễn Thị Hợp Phường Bình Chiểu, quận Thủ Đức, thành phố HCM

2.8 Section Chứng nhận và cam kết

Trong thương mại điện tử, các chứng thực về bảo mật thông tin người dùng, chứng nhận về chất lượng, cam kết về chính sách đổi trả/hoàn tiền… luôn được người mua hàng quan tâm.

Nội dung

Chứng nhận và cam kết được hiểu như sự chứng thực của bên thứ 3 là 1 tổ chức có uy tín trong lĩnh vực bạn đang kinh doanh.
Các chứng thực này sẽ càng uy tín hơn nếu như chính tay khách hàng tự mình tra cứu được do đó các chứng thực nên để càng rõ ràng càng tốt.

Gợi ý tính năng

Hình ảnh/Gallery

Section mẫu 1

Section mẫu 2

Section mẫu 3

Dưới đây là 1 số section mẫu trong kho giao diện của LadiPage.

Giấy phép và chứng nhận của bộ y tế

Sản phẩm đạt chuẩn chất lượng của Bộ Y Tế Thế Giới (GMP)

Các trang thiết bị hiện đại bậc nhất 100% được nhập khẩu. Tuân thủ khắt khe yêu cầu của bộ y tế từ thiết kế đến công năng, đề cao sự an toàn. Phòng chiết xuất vô khuẩn 1 chiều, khử khuẩn cung cấp khí tươi giúp an toàn tuyệt đối

GIẤY CHỨNG NHẬN SẢN PHẨM

Chứng nhận giải thưởng

2.9 Section Bảng giá

Nút kêu gọi hành động cần thiết tại section này
Tính năng tạo Bảng (table)
Text được làm nổi bật trên Hình hộp/Frame

Gợi ý tính năng

Ngại hỏi giá chính là tâm lý chung của phần đông khách hàng. Khi đặt bảng giá công khai, bạn cho khách hàng cảm giá được đưa ra những lựa chọn cá nhân mà không bị bất cứ sự tác động nào.
Thay vì phải trả lời những câu hỏi của nhân viên sales trực tiếp để dẫn dắt thì giờ đây khách hàng hoàn toàn được lựa chọn dựa trên những đánh giá của bản thân và những giá trị họ nhận được từ đầu tới giờ

Nội dung

Section mẫu 1

Section mẫu 2

Section mẫu 3

Dưới đây là 1 số section mẫu trong kho giao diện của LadiPage.

Reasons why people should buy from you

499.000đ

Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.

Here’s your reasons

CALL TO ACTION

800.000đ

Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.

Here’s your reasons

CALL TO ACTION

432.000đ

Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.

Here’s your reasons

CALL TO ACTION

ƯU ĐÃI ĐẶC BIỆT

HẠ NHIỆT MÙA HÈ

MUA 1 TÚI 200g

Giá gốc: 199.000đ

Nay chỉ còn:

99.000đ

Phí vận chuyển 0.000đ

MUA 1kg

Giá gốc: 499.000đ

Nay chỉ còn:

399.000đ

Miễn phí vận chuyển

MUA 3 TÚI 200g

Giá gốc 399.000đ

Nay chỉ còn:

299.000đ

Tặng ngay Lorem Ipsum

MUA 2kg

Giá gốc: 599.000đ

Nay chỉ còn:

499.000đ

Miễn phí vận chuyển

Tặng ngay 0g Trà Cà Gai Leo

CHƯƠNG TRÌNH SẼ KẾT THÚC TRONG

Ngày

Giờ

Phút

Giây

Nhanh tay lên Sắp hết hàng! Chỉ còn 10 sản phẩm cuối cùng

Đang có 99 người xem sản phẩm này

DANH MỤC SẢN PHẨM

Tặng kèm
bàn phím

GHẾ CÔNG THÁI HỌC
SIHOO M57

Sản phẩm phù hợp với

Tải trọng: 100kg

Chất liệu

Chân thép

6.000.000đ

4.500.000đ

ĐẶT MUA NGAY

-30%

Tặng kèm
bàn phím

GHẾ CÔNG THÁI HỌC
SIHOO M57

Sản phẩm phù hợp với

Tải trọng: 100kg

Chất liệu

Chân thép

6.000.000đ

4.500.000đ

ĐẶT MUA NGAY

-30%

Tặng kèm
bàn phím

GHẾ CÔNG THÁI HỌC
SIHOO M57

Sản phẩm phù hợp với

Tải trọng: 100kg

Chất liệu

Chân thép

6.000.000đ

4.500.000đ

ĐẶT MUA NGAY

-30%

Tặng kèm
bàn phím

GHẾ CÔNG THÁI HỌC
SIHOO M57

Sản phẩm phù hợp với

Tải trọng: 100kg

Chất liệu

Chân thép

6.000.000đ

4.500.000đ

ĐẶT MUA NGAY

-30%

2.10 Section Form đăng ký

Phương án tối ưu cho Form đăng ký là 5 trường, bao gồm:

Họ tên
Số điện thoại
Email
Địa chỉ
Lời nhắn

Trường Số điện thoại nên tùy chỉnh biểu thức và Trường địa chỉ tùy chỉnh theo thị trường marketing hướng tới

Vị trí cho Form

Bên cạnh nội dung form, vị trí của form cũng là yếu tố cần phải test. Hai vị trí thông thường nhất là ở ngay trên phần Giới thiệu hoặc ở dưới cùng sau khi người đọc duyệt toàn bộ nội dung trang.
Về nguyên tắc đặc vị trí của form: Nên đảm bảo người đọc phải duyệt qua tất cả các thông tin cần thiết trước khi điền form, việc đặt form quá sớm khi người đọc chưa rõ lợi ích của việc để lại thông tin sẽ làm giảm tỷ lệ chuyển đổi.

Gợi ý tính năng

Form đăng ký
Đồng hồ đếm ngược
Vòng quay may mắn
Form đăng ký được đặt nổi bật trên nền Hình hộp/hình ảnh

Reasons why people should buy from you

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet.

Days

Hours

Min

Sec

Lorem ipsum dolor sit amet

2.11 Section Call – to – Action

Section này bao gồm 1 câu chốt và nút CTA (Thường là: Đăng ký ngay, dùng thử ngay, trải nghiệm ngay…..)

Sau khi trình bày toàn bộ nội dung để thuyết phục người đọc thì lúc này cần thực hiện 1 hành động chuyển đổi.

Một Section Call – to – Action mang tính mời gọi, thúc giục mạnh mẽ sẽ đóng vai trò quyết định người đọc có trở thành khách hàng tiềm năng của bạn hay không.

Section mẫu 1

Section mẫu 2

Section mẫu 3

Dưới đây là 1 số section mẫu trong kho giao diện của LadiPage.

Giá gốc: 2.200.000 VNĐ

Nay chỉ: 1.470.000 VNĐ

Tái tạo

LÀN DA TRẮNG SÁNG

NGAY HÔM NAY!

Ngày

Giờ

Phút

giây

Ưu đãi kết thúc sau:

CHỜ ĐÃ. ĐỪNG BỎ LỠ ƯU ĐÃI 30% (CHỈ 5 SUẤT)

Sản phẩm bao gồm:

1 Kem bôi

1 Viên uống

&

GIẢM GIÁ 10% TRỌN ĐỜI

MUA 1 TÚI

Tiết kiệm 20.000đ

260.000đ

245.000đ

MUA 2 TÚI

Tiết kiệm 85.000đ

260.000đ

465.000đ

MUA 3 TÚI

Tiết kiệm 135.000đ

780.000đ

675.000đ

Đang có người đã mua sản phẩm này!

Nhanh Tay Đặt Hàng Nhận Ưu Đãi

Sắp hết hàng! Chỉ còn lại 15 túi bánh cuối cùng

NHANH TAY LÊN
THỜI GIAN ƯU ĐÃI CHỈ CÒN

Ngày

Giờ

Phút

Giây

*MUA TỪ 2 TÚI - MIỄN PHÍ SHIP TOÀN QUỐC

Đăng kí ngay

để hưởng ưu đãi hấp dẫn

Tặng gói sinh trắc vân tay định hướng bản thân trị giá

3.500.000 vnđ

Tặng voucher lên đến

1500 Euro

Tặng vé máy bay 1 chiều trị giá

1000 Euro ( tùy chương trình )

ĐĂNG KÍ NGAY HÔM NAY
ĐỂ NHẬN TƯ VẤN MIỄN PHÍ!

Ngày

Giờ

Phút

Giây

Thời gian ưu đãi còn lại

2.12 Section Câu hỏi thường gặp

Vị trí cho Form

FAQ (Frequently Asked Questions) là “Câu hỏi thường gặp”. Nơi đây bạn có thể đưa ra toàn bộ những thắc mắc mà khách hàng có thể có trong quá trình tìm hiểu sản phẩm.
Đôi khi đây cũng là nơi bạn đưa ra những điểm mạnh trong sản phẩm dịch vụ của mình mà đối thủ cạnh tranh không có.
FAQ nên là những câu hỏi và câu trả lời ngắn gọn, nhắm đúng mục tiêu bởi khách hàng cần sự giải quyết nhanh chóng cho những vấn đề phức tạp.

Gợi ý tính năng

Nếu danh sách câu hỏi ít, có thể hiển thị nội dung câu trả lời luôn trên trang, bằng cách sử dụng text nổi bật trên nền Hình hộp/Frame
Sử dụng accordion/collapse giúp bạn ẩn và hiển thị 1 nội dung trên trang, giúp người dùng có thể chủ động mở rộng/ẩn nội dung để xem, tiết kiệm không gian hiển thị.

Section mẫu 1

Section mẫu 2

Section mẫu 3

Dưới đây là 1 số section mẫu trong kho giao diện của LadiPage.

FAQ

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

FAQ

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

01. Lorem ipsum dolor sit amet?

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel, tincidunt scelerisque sapien. Quisque commodo

02. Lorem ipsum dolor sit amet?

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel, tincidunt scelerisque sapien. Quisque commodo

03. Lorem ipsum dolor sit amet?

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam leo leo, tincidunt ac lectus vel, tincidunt scelerisque sapien. Quisque commodo

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

FAQ

1. Lorem ipsum dolor sit amet?

Question 01

2. Lorem ipsum dolor sit amet?

Question 02

3. Lorem ipsum dolor sit amet?

Question 03

4. Lorem ipsum dolor sit amet?

Question 04

1. Truy cập Builder và lựa chọn giao diện mẫu phù hợp

Landing Page sở hữu 1 thư viện đồ sộ với hơn 1000+ mẫu Landing Page bán hàng độc đáo và đẹp mắt cho khách hàng tham khảo.

Những mẫu thiết kế chuyên nghiệp được LadiPage chọn lọc từ những mẫu thiết kế tốt nhất với đa dạng các lĩnh vực: Thực phẩm, đồ điện tử, thời trang, mỹ phẩm, ô tô xe máy, thú cưng, ..... hay các dịch vụ như: Giải trí, giáo dục, du lịch, nhà hàng, thẩm mỹ, bất động sản, tài chính,....

Ngoài những mẫu thiết kế Landing Page sản phẩm, LadiPage còn cung cấp thêm những mẫu thiết kế Giới thiệu Doanh nghiệp, Trang quà tặng, sự kiện hội thảo, trang cảm ơn, Portfolio, tuyển dụng,....

B1: Truy cập vào LadiPage Builder
B2: Nhấn chọn vào mục "Thư viện mẫu"
B3: Chọn mẫu giao diện phù hợp với nội dung đã lên về sản phẩm và dịch vụ của bạn

Chỉ với 3 thao tác cực đơn giản:

Là bạn đã có thể dễ dàng và nhanh chóng hoàn thiện 1 Landing Page cực kỳ chuyên nghiệp và phù hợp với sản phẩm kinh doanh của mình.

III. Hướng dẫn sử dụng một số tính năng quan trọng

2. Chỉnh sửa giao diện Desktop và Mobile trên LadiPage Builder

LadiPage Builder cung cấp cho người dùng khả năng chỉnh sửa trang Landing Page của mình một cách linh hoạt trên cả hai thiết bị Desktop và Mobile, đảm bảo giao diện hiển thị tối ưu trên mọi loại màn hình.

Sử dụng giao diện mẫu: chọn được 01 trong 03 chế độ thiết kế, nhưng nếu bạn chọn chế độ thiết kế Adaptive thì sẽ chỉ hiển thị giao diện Desktop, giao diện Mobile sẽ trắng tinh và bạn cần thiết kế lại giao diện Mobile từ đầu.
Sử dụng trang trắng: chọn 01 trong 03 kiểu thiết kế và thiết kế giao diện landing page từ đầu.
Tải file LadiPage từ máy tính: file bạn trước đó được thiết kế theo kiểu thiết kế nào, thì sẽ GIỮ NGUYÊN như vậy, không có phần chọn thay đổi chế độ thiết kế.
Chọn các chế độ thiết kế tại:

Sau khi đã chọn kiểu thiết kế và chỉnh sửa giao diện landing page, bạn có thể thay đổi thiết kế từ Responsive sang Mobile Only và ngược lại. Nhưng khi chọn chế độ Adaptive thì KHÔNG thay đổi được sang chế độ thiết kế khác.

Chế độ Adaptive chỉ áp dụng cho tài khoản có chế độ Phân quyền tài khoản (Enterprise/Premium/ Business).

Khi thiết kế thì bạn cần phải thiết kế bản Desktop trước.

Thiết kế giao diện Desktop:

Trên Desktop bạn nên tạo nhóm các phần tử đi liền nhau, để sang mobile, các phần cũng sẽ đi liền với nhau.
Các nội dung/hình ảnh chính bạn nên thiết kế trong khung nét đứt để trang xuất bản sẽ hiển thị tối ưu trên mọi giao diện/trình duyệt.

Bạn có thể chọn khung thiết kế destop theo khung 960px hoặc 1200px.

Phần thiết kế mobile có thể độc lập với bản desktop ở các nội dung: HÌNH NỀN, MÀU SẮC của phần tử hoặc section bằng cách KHÔNG ĐỒNG BỘ theo hướng dẫn tại đây. Nếu bạn thay đổi KÍCH THƯỚC, SIZE CHỮ, VỊ TRÍ PHẦN TỬ giữa desktop và mobile thì không cần phải bật Không đồng bộ.
Bạn có thể chọn khung thiết kế mobile 420px hoặc 320px.

Thiết kế giao diện Mobile:

Nội dung bản Mobile sẽ phụ thuộc vào các nội dung bạn tạo từ bản Desktop. Bạn KHÔNG KÉO DI CHUYỂN PHẦN TỬ RA KHỎI SECTION ban đầu thiết kế và KHÔNG HỦY NHÓM để không ảnh hưởng tới thiết kế bản desktop.
Nếu sang thiết kế bản mobile bị lệch, bạn thực hiện kéo thủ công lại để việc hiển thị được đẹp nhất, hoặc chọn sắp xếp tự động toàn trang landing page hoặc sắp xếp tự động theo từng section.

Tips:

Nếu bạn thay đổi nội dung trên mobile thì desktop cũng sẽ thay đổi và ngược lại. Vì vậy nếu bạn thiết kế nội dung cho mobile và desktop khác nhau, bạn cần tạo nội dung đó trong cả 2 giao diện, rồi ẩn phần tử đó ở 1 giao diện, bạn xem hướng dẫn chi tiết tại đây.

Sau khi đã chọn kiểu thiết kế và chỉnh sửa giao diện LandingPage, bạn có thể thay đổi thiết kế từ Responsive sang Mobile Only và ngược lại.

Chế độ Mobile Only : giao diện desktop và mobile cùng sử dụng giao diện mobile.

Mobile Only là tính năng đặc biệt của LadiPage, cho phép bạn chỉ thiết kế trên giao diện mobile và tắt giao diện desktop. Khi khách hàng truy cập bằng desktop, màn hình sẽ hiển thị bé lại bằng khung hình mobile.

Sử dụng mobile only giúp bạn tiết kiệm thời gian thiết kế để chạy nhanh các chiến dịch quảng cáo đối với các sản phẩm mà nguồn khách hàng truy cập chủ yếu từ các thiết bị di động.

Khi bạn đang ở chế độ thiết kế Responsive, bạn có thể thay đổi để chuyển sang giao diện Mobile Only theo hướng dẫn: vào mục Thiết lập ở menu trên cùng và chọn Thiết lập toàn trang. Sau đó bật chế độ Mobile only.

Chế độ Adaptive chỉ áp dụng cho tài khoản có tính năng phân quyền thành viên Enterprise/Premium/Business.
Chế độ Adaptive chỉ xuất bản được với tên miền sử dụng nền tảng LadiPage Cloud DNS, không hỗ trợ với các nền tảng khác và tải file .html để up lên hosting riêng.
Nếu trang đã chọn kiểu thiết kế Adaptive thì bạn sẽ không chuyển được sang kiểu thiết kế Responsive và Mobile only.
Nhân bản trang kiểu thiết kế Adaptive, chọn kiểu thiết kế cho trang mới là Responsive hoặc mobile only thì sẽ hiển thị giao diện chỉnh sửa desktop của trang gốc, không giữ được giao diện chỉnh sửa mobile của trang gốc.

Chế độ Adaptive: giao diện Desktop và Mobile hoàn toàn độc lập.

Với chế độ Adaptive, bạn cần thiết kế lần lượt cả giao diện desktop và giao diện mobile, nội dung của 2 phiên bản hoàn toàn ĐỘC LẬP với nhau.

Sau khi thiết kế, bạn cần vào cả 2 phiên bản Desktop và Mobile, bấm xuất bản lần lượt các phiên bản để cập nhật và hoàn thiện nội dung thiết kế. Nếu không xuất bản 1 trong 2 giao diện, thì giao diện đó sẽ ở trạng thái 404 của LadiPage.

2.1 Chuyển chế độ xem giữa Desktop và Mobile trên gia diện chỉnh sửa

Người dùng có thể dễ dàng chuyển đổi giữa 2 chế độ xem Desktop và Mobile bằng cách ấn vào 2 biểu tượng " " và " trên thanh công cụ chỉnh sửa.

Đối với mỗi chế độ xem trên từng thiết bị khác nhau, người dùng cần điều chỉnh bố cục, nội dung và phong cách hiển thị phù hợp với kích thước màn hình và hành vi sử dụng của người dùng trên thiết bị đó.

Hiện tại landing page có 3 chế độ thiết kế giao diện: Responsive, Mobile Only và Adaptive

2.2 Các tính năng chỉnh sửa

2.2.1 Kéo thả linh hoạt: Tương tự như trên Desktop, bạn có thể dễ dàng kéo thả các phần tử, thay đổi kích thước, vị trí và điều chỉnh thuộc tính của chúng trên giao diện Mobile.

2.2.2 Ẩn/ Hiện phần tử: Ẩn những phần tử không cần thiết trên giao diện Desktop hoặc Mobile để tối ưu hóa hiển thị và tránh gây rối mắt người dùng.

2.2.3 Responsive layout: LadiPage Builder tự động điều chỉnh bố cục trang phù hợp với mọi kích thước màn hình, đảm bảo giao diện hiển thị đẹp mắt và dễ sử dụng trên mọi thiết bị.

2.2.4 Thiết lập font chữ: Chọn font chữ phù hợp, điều chỉnh kích thước và kiểu chữ để đảm bảo nội dung hiển thị rõ ràng và dễ đọc trên cả hai thiết bị.

2.2.5 Hình ảnh và video: Tối ưu hóa hình ảnh và video để hiển thị sắc nét, mượt mà trên mọi kích thước màn hình.

2.2.6 Menu dành cho Mobile: Tạo menu riêng biệt cho giao diện mobile, giúp người dùng dễ dàng điều hướng trang trên thiết bị di động.

!!! Lưu ý khi chỉnh sửa:

Kiểm tra giao diện thường xuyên: Sau khi chỉnh sửa, hãy kiểm tra giao diện trang trên cả hai thiết bị Desktop và Mobile để đảm bảo hiển thị chính xác và như mong muốn.

Thử nghiệm trên thiết bị thực: Cách tốt nhất để đảm bảo giao diện hiển thị đẹp mắt trên mọi thiết bị là thử nghiệm trực tiếp trang Landing Page của bạn trên các thiết bị Desktop và Mobile khác nhau.

Bằng cách tận dụng các tính năng chỉnh sửa linh hoạt trên LadiPage Builder, có thể dễ dàng tạo ra những trang Landing Page có giao diện đẹp mắt, hiển thị tối ưu trên mọi thiết bị và mang lại trải nghiệm tốt nhất cho người dùng.

Xem hướng dẫn "Ẩn phần tử" tại đây

Xem hướng dẫn tạo Menu cho bản Mobile tại đây

3. Hướng dẫn liên kết các Icon trong Landing Page

LadiPage sử hữu một tính năng ưu việt để thu hút sự chú ý của khách hàng và tăng tương tác tối đa của khách hàng trên trang Landing Page. Đó chính là sức mạnh của Icon được liên kết trên LadiPage Builder!

Với tính năng này, bạn có thể biến những Icon đơn giản thành những "chìa khóa vàng" dẫn dắt khách hàng liên hệ trực tiếp, hay đến với các trang Web, mạng xã hội mà bạn mong muốn.

3.1 Giới thiệu nút bấm trong Landing Page

Phần tử Nút bấm cho phép bạn chèn các nút bấm Call To Action (Nút kêu gọi hành động) vào Landing Page một cách dễ dàng theo các bước sau đây:

Để tạo Nút bấm, bạn vào thanh công cụ nhanh như hình dưới:

Nút bấm

Hoặc bạn vào mục Thêm mới--> Phần tử--> Nút bấm:

Bạn vào thanh thiết lập rồi tùy chỉnh thiết kế cho từng phần của nút bấm:

Nút bấm

Tùy chỉnh màu sắc, kích thước, bo góc, viền của Nút bấm.

Nút bấm:

Tùy chỉnh văn bản (chữ) của nút bấm: Font chữ, cỡ chữ, định dạng chữ, màu sắc cho chữ. Bạn có thể chọn màu Gradient hoặc hình ảnh cho phần văn bản này.

Văn bản:

Để thay đổi nội dung của văn bản, bạn cũng có thể bấm chuột trái 2 lần vào đôi đen văn bản.

bạn có thể thêm biểu tượng (icon) vào trước nút bấm của bạn bằng cách Bật sử dụng biểu tượng. Bạn thay đổi sử dụng các biểu tượng khác trong kho biểu tượng có sẵn tại LadiPage và thay đổi kích thước của biểu tượng.

Biểu tượng:

Bạn tùy chỉnh vị trí giữa biểu tượng với văn bản và biểu tượng tới lề trái nút bấm tại phần khoảng cách lề như bên dưới.

Tips: Nếu bạn muốn nút bấm cố định trên 1 vị trí khi lăn chuột, bạn sử dụng tính năng ghim phần tử. Hướng dẫn ghim phần tử tại đây.

Nếu nút bấm thường được dùng làm nút kêu gọi hành động, thì nhóm nút bấm bạn có thể ứng dụng sử dụng cho:

3.2 Giới thiệu nhóm nút bấm trong Landing Page

Thanh menu.
Sự kiện chuyển tab, ẩn hiện phần tử.

Bạn cài đặt vị trí các nút bấm trong nhóm nút bấm tại Thiết lập--> Thiết kế.

Để cài đặt độc lập từng nút bấm, bạn chọn riêng từng nút bấm và cài đặt như Nút bấm.

Bạn có thể sử dụng hiệu ứng lựa chọn để khi di chuột tới các nút bấm trong nhóm nút bấm sẽ có hiệu ứng đổi màu.

3.3.1 Cách tạo liên kết nút Call

Bước 1: Thêm mới biểu tượng điện thoại tại thanh công cụ nhanh:

Hoặc bạn vào phần Thêm mới--> Phần tử--> Biểu tượng.

Ngoài ra bạn có thể tải hình ảnh hoặc ảnh gif có hiệu ứng rung như mong muốn lên.

Bước 2: Thiết lập sự kiện mở cuộc gọi và điền số thoại của bạn:

Bạn vào phần Thiết lập--> Sự kiện--> Hành động Nhấp chuột--> chọn Sự kiện Mở cuộc gọi và điền số điện thoại bạn muốn.

Bước 3: Thiết lập ghim phần tử và chọn vị trí ghim:

Bạn vào phần Thiết lập--> Nâng cao--> Ghim phần tử và thiết lập vị trí ghim phần tử mà bạn mong muốn.

Bước 4: Hiệu ứng cho nút call.

Bạn có thể tải ảnh GIF nút call trên google để có sẵn hiệu ứng, hoặc vào thiết lập của phần tử để chọn hiệu ứng phù hợp.

3.3 Hướng dẫn tạo liên kết các nút bấm trong Landing Page

3.3.2 Cách tạo liên kết Icon Social

Lưu ý: Lưu ý khi sử dụng Icon

Lựa chọn Icon phù hợp: Chọn icon liên quan đến nội dung hoặc hành động bạn muốn người dùng thực hiện.
Thiết kế icon nổi bật: Sử dụng màu sắc, kích thước và kiểu dáng phù hợp để thu hút sự chú ý của người dùng.
Thêm lời kêu gọi hành động: Sử dụng văn bản ngắn gọn, súc tích để khuyến khích người dùng nhấp vào icon.
Kiểm tra liên kết trên mọi thiết bị: Đảm bảo icon được hiển thị và hoạt động chính xác trên cả desktop và mobile.

Tại thanh công cụ ở góc trái giao diện, nhấn chọn vào mục "Biểu tượng" có hình Sẽ có rất diện Biểu tượng Icon hiện ra cho bạn lựa chọn
Kéo và thả Icon vào vị trí thích hợp trên trang.
Nhấp chuột vào icon và chọn mục "Thiết lập" có biểu tượng
Tại mục sự kiện chọn "mở liên kết" và dán URL đích bạn muốn hướng tới vào ô "Liên kết".
Chọn cách mở liên kết tại Trang hiện tại hoặc Cửa sổ mới
Nhấp "Lưu" để hoàn tất.

4. Hướng dẫn lưu data trên Landing Page về Email quản lý

Lưu data về Email

Bước 1: Tạo tài khoản liên kết.

Cách 1 : Truy cập trang builder.ladipage.com, chọn menu Tích hợp -> Tài khoản liên kết -> Tạo tài khoản liên kết -> Sau đó lựa chọn loại tài khoản là Email.

Cách 2: Truy cập builder chỉnh sửa trang Landing Page muốn lưu data về Email, ở phần Form đăng ký--> Mục lưu data --> Bấm thêm mới --> Chọn tạo liên kết -> Loại tài khoản là Email.

Bước 2: Nhập đầy đủ các thông tin.

Tên Liên kết: Là tên để phân biệt với các liên kết khác.
Email Nhận Thông Báo: Là email bạn muốn nhận được data khách hàng, Email này không nhất thiết phải trùng với Email đăng ký tài khoản LadiPage.
Ấn "Thêm tài khoản" để lưu.

Bước 3: Tạo cấu hình lưu trữ form.

Vào lại trang builder.ladipage.com, chọn menu Tích hợp -> Cấu hình Form -> Tạo cấu hình form.

Bấm nút Chọn để sử dụng tài khoản liên kết bạn muốn dùng.
Nhập Tên cấu hình để lưu lại cấu hình form vừa tạo và bấm nút Hoàn tất.

Bạn có thể chọn thêm tài khoản liên kết khác cho Cấu hình này. Mỗi cấu hình được chứa tối đa 3 tài khoản liên kết, tương đương với 3 nguồn lưu trữ thông tin khách hàng đồng thời nhận được từ form đăng ký trên Landing Page.

Bước 4: Chọn cấu hình form cho Form đăng ký.

Quay trở lại form trên trang Landing Page, chọn toàn form bạn đang muốn cài đặt và chọn "Lưu data".

Chọn cấu hình phù hợp trong danh sách cấu hình form đã được cài đặt ở bước 3, sau đó bấm Cập nhật để hoàn thành.

Data trả về Email sẽ gồm các thông tin như bên dưới.

Tên (tiêu đề) email là mặc định từ hệ thống, nên bạn không thể thay đổi được nội dung tiêu đề mail.
Các trường của form đăng ký.
Link landing page (URL) khách hàng điền data.
Địa chỉ IP mạng của khách hàng điền form.
Thời gian đăng ký data thành công.

5. Hướng dẫn mua tên miền

Bước 1: Truy cập trang web Mắt Bão tại Link sau: http://ldp.ink/matbaonet

Bước 2: Tìm tên miền

Sử dụng thanh tìm kiếm trên trang chủ để kiểm tra tính khả dụng của tên miền bạn muốn.
Nhập tên miền vào ô tìm kiếm và nhấn "Kiểm tra".

Bước 3: Chọn tên miền:

Nếu tên miền có sẵn, thêm vào giỏ hàng.
Nếu không, chọn từ các gợi ý hoặc tìm kiếm tên miền khác.

Bước 4: Đăng ký và thanh toán:

Đăng nhập hoặc tạo tài khoản mới.
Nhập thông tin cần thiết và chọn phương thức thanh toán.
Xác nhận và hoàn tất đơn hàng.

6. Hướng dẫn trỏ tên miền

Truy cập trang quản trị tên miền của Mắt Bão và nhập thông tin tài khoản:
https://id.matbao.net/users/login/.

Sau đó bạn chọn lần lượt:

Mục Tên Miền.
Click vào tên miền cần trỏ.
Vào mục Quản lý DNS.

Mắt bão hiện tại có 2 giao diện cấu hình trỏ DNS, bạn xem mình đang sử dụng giao diện nào thì sử dụng theo hướng dẫn của giao diện đó.

Trỏ tên miền từ Mắt Bão

Bạn truy cập tài khoản Mắt bão--> chọn Tên miền --> Quản lý DNS để tạo bản ghi tên miền.

Giao diện cũ của Mắt Bão

1. Trỏ tên miền chính:

Host record: www
Loại: CNAME
Giá trị: dns.ladipage.com

Host record: @
Loại: URL Redirect
Giá trị): http://www.tenmiencuaban.com
Lưu ý: Thay tenmiencuaban.com thành tên miền bạn đang cấu hình.

Bạn thêm mới 2 bản ghi sau:

2. Trỏ tên miền phụ:

Chọn tên miền chính bạn muốn cài đặt, sau đó tạo một bản ghi mới và điền các giá trị như sau:

Host record: sanphama
Type (Loại): CNAME
Value (Giá trị): dns.ladipage.com

Giả sử tên miền chính của bạn là tenmiencuaban.com, và bạn muốn tạo một tên miền phụ là sanphama.tenmiencuaban.com.

Bạn vào mục Tên miền --> Quản lý Tên miền --> Chọn cấu hình DNS nâng cao--> Chọn tab tạo bản ghi để tạo bản ghi.

Giao diện mới của Mắt bão

1. Trỏ tên miền chính:

Host record: www
Type (Loại): CNAME
Value (Giá trị): dns.ladipage.com

Host record: @
Loại: URL Redirect
Giá trị): http://www.tenmiencuaban.com
Lưu ý: Thay tenmiencuaban.com thành tên miền bạn đang cấu hình.

Sau khi tạo xong, phần danh sách bản ghi hiển thị đủ 2 bản ghi trên là bạn đã tạo đúng.

Bạn thêm mới 2 bản ghi sau:

2. Trỏ tên miền phụ:

Chọn tên miền chính bạn muốn cài đặt, sau đó tạo một bản ghi mới và điền các giá trị như sau:
Host record: sanphama
Type (Loại): CNAME
Value (Giá trị): dns.ladipage.com

Sau khi đã tạo thành công bản ghi tên miền về hosting của LadiPage, bạn chờ bản ghi tên miền cập nhật thành công về LadiPage, sau đó bạn cần tiếp tục làm bước tiếp theo: tạo và xác thực tên miền trên tài khoản LadiPage.

Giả sử tên miền chính của bạn là tenmiencuaban.com, và bạn muốn tạo một tên miền phụ là sanphama.tenmiencuaban.com.

7. Xuất bản Landing Page nhanh chóng trên nền tảng LadiPage

Sau khi đã thêm tên miền và xác thực tên miền thành công trong LadiPage, bạn có thể xuất bản Landing Page với những tên miền này. Các bước thực hiện như hình dưới:

Bạn vào trang chỉnh sửa Landing Page --> Bấm xuất bản --> Chọn Tab tên miền riêng--> Chọn Tên miền riêng bạn muốn sử dụng để xuất bản.

Xuất bản Landing Page với tên miền riêng

Bạn cũng có thể xuất bản Landing Page với dạng:

Thư mục con của tên miền chính: tenmiencuaban.com/abc.

Thư mục con của tên miền phụ: sanpham.tenmiencuaban.com/abc.

Bạn xuất bản chọn tên miền chính/tên miền phụ rồi thêm đường dẫn đằng sau tên miền chính/tên miền phụ như hình cạnh.

Sau đó ấn "Xuất bản lại" là bạn đã xuất bản Landing Page thành công.

Sau khi xuất bản xong Landing Page, bạn có thể tạo link rút gọn cho link Landing Page, tạo QR code cho trang hoặc sao chép đường dẫn của link Landing Page theo hướng dẫn mô tả tại hình ảnh bên cạnh.

Lưu ý:

LadiPage hỗ trợ các định dạng tên miền như sau:

https://www.abc.com
http://www.abc.com Và http://abc.com
http://sanpham.abc.com hoặc https://sanpham.abc.com.

Vì vậy khi bạn chạy quảng cáo, bạn để đủ link là: https://www.abc.com và khi khách hàng gõ www.abc.com hoặc abc.com vẫn sẽ mở được link landing page của bạn.

LadiPage hỗ trợ các định dạng tên miền như sau:

LadiPage không hỗ trợ định dạng: https://abc.com. Vì vậy khi truy cập trang landing page, bạn vui lòng sử dụng đúng định dạng hỗ trợ. Nếu bạn muốn sử dụng định dạng https://abc.com, bạn có thể sử dụng thủ thuật thông qua CloudFlare theo hướng dẫn tại đây.

Nếu bạn thay đổi đường dẫn xuất bản landing page, thì mã QR cũng sẽ thay đổi.