Thiết Kế Website FlatUX | Trang chủ

Hướng dẫn sử dụng công cụ FlatUX Editor Pro

  1. Trang chủ
  2. Tư Vấn
Hướng dẫn sử dụng công cụ FlatUX Editor Pro

Ngày đăng: 09:55 07-06-2022 | 317 lượt xem

Với hơn 10 năm kinh nghiệm, tích lũy từ nhiều đóng góp của khách hàng, bộ công cụ FlatUX Editor Pro là phiên bản tốt nhất để soạn thảo bài viết cho website (Bài rất dài, Anh/Chị nên dành khoảng 60 phút để học công cụ này. Một số mục nâng cao dành cho những người biết sơ sơ về HTML thì có thể bỏ qua)

Đây là danh sách các chức năng của bộ công cụ soạn thảo
Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Sau đây FlatUX sẽ hướng dẫn Anh/Chị sử dụng từng chức năng

Công cụ định dạng văn bản

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Để sử dụng công cụ định dạng văn bản, sẽ có 2 trường hợp để mở
  1. Nếu văn bản chưa được định dạng thì phải bôi đen (quét chọn) văn bản cần định dạng. Sau đó nhấn vào nút trên để bật Popup
  2. Nếu đã định dạng và muốn chỉnh sửa thì Double click (nhấn chuột 2 lần) lên văn bản để mở Popup
➡️ Popup định dạng như hình bên dưới đây!
Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Công cụ định dạng văn bản FlatUX Editor Pro
Tại Popup "Format" Anh/Chị lưu ý có 2 nhóm công cụ. Nhóm trên là nhóm cơ bản thường xuyên sử dụng
Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Nhóm công cụ định dạng văn bản cơ bản FlatUX Editor Pro
Mục "Format" gồm có các lựa chọn H1, H2, H3, H4, P, A, Strong, Span tương ứng với các thẻ HTML. Lưu ý: Mặc định H1 là tiêu đề bài viết, nên nếu không vì mục đích khác hãy lựa chọn các thẻ HTML từ H2 trở đi, để tối ưu chuẩn SEO thì trong mỗi bài viết hãy tổ chức từ 3-5 H2, trong mỗi H2 có từ 3-5 H3, trong mỗi H3 hãy dùng thêm 1-3 thẻ Strong & A
Nhóm dưới đây là nhóm công cụ chỉ dành cho chuyên gia, đã biết viết HTML muốn chỉnh sửa nâng cao
Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Nhóm công cụ định dạng HTML nâng cao chỉ dành cho chuyên gia
Sau khi chọn một loạt các thiết lập Anh/Chị chọn "OK" là định dạng sẽ được ghi lên văn bản. Lần tiếp theo nếu muốn chỉnh sửa, chỉ cần Double Click lên văn bản đó

Công cụ xóa định dạng văn bản

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Không phức tạp như định dạng, chỉ cần quét chọn đoạn văn bản (hoặc Ctrl A để chọn hết) rồi bấm nút trên. Tất cả định dạng "bên ngoài" sẽ được làm sạch, chỉ còn văn bản thuần

Công cụ đánh số thứ tự

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Mục đích của công cụ này là tạo dạng danh sách theo số thứ tự, ví dụ như sau:
  1. Đây là dòng số một
  2. Đây là dòng số hai
  3. Đây là dòng số ba
Mặc định kiểu định dạng cơ bản như trên, Anh/Chị có thể chọn định dạng cho danh sách thứ tự bằng cách "Right Click" nhấn phải chuột lên danh sách, tại "Style Number List" chọn kiểu yêu thích
Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Lựa chọn kiểu định dạng số thứ tự

Công cụ liệt kê danh sách

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Mục đích của công cụ này là tạo dạng danh sách, ví dụ như sau:
  • Đây là dòng số một
  • Đây là dòng số hai
  • Đây là dòng số ba
Mặc định kiểu định dạng cơ bản như trên, Anh/Chị có thể chọn định dạng danh sách bằng cách "Right Click" nhấn phải chuột lên danh sách, tại "Style Bullet List" chọn kiểu yêu thích
Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Kiểu định dạng danh sách FlatUX Editor Pro

Công cụ đánh dấu khối văn bản "Blockquote"

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Anh/Chị quét chọn văn bản trước khi dùng nút trên, sau khi nhấn nút sẽ có kiểu khối như bên dưới
Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Công cụ đánh dấu Blockquote trong FlatUX Editor Pro

Công cụ canh lề văn bản

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Công cụ canh lề FlatUX Editor Pro

Công cụ chèn & xóa liên kết

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Quét chọn văn bản cần chèn liên kết sau đó nhấn nút "Link"
Trong Popup "Link" lưu ý:
  • Nếu chèn liên kết nội bộ thì không cần chọn Protocol
  • Nếu liên kết đến website khác bên ngoài thì phải chọn Protocol
  • Phần Target chọn "Popup" sẽ bật Popup lên, chọn "New tab" sẽ mở ra Tab mới
  • Phần Type để chọn kiểu: Liên kết hay Số điện thoại

Công cụ chèn hình ảnh

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
  • Đặt con trỏ chuột tại vị trí muốn chèn hình ảnh, nhấn vào nút trên để tìm hình ảnh chèn vào
  • Mặc định thẻ ALT sẽ là tiêu đề bài viết, nếu muốn chỉnh sửa nhấn Double Click lên ảnh
  • Muốn chèn Caption cho hình ảnh thì Check nút "Captioned image" sau đó nhập nội dung

Công cụ chèn Video Youtube

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Đặt con trỏ chuột tại vị trí muốn chèn Video Youtube, nhấn vào nút trên để bật Popup "Embed Youtube"
Chèn link Youtube đầy đủ (ví dụ: https://www.youtube.com/watch?v=s5OvPhx-Hqg)
Sau chèn link vào hộp thoại Popup và nhấn OK. Video Youtube sẽ được nhúng ngay, để xóa hoặc di chuyển Video trong nội dung Anh/Chị thực hiện như sau:
Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Bấm vào nút góc trái trên để chọn hộp nội dung Video
  • Bấm Delete trên bàn phím để xóa
  • Bấm Ctrl C để Copy, sau đó đặt con trỏ chuột tại tại vị trí mới bấm Ctrl V

Công cụ chèn Google Map

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Đặt con trỏ chuột tại vị trí muốn chèn Google Map, nhấn vào nút trên để bật Popup "Insert Google Map/HTML"
Để lấy code của Google Map, mở Google Map, chọn địa điểm của Anh/Chị sau đó nhấn nút Share → Embed a map → COPY HTML
Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Cách lấy code Google Map

Công cụ chèn Form

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Mục đích để lấy thông tin khách hàng (Họ tên, SĐT, Email hoặc Nội dung yêu cầu). Tùy theo nhu cầu mà chọn các trường cho phù hợp
Nhấn vào nút trên để chèn Form mặc định như sau

ĐĂNG KÝ THIẾT KẾ WEBSITE

ĐĂNG KÝ NGAY

Để tùy chỉnh lại Form Anh/Chị thực hiện như sau:
  • Để xóa một trường thông tin (Ví dụ không dùng trường Email), Anh/Chị click chuột lên trường đó rồi bấm phải chuột chọn Delete Input
  • Để thay đổi hình nền hay kiểu Form, nhấn phải chuột lên Form chọn Style/Bakground để thay đổi

Công cụ chèn Tab nội dung

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Mục đích để tạo kiểu nội dung như bên dưới. Đặt con trỏ tại vị trí cần chèn và nhấn nút "Insert Tab"
Tab 1Tab 2Tab 3
Content 1
Content 2
Content 3
Để xóa/sửa Tab nào thì nhấn chuột lên Tab đó, sau đó nhấn phải chuột chọn công cụ tương ứng
Để xóa bỏ tất cả Tab, rê chuột lên Tab rồi click chọn nút góc trái trên vừa mới hiện ra

Công cụ chèn Hỏi đáp

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Để tạo danh sách hỏi đáp nhanh trong bài viết, đặt trỏ chuột tại vị trí cần chèn sau đó Anh/Chị nhấn nút trên. Kết quả như sau

Question 1

Answer 1

Question 2

Answer 2

Question 3

Answer 3

Công cụ chèn Gallery/Slider hình ảnh

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Lưu ý vẫn phải luôn đặt trỏ chuột đúng nơi cần chèn, sau đó nhấn vào nút công cụ trên. Kết quả sẽ như sau
Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Lưu ý đặt trỏ chuột vào thanh màu Xám trước khi chèn ảnh
Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Tiếp theo, Anh/Chị chèn ảnh bằng công cụ "Insert Image", click lên ảnh Thumbs nào thì Thumbs đó làm đại diện

Công cụ chèn Hộp văn bản HTML

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Mục đích để trình bày nội dung đẹp mắt hơn với bố cục chia cột, sau khi nhấn nút trên sẽ ra một HTML như sau:
Hướng dẫn sử dụng công cụ FlatUX Editor Pro
HTML hộp văn bản FlatUX Editor Pro
Nhấn lên hình để thay đổi hình ảnh, nhập sửa văn bản trực tiếp. Click phải chuột để thay đổi Style, Thêm mới, Xóa hoặc Sắp xếp

Công cụ chia khối Grid

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Mục đích chia cột nội dung, giúp trình bày rõ ràng. Kết quả chèn Grid như sau, ưu điểm của công cụ này là tối ưu hiển thị trên Mobile, trên Mobile kết quả sẽ hiện thị hàng dọc thay vì hàng ngang
Column 1
Column 2
Column 3
Column 4

Công cụ chèn Mục lục (Table Of Content)

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Mục lục thường được chèn ở đầu viết hoặc sau phần dẫn nhập, đặt con trỏ chuột tại vị trí cần chèn và nhấn nút "Table Of Contents"
Mục lục bài viết sẽ tự động lấy tất cả các thẻ Heading H2,H3,H4 để lập chỉ mục

Công cụ chèn Bảng biểu

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Nhấn vào công cụ trên sẽ cho kết quả như sau, click phải chuột để khám phá các tính năng của công cụ bảng biểu
   
   

Công cụ chèn Biểu tượng cảm xúc

Hướng dẫn sử dụng công cụ FlatUX Editor Pro
Giúp cho bài viết thêm phần sinh động với những Icon ngộ nghĩnh. Hàng trăm Icon với các chủ đề để lựa chọn
👍💗✌️😍
 

Bài viết liên quan

Mẫu giao diện website Nhà hàng

09:09 24-05-2022

Mẫu giao diện website Nhà hàng

Mẫu giao diện website Bất Động Sản

16:35 26-04-2022

Mẫu giao diện website Bất Động Sản

Mẫu giao diện website Nội Thất

11:44 28-04-2022

Mẫu giao diện website Nội Thất

Mẫu giao diện website Mỹ phẩm

11:31 28-04-2022

Mẫu giao diện website Mỹ phẩm

Mẫu giao diện website Thời Trang

11:08 10-05-2022

Mẫu giao diện website Thời Trang

Mẫu giao diện website Điện Thoại

10:30 11-05-2022

Mẫu giao diện website Điện Thoại

Mẫu giao diện website Nha Khoa

09:01 23-05-2022

Mẫu giao diện website Nha Khoa

Mẫu giao diện website Thiết Bị Công Nghiệp

15:07 23-05-2022

Mẫu giao diện website Thiết Bị Công Nghiệp

Mẫu giao diện website Ô tô

10:03 30-06-2022

Mẫu giao diện website Ô tô

Mẫu giao diện website Vận tải

11:19 01-06-2022

Mẫu giao diện website Vận tải

Mẫu giao diện website Thú Cưng

10:50 08-06-2022

Mẫu giao diện website Thú Cưng

Mẫu giao diện website Khách sạn

10:57 08-06-2022

Mẫu giao diện website Khách sạn

Thiết Kế Website FlatUX

Công Ty Cổ Phần Công Nghệ FlatUX
14 Đường 9, KĐT Vạn Phúc, Thủ Đức, TPHCM

Hotline/Zalo: 0937.459.336
Facebook https://facebook.com/flatux

Giấy CNĐKDN: 0314732660 - Sở KH&ĐT TP.HCM
Thiết Kế Website FlatUX với nền tảng riêng đáp ứng mọi yêu cầu, triển khai dự án website nhanh

DMCA.com Protection Status

Dịch Vụ

  • Thiết Kế Website Giá Rẻ
  • Dịch vụ SEO Website Tổng Thể
  • Dịch Vụ Chăm Sóc Website
  • Thiết Kế Website Bất Động Sản
  • Thiết Kế Website Bán Hàng

Về chúng tôi

  • Giới Thiệu
  • Quy Định Bảo Hành
  • Chính Sách Bảo Mật
  • Tuyển Dụng
  • Đại Lý

Trung tâm trợ giúp

  • Hướng Dẫn Sử Dụng
  • Thanh Toán
© All Rights Reserved | Designed by FlatUX
Hotline Zalo Facebook