Tạo bảng giá trong WordPress với Flatsome

Ngày đăng: 06 - 04 - 2020 Lượt xem: 3531 lượt

Trong quá trình làm website, có đôi bạn muốn tạo một bảng giá, phục vụ cho việc cho thuê hoặc bán sản phẩm có nhiều tính năng. Chẳng hạn như bảng giá cho thuê căn hộ, bảng giá cho thuê phần mềm hay bảng giá thiết kế web. Bạn có thể tạo bảng giá dễ dàng với tính năng Price Table có sẵn trong theme Flatsome.

Tạo bảng giá trong WordPress với Flatsome

Đầu tiên, bạn tạo một trang mới có tên là Bảng giá. Sau đó vào chỉnh sửa trang này với UX Builder.

Bạn thêm một Section, Row với 4 Column.

Sau đó, bạn thêm vào cột một thành phần có tên là Price Table.

Với Price Table đầu tiên, bạn sử dụng làm tiêu đề chung cho bảng giá như sau:

Sau đó, nhấn vào từng Bullet Item để chỉnh sửa nội dung. Tooltip là đoạn mô tả, nó sẽ ẩn đi và hiển thị bằng dấu ?, khi nhấn vào đây thì nó ra dòng mô tả.

Cứ như vậy bạn chỉnh sửa nội dung các hàng theo ý mình. Nếu muốn thêm hàng mới, bạn chuột phải vào Bullet Item và nhấn Duplicate.

Sau đó, bạn Duplicate Price Table và kéo nó qua cột thứ 2 3, 4.

Bạn sửa nội dung của các cột lại, tương ứng với từng hàng bên cột đầu tiên. Nếu muốn một bảng giá nào đó nổi bật hơn, bạn bật tính năng Featured của bảng đó.

Sau đó chỉnh sửa tiêu đề một chút cho trang Bảng giá, và đây là kết quả của mình.

Tổng kết

Nếu bạn đang có nhu cầu tạo bảng giá cho dịch vụ hay sản phẩm, bạn có thể sử dụng tính năng này có sẵn trong theme Flatsome. Tuy nhiên, nếu bạn dùng một giao diện khác không có tính năng tạo bảng, hoặc bạn muốn tạo bảng đẹp hơn, bạn có thể dùng plugin hỗ trợ. Bạn có thể sử dụng plugin Pricing Table by Supsystic. Đây là plugin tạo bảng khá đơn giản và dễ dùng, với nhiều kiểu đẹp mắt.

2.6 5 votes
Đánh giá bài viết

Nhận thông báo
Nhận thông báo cho
guest

0 Góp ý
Inline Feedbacks
View all comments

Bài viết liên quan

Làm web bán hàng với Flatsome – Tuỳ chỉnh cho WooCommerce

Làm web bán hàng với Flatsome – Tuỳ chỉnh cho WooCommerce

03 - 04 - 2020

Tuỳ chỉnh cho giao diện WooCommerce sẽ là bài cuối trong series Làm Web bán hàng với Flatsome. Trong...

Làm web bán hàng với Flatsome - Tuỳ chỉnh hiển thị Blog

Làm web bán hàng với Flatsome - Tuỳ chỉnh hiển thị Blog

31 - 03 - 2020

Các giao diện wordpress chuyên nghiệp cho phép bạn chỉnh sửa hiển thị các trang chức năng riêng biệt....

Làm web bán hàng với Flatsome - Tuỳ chỉnh giao diện

Làm web bán hàng với Flatsome - Tuỳ chỉnh giao diện

31 - 03 - 2020

Tuỳ chỉnh giao diện bao gồm bố cục, màu sắc, font chữ,... để website mang phong cách riêng. Đây...

Làm web bán hàng với Flatsome – Tạo trang liên hệ tuyệt đẹp

Làm web bán hàng với Flatsome – Tạo trang liên hệ tuyệt đẹp

30 - 03 - 2020

Trang liên hệ là một thành phần không thể thiếu đối với mỗi website. Trang liên hệ là nơi...

Làm web bán hàng với Flatsome – Tạo footer

Làm web bán hàng với Flatsome – Tạo footer

30 - 03 - 2020

Footer hay còn gọi là chân trang, là thành phần nằm dưới cùng của trang. Footer thường chứa các...

Làm web bán hàng với Flatsome – Tạo nội dung trang chủ

Làm web bán hàng với Flatsome – Tạo nội dung trang chủ

29 - 03 - 2020

Trong bài viết trước mình đã tạo phần đầu trang chủ với các loại banner. Trong bài viết này,...

0
Would love your thoughts, please comment.x