Giới thiệu #
Elementor cho phép bạn chỉnh sửa giao diện trang bằng cách kéo–thả trực tiếp. Bài này hướng dẫn bạn từ A → Z cách mở trang, chỉnh sửa nội dung, thêm mới, xoá, nhân bản và lưu trang.
Cách mở trang bằng Elementor #
Có 2 cách:
- Trong Dashboard → Pages → Edit with Elementor
- Ở ngoài frontend → Thanh Admin Bar → Edit with Elementor
Lưu ý: Không mở cùng lúc Gutenberg và Elementor cho 1 trang — dễ gây lỗi.
Tạo trang mới bằng Elementor #
- Vào Pages → Add New
- Đặt tên trang
- Nhấn Edit with Elementor
- Trang mở ra với giao diện trống để bạn xây dựng bố cục
Nếu trang bị viền trắng hoặc có khoảng trắng lớn:
- Vào Page Settings → Chọn Template: Elementor Canvas hoặc Elementor Full Width
Cách chỉnh sửa nội dung trên trang #
Khi rê chuột vào bất kỳ phần nào (Heading, Text, Button, Image…), bạn sẽ thấy khung viền xanh.
Chỉnh Heading #
- Nhấp vào tiêu đề
- Thay đổi nội dung ở tab Content
- Chỉnh màu / font ở tab Style
Best practice: Luôn dùng Global Colors & Typography để giữ đồng bộ.
Chỉnh Text Editor (Văn bản) #
- Nhấp vào đoạn văn bản
- Thay nội dung ở ô text
- Dùng Bold/Italic đúng – hạn chế đổi font thủ công
Chỉnh Image (Hình ảnh) #
- Nhấp vào hình
- Nhấn “Choose Image” để thay hình
- Upload hình tối ưu (JPG hoặc WebP)
Lưu ý: Kích thước hình phải thuộc chuẩn thiết kế; nếu hình quá lớn → trang chậm.
Chỉnh Button (nút bấm) #
- Thay text
- Thêm link (nếu link ra trang khác → mở tab mới)
- Style → chỉnh màu nền / border / radius
Thao tác với Section & Column #
Chỉnh Section #
Khi chọn Section, bạn có thể:
- Đổi độ rộng: Boxed / Full Width
- Đổi background
- Chỉnh padding để tạo khoảng cách
Chỉnh Column #
- Chia cột (add new column)
- Điều chỉnh tỉ lệ (30/70, 50/50…)
- Chỉnh khoảng cách giữa các cột
Tip: Dùng padding thay vì margin để tạo khoảng cách giữa các khối.
Thêm nội dung mới vào trang #
Kéo widget từ Panel bên trái vào vùng mong muốn.
Widget thường dùng nhất #
- Heading
- Text Editor
- Image
- Button
- Icon List
- Spacer / Divider
Không lạm dụng Spacer — dễ gây lỗi responsive.
Nhân bản (Duplicate) Section / Column / Widget #
Tính năng “sao chép nhanh” giúp giữ layout đồng nhất.
- Nhấp phải vào Section / Column / Widget
- Chọn Duplicate
Tip: Đây là cách an toàn nhất để tạo block mới mà không phá layout.
Xoá Section / Column / Widget #
Nhấp phải → Delete
Cảnh báo: Không xoá Section bố cục chính của trang; nếu lỡ xoá → nhấn Undo (Ctrl + Z).
Lưu trang #
Khi chỉnh sửa xong:
- Nhấn Update (hoặc Publish nếu trang mới)
- Elementor tự động lưu Revision để phục hồi
Sử dụng Navigator để điều khiển trang nhanh hơn #
Navigator giúp:
- Điều hướng trong trang lớn
- Nhảy nhanh tới các phần
- Đổi tên Section để quản lý
Shortcut mở Navigator: Ctrl + I
Chỉnh Page Settings #
Nhấn icon bánh răng dưới góc trái Panel.
Các mục quan trọng #
- Title (tên trang)
- Featured Image
- Page Layout (Default, Full Width, Canvas)
- Hide Title (ẩn tiêu đề)
Các lỗi thường gặp #
- Chỉnh responsive không đúng → bố cục mobile bị lệch
- Dùng margin âm → block chồng lên nhau
- Lạm dụng spacer → khoảng cách không đồng nhất
- Xoá nhầm Section bao bên ngoài
- Dùng font/màu không theo Global → style không đồng bộ
Best Practices khi chỉnh trang bằng Elementor #
- ✔ Luôn duplicate section thay vì xây mới
- ✔ Chỉnh padding chứ không chỉnh margin
- ✔ Ưu tiên Global Colors & Typography
- ✔ Kiểm tra mobile trước khi Update
- ✔ Không sử dụng quá nhiều widget nặng
Bài 3 – Tạo & chỉnh sửa trang bằng Elementor kết thúc.
