Hướng dẫn chỉnh sửa bảng giá Theme Flatsome cho đẹp hơn

Chào các bạn, có vẻ giao diện Flatsome khá quen thuộc với mọi người nhờ vào tốc độ và khả năng tùy biến UX/UI của nó. Tuy nhiên, có 1 điều mà chắc chắn các bạn khá là khó chịu là, cái Price Table của Flatsome khá củ chuối. Nên vì thế, mình sẽ share cho các bạn cách chỉnh bảng giá Theme Flatsome cho đẹp hơn theo cách đơn giản nhất.

Hướng dẫn thêm màu sắc cho Flatsome Price Table

Mọi thứ mà các bạn chuẩn bị là 1 giao diện Flatsome hoàn chỉnh, bạn có thể click vào đây để lấy link tải giao diện Flatsome 3.9 beta với tốc độ load trang được cải thiện đáng kể.

Flatsome Colorful Price Table Shortcode

Đầu tiên, các bạn hãy tạo 1 trang hoặc block và đưa đoạn mã này vào khi đang tạo trang

Hoặc nếu bạn đã bên trong UX Builder thì các bạn hãy thao tác theo hình dưới

Vậy là xong, giờ tiến hành bước kế tiếp thôi !

Flatsome Colorful Price Table CSS

Sau khi đã hoàn tất Import shortcode vào trang, các bạn hãy tiến hành coppy đoạn CSS sau và bỏ vào trong trường tùy biến của Webiste WordPress. Hoặc trong hosting của các bạn, hãy vào đường dẫn sau:

  • wp-content/themes/flatsome-child/stylesheet.css <<< coppy css bỏ vào đây
Vậy là xong, tận hưởng thành quả thôi. Và dưới đây là Demo.

Thêm Icon cho Colorful Flatsome Price Table – Bảng giá sắc màu cho Flatsome

Bạn cũng có thể tùy biến và thêm Icon cho bảng giá của Flatsome đã chỉnh sửa cho sinh động hơn bằng cách sử dụng các file icon định dạng SVG. Các bạn có thể coppy đoạn Shortcode dưới đây rồi Import vào Flatsome của các bạn nhé.

Nhớ tải 2 File SVG cần thiết này nhé: Box SVG | Messenger SVG

Sau khi Import Shortcode xong thì đây là thành quả

Chúc các bạn thành công. Các bạn có thể ủng hộ Liêm bằng cách đăng ký sử dụng Website tại kho giao diện website WordPress cực đẹp của Liêm MKT nhé.

Ngoài ra, đừng quên vào chuyên mục hướng dẫn thiết kế website để tìm những bài hướng đầy chi tiết trong việc tùy chỉnh / tùy biến website WordPress của các bạn nhé

Liêm MKT – thietkewebfree

Trả lời

Facebook
Youtube
Zalo
Gọi Liêm