Từng khối trong email có thể dễ dàng kéo thả, chỉnh sửa, cấu hình để người dùng thỏa sức sáng tạo. Một số thao tác cấu hình cơ bản như chỉnh sửa lề của khối ảnh, khối chữ, bo tròn hay chỉnh sửa màu sắc nút bấm, thêm các liên kết tới trang mạng xã hội...
Giao diện mẫu email có 3 phần chính: Hiển thị nội dung email; Menu bar; Side menu.
Hiển thị nội dung mẫu email
Là giao diện giúp người dùng nhìn thấy nội dung mẫu email. Nội dung email cần có đầy đủ 3 khối Header – Body – Footer.
Để tạo nội dung hiển thị trên mẫu email, chọn các khối trong tab Hàng cột tương ứng để tạo layout phù hợp và chọn khối trong tab Nội dung tương ứng để chỉnh sửa chi tiết.
Side menu
Hàng, cột (Block tab)
Tab Hàng Cột giúp cho người dùng xây dựng bố cục email của mình. Đây cũng là bước đầu tiên và quan trọng khi tạo một email. Email builder của MOBIO có nhiều dạng khối khác nhau, được định dạng sẵn để tạo bố cục trong email.
Cách thêm layout để tạo bố cục trong mẫu email
Bước 1: Người dùng chọn khối có số cột phù hợp để tạo layout
Bước 2: Kéo thả khối đó vào phần hiển thị nội dung
Bước 3: Thực hiên các thao tác cơ bản cho khối (nếu cần).
- Chuyển lựa chọn khối trong sang chọn khối bên ngoài
- Nhân đôi (Duplicate)
- Di chuyển (Move)
- Xóa content (Delete)
Bước 4: Chọn tab Nội dung, kéo các khối phù hợp vào layout
Cách thêm hàng, cột vào mẫu email
Bước 1: Người dùng chọn khối có số cột phù hợp với nhu cầu thiết kế của mình.
Bước 2: Kéo và thả khối vào phần giao diện hiển thị
Bước 3: Chọn tab Sửa bảng, chỉnh sửa khối bảng vừa được thêm.
 |  |
| Cài đặt bảng | Sửa kiểu bảng |
| Chế độ mobile Số hàng Số cột Đường viền ô | Đường viền khung Bo tròn Căn chỉnh Căn cột Căn lề Màu nền Chèn ảnh nền Nền ngoài, Auto size, Nằm giữa, Lặp |
Bước 4: Chọn Tab Sửa hàng, chỉnh sửa chi tiết từng ô trong cột hoặc trong hàng.
 |  |
Sửa hàng
- Chọn hàng: Trong phần này sẽ hiển thị số thứ hàng trong bảng, cho phép người dùng lựa chọn hàng cần điều chỉnh.
- Merge Cột; Merge hàng: Người dùng có thể hợp nhất nhiều cột trong một hàng hoặc nhiều hàng trong một cột.
Sau khi điều chỉnh tính năng Merge Cột hoặc Merge hàng, giao diện sẽ hiển thị như hình dưới đây
Sửa cột
Gồm những công cụ để đưa nội dung vào bố cục người dùng đã tạo từ Tab hàng cột ở phần trên. Chọn kiểu định dạng content muốn sử dụng và kéo, thả vào phần giao diện hiển thị. Tab nội dung bao gồm các định dạng content dưới đây:
- Văn bản
- Hình ảnh
- Buton
- Đường kẻ
- Mạng xã hội
- Khối trống
- Ảnh + Tiêu đề
- Ảnh + Button
- Ảnh + Tiêu đề + Button
- Video
- Body
- Footer
- Header
Các tab chỉnh sửa chính
Trong các khối nội dung có 3 tab chỉnh sửa chính: Tab Nội dung, Tab Kiểu, Tab Cấu hình.
Tab nội dung
Cho phép người dùng chỉnh sửa nội dung chi tiết của từng khối trên mẫu email. Tab nội dung bao gồm những thông số chi tiết sau:
- Nhập nội dung
- Văn bản thay thế
- Liên kết tới
- Địa chỉ web/email/ Số điện thoại
- Theo dõi liên kết
- Tag hành vi
- Mở liên kết ở cửa sổ mới
- Tiêu đề bổ trợ
Tab Kiểu
Cho phép chỉnh sửa định dạng, cách hiển thị của các khối trong mẫu email
- Màu chữ, kiểu chữ, cỡ chữ, in nghiêng, in đậm,…
- Màu nền
- Chiều cao dòng
- Căn chỉnh
- Căn cột Căn lề
- Bo tròn góc
- Đường viền
- Apply kiểu đến tất cả các text/ảnh/video
Tab Cấu hình
Cho phép người dùng tùy chỉnh kích thước và căn chỉnh lề của khối nội dung
- Căn chỉnh
- Chiều rộng
Văn bản
Bước 1: Kéo khối văn bản vào phần hiển thị nội dung email
Bước 2: Lựa chọn tab Nội dung
Đây là tab cho phép người dùng nhập mới và chỉnh sửa nội dung văn bản, có công cụ chỉnh sửa định dạng văn bản cơ bản như căn lề, chỉnh cỡ chữ, font chữ, màu chữ, tạo danh sách,… Ngoài ra, tab này còn có thêm một số chức năng:
– Thêm/ gỡ đường link văn bản
– Thêm trường cá nhân hóa: Giúp người dùng gửi nội dung email mang tính cá nhân hóa đến người nhận như Họ tên, Giới tính, Mã voucher,…
Bước 3: Chọn tab Kiểu
 |  |
Cho phép người dùng điều chỉnh các thông số như Kiểu chữ, Cỡ chữ, Màu nền, Chiều cao dòng, Căn chỉnh, Căn lề, Đường viền, Bo tròn góc; Apply kiểu đến tất cả các text
Ảnh + Tiêu đề; Ảnh + Button; Ảnh + Tiêu đề + Button
Bước 1: Kéo khối hình ảnh vào phần phần hiển thị
Bước 2: Để vào thư viện ảnh, chọn Tab Nội dung, bấm Chọn ảnh
- Thêm thư mục ảnh
- Chọn thư mục ảnh
- Tải file ảnh lên thư viện
- Chọn ảnh trong thư viện
- Xóa chọn: Khi bấm vào một ảnh, người dùng có thể bỏ chọn ảnh, để upload file ảnh mới bằng cách click vào Xóa chọn
- Xóa: Người dùng có thể xóa ảnh khỏi thư viện ảnh bằng cách click vào Xóa
- Chèn ảnh: Người dùng có thể bấm vào Chèn ảnh để thêm ảnh trong email.
Bước 3: Điều chỉnh các thông số ở tab Nội dung
 |  |
- Văn bản thay thế
- Liên kết tới
- Địa chỉ web/email/ Số điện thoại
- Tag hành vi
- Theo dõi liên kết
- Mở liên kết ở cửa sổ mới
- Tiêu đề bổ trợ
Bước 4: Chọn Tab Kiểu
| Sửa chung | Sửa ảnh |
| Màu nền Đường viền Bo tròn Căn lề Căn lề ngoài | Đường viền Bo tròn góc |
Bước 5: Chọn Tab Cài đặt
Người dùng có thể điều chỉnh Chiều rộng của ảnh và căn chỉnh ảnh (trái, phải, giữa) ảnh trong email hoặc trong khối
- Chọn Layout: Đối với những lựa chọn khối nội dung Ảnh + Tiêu đề; Ảnh + Button; Ảnh + Tiêu đề + Button, người sử dụng có thể cấu hình vị trí hình ảnh với Hình ảnh nằm trên/dưới/ trái/phải Tiêu đề và Button
- Cài đặt Button: Cấu hình chiều rộng của của button đi kèm với hình ảnh.
2.2.3. Button
Bước 1: Kéo khối Button
Bước 2: Chọn Tab Nội dung
 | ▪ Nội dung ▪ Liên kết tới ▪ Địa chỉ web link ▪ Tag hành vi ▪ Tiêu đề ▪ Mở liên kết ở cửa sổ mới ▪ Gạch dưới liên kết |
Bước 3: Chọn Tab Kiểu, cấu hình các thông số sau
| Kiểu chữ, kích thước chữ, màu chữ | Màu nền trong, màu nền ngoài, chiều cao dòng | Bo tròn, đường viền, căn lề trong, căn lề ngoài |
Bước 4: Chọn Tab Cài đặt
 | Chiều rộng Căn chỉnh |
2.2.4. Video
Bước 1: Kéo khối video vào phần chỉnh sửa.
Bước 2: Chọn Tab Nội dung, chỉnh sửa các thông số sau.
 |  |
| Video | Sửa caption |
| ▪ Video URL ▪ Chọn ảnh ▪ Ảnh mặc định ▪ Gắn YoutubeIcon Player | ▪ Nội dung caption video ▪ Công cụ chỉnh sửa caption |
Bước 3: Chọn Tab Kiểu, chỉnh sửa các thông số sau.
 |  |  |
| Sửa chung | Sửa ảnh preview | Sửa text |
| ▪ Màu nền ▪ Căn cột ▪ Đường viền ▪ Căn lề ▪ Căn lề ngoài | ▪ Đường viền ▪ Bo tròn | ▪ Màu nền ▪ Màu chữ ▪ Kiểu chữ ▪ Chiều cao dòng ▪ Căn chỉnh ▪ Căn lề ▪ Đường viền |
Bước 4: Chọn Tab Cài đặt.
Người dùng có thể tùy chỉnh Vị trí Caption bao gồm dưới/trên/trái/phải so với vị trí video.
2.2.5. Đường kẻ ngang
Bước 1: Chọn đường kẻ ngang cần chỉnh sửa.
Bước 2: Chỉnh sửa thông số trong Tab Cài đặt.
 | ▪ Apply đến tất cả các đường kẻ ▪ Chiều rộng ▪ Đường phân cách ▪ Màu nền ▪ Căn lề |
2.2.6. Mạng xã hội.
Bước 1: Kéo, thả khối Mạng xã hội.
Bước 2: Chọn Tab Nội dung để tùy chỉnh.
 | ▪ Chọn Mạng xã hội ▪ Nhập Đường dẫn URL ▪ Nhập tên mạng xã hội ▪ Thêm mạng xã hội ▪ Xóa mạng xã hội |
Bước 3: Chọn Tab Kiểu.
Người dùng có thể tùy chỉnh màu nền, màu nền ngoài, đường viền, căn lề cho khối mạng xã hội
Bước 4: Chọn Tab Cài đặt.
 | ▪ Chiều rộng ▪ Căn chỉnh ▪ Hiển thị, layout, chọn kiểu icon |
Cấu hình (Style tab)
Tab cấu hình hỗ trợ người dùng tùy chỉnh chiều rộng nội dung toàn bộ email. Sau khi cấu hình, những thay đổi sẽ được áp dụng ngay tại phần hiển thị.
Bước 1: Chọn tab Cấu hình.
Bước 2: Chỉnh sửa độ rộng khối nội dung.
 |