Over 10 years we helping companies reach their financial and branding goals. Onum is a values-driven SEO agency dedicated.

CONTACTS
Thiết kế web Wordpress

Hướng dẫn sử dụng Elementor trong WordPress

Elementor là 1 plugin WordPress giúp bạn thiết kế web dễ dàng hơn chỉ bằng việc kéo thả mà không cần xử lý code nhi�u. Hiện Elementor có 2 phiên bản miễn phí và trả phí. Nếu nhu cầu thiết kế web của bạn không nhi�u bản miễn phí cũng đủ để bạn dùng các chức năng thông dụng.

I. Cài đặt Elementor

Elementor cũng giống các plugin thông thư�ng khác, việc cài đặt cũng không có gì khác biệt.

» Tại giao diện quản trị wordpress, bạn chá»�n “Pluginâ€� â€º click “Cài má»›i“.

Tìm kiếm plugin elementor

» Tìm từ khóa “Elementorâ€� tại thanh công cụ tìm kiếm â€º sau đó click “Cài đặt“.

Lựa ch�n đúng plugin

» Quá trình cài đặt hoàn thành, bạn click “Kích hoạt“.

Kích hoạt để bắt đầu sử dụng

» Elementor đã được xuất hiện tại trang quản trị.

Elementor xuất hiện ở menu wordpress

Ngoài cách này, bạn cÅ©ng có thể download trá»±c tiếp plugin này từ trang chá»§ elementor.com.

Như vậy bạn đã hoàn tất việc cài đặt plugin Elementor bản miễn phí.

Tiếp theo chúng ta sẽ đi vào chi tiết hướng dẫn sử dụng Elementor.

II. Sử dụng Elementor Pro

1. Tạo bài post/page bằng Elementor

» �ể tạo bài đăng dạng bài viết hoặc trang, chúng ta sẽ thao giống như bình thư�ng. Sau đó bạn lựa ch�n “Sửa với Elementor� để đến giao diện dựng trang của Elementor.

Kích hoạt trình dựng page Elementor

2. Giao diện plugin Elementor wordpress

Như thư�ng lệ, chúng ta sẽ bắt đầu với giao diện ngư�i dùng.

Giống như các trình tạo trang khác. Bảng đi�u khiển của Elementor là tập hợp của các phần tử và công cụ hỗ trợ tạo trang.

Giao diện làm việc của Elementor hoạt động ổn định và trực quan. �ặc biệt chúng không chiếm nhi�u không gian trên màn hình soạn thảo, đi�u này rất có ích nếu màn hình máy tính của bạn có kích cỡ không lớn.

Giao diện đơn giản và tiện dụng

» Với cách sử dụng mũi tên nh� trên bảng đi�u khiển, cho phép bạn xem trước bài đăng. Tất nhiên bạn không thể chỉnh sửa trong bản xem trước này.

Mẹo nh�: Bạn có thể sử dụng phím tắt “Ctrl + P� trên bản phím để sử dụng chức năng này của Elementor.

Bạn có thể ẩn/hiện menu làm việc

» á»ž trên cùng bên trái, bạn sẽ tìm thấy cài đặt trang. Tại đây có nhiá»�u công cụ mà bạn sẽ cần dùng tá»›i chúng trong quá trình làm ná»™i dung.

Menu chứa các phần tử

» Dưới cùng bên góc trái, có thêm các tùy ch�n hữu ích khác.

Tuỳ ch�n phục vụ hiển thị và tạo trang

• Trong đó

1 – Cài đặt: Các tùy ch�n chung cho bài đăng như tiêu đ�, kiểu n�n, layout…

2 – Nagivator: Trình quản lý bài đăng theo layer, bạn có thể quản lý vị trí phần tử bằng cách kéo thả tại đây.

3 – Lịch sử: Các thao tác chỉnh sửa và layout của bạn sẽ được lưu tại đây. Bạn có thể hoàn tác bất kỳ thao tác lỗi nào.

4 – Chế độ Responsive: Các chế độ xem trước của bài đăng trên các thiết bị, bao gồm máy tính, máy tính bảng, thiết bị di động. Bạn có thể chỉnh sửa giao diện bài đăng phù hợp cho từng thiết bị riêng biệt mà không ảnh hưởng tới các thiết bị khác.

5 – Biểu tượng Preview: Chế độ xem trước bài đăng trước khi xuất bản.

6 – Xuất bản: �ăng bài đăng (post, page).

» Biểu tưởng góc cùng bên phải sẽ là nơi đưa bạn đến giao diện quản lý các phần tử dựng trang.

Dựng trang tạo nội dung bằng kéo thả

Việc thêm các phần tử dựng trang vào nội dung bài đăng, bạn chỉ việc kéo chúng từ danh sách quản lý, sau đó thả chúng vào vùng layout của trang.

V� phần giao diện quản lý phần chính chỉ có như vậy. Chúng ta sẽ mất một chút th�i gian để làm quen với chúng.

Nhìn chung, giao diện quản lý của Elementor rất g�n gàng và dễ sử dụng.

3. Tùy ch�n bố cục và cột

Việc tạo bố cục cụ thể là tất cả những gì mà các trình dựng trang đ�u có, vậy Elementor cụ thể sẽ thao tác như thế nào?

Câu trả l�i sẽ có ngay sau đây.

» Trong khu vực layout.

Bạn cần ch�n bố cục theo cột và vùng trước tiên

» Click vào lựa ch�n “Thêm mục mới� màu tím.

Thêm bố cục để bắt đầu

» Các bố cục tùy ch�n cho bài đăng sẽ hiện ra. Bạn có thể lựa ch�n bất kỳ bố cục layout nào phù hợp với nội dung của bạn.

Lựa ch�n bố cục phù hợp với nội dung

Thông thư�ng, bố cục 1 cột duy nhất sẽ là măc định cho tất cả các bài đăng.

» Ngoài ra, việc thêm một cột cũng hoàn toàn dễ dàng trong quá trình làm nội dung. Bằng cách click vào biểu tượng cột và ch�n “Add new column“.

Thêm bớt cột nhanh chóng

» Bạn có thể chỉnh sửa độ rộng từng cột bằng cách di chuyển qua phần tử cột để hiển thị đư�ng vi�n, sau đó kéo để tăng/giảm.

Tăng giảm kích thước cột dễ dàng

4. Các phần tử Widget

�ây là những phần tử nh� mà bạn sử dụng để thể hiện nội dung của bài đăng. Elementor cung cấp một thư viện rất nhi�u các công cụ để bạn lựa ch�n.

Các phần tử cần thiết khi dựng trang

5. Lưu Widget và sử dụng cho bài post/page

Bước 1. Lưu Widget vào thư viện

Việc lưu riêng lẻ những mẫu Widget sau khi hoàn thành giúp chúng ta có thể sử dụng lại chúng bất cứ khi nào muốn. �ối với Elementor thì việc này hoàn toàn dễ dàng và nhanh chóng.

» Click chuá»™t phải vào biểu tượng “Sá»­a mụcâ€� cá»§a phần tá»­ muốn lưu â€º click “Lưu dưới dạng mẫu“.

Sao lưu và dùng lại nhanh chóng với Elementor

» Nhập tên mẫu, sau đó click “Lưu“.

�ặt tên để dễ dàng phân biệt

» Mẫu bạn lưu sẽ được tá»± động thêm vào  “Mẫu cá»§a tôiâ€� trong “Thư việnâ€� cá»§a Elementor.

Thư viện mẫu sẽ chứa toàn bộ danh sách bạn đã lưu

Bước 2. Sử dụng các Widget đã lưu trong thư viện

Sau khi lưu Widget, bạn sẽ sử dụng được chúng trong tất cả các bài đăng bằng Elementor hoặc trình soạn thảo WordPress.

#1. Thêm mẫu bằng trình sửa Elementor

Khi bạn đang thao tác trực tiêp trên trình tạo trang Elementor bạn sẽ thực hiện như sau.

» Trong phần layout, bạn ch�n “Thêm mẫu“.

Lựa ch�n mẫu đã lưu trong thư viện

» Tìm đến “Mẫu cá»§a tôiâ€� trong menu thư viện, và lá»±a chá»�n Widget cần sá»­ dụng.

Lựa ch�n tên mẫu cần dùng

Trư�ng hợp sử dụng trình tạo trang mặc định của wordpress, bạn cần sử dụng mẫu bằng “id�.

#2. Thêm mẫu bằng trình soạn thảo WordPress

» Tại trang quản trị WordPress â€º chá»�n “Elementorâ€� â€º chá»�n “Mẫu cá»§a tôi“.

Thêm mẫu từ menu wordpress

» Trong phần “Shortcodeâ€� â€º chá»�n và copy “Elementor template idâ€� tương ứng vá»›i mẫu bạn mong muốn thêm vào ná»™i dung bài đăng.

Lựa ch�n mẫu bằng cách copy “shorecode�

» Paste “Elementor template idâ€� vào trình soạn thảo WordPress. Ná»™i dung mẫu bạn lưu sẽ hiển thị như má»™t bài đăng bình thưá»�ng.

Shortcode sẽ hoạt động sau khi paste

6. Sử dụng thư viện của Elementor pro

Thư viện của Elementor có đầy đủ các mẫu cho bạn lựa ch�n, bao gồm:

  • Blocks: Những mẫu bố cục nhá»� như phần giá»›i thiệu, đồng hồ đếm ngược, review.
  • Page: Trang đã được bố cục đẹp theo nhiá»�u dạng và chá»§ Ä‘á»� khác nhau.

Cách sử dụng 2 loại mẫu này như sau

» Trong phần layout, bạn chá»�n “Thêm mẫu“.

Thêm mẫu từ trình tạo trang

» Thêm mẫu đối với “Blocks� và “Trang� đ�u giống nhau. Bạn kéo tr� chuột tới mẫu cần thêm, sau đó click “Chèn“.

Ch�n trang hoặc blocks

» Sau khi chèn, mẫu sẽ xuất hiện trong bài đăng. Bạn có thể tùy chỉnh nội dung và hình ảnh của mẫu đã chèn.

Mẫu hiển thị ngay khi ch�n

7. Hoàn tác và lịch sử sửa đổi

Trong quá trình làm việc với nội dung bài đăng, chúng ta khó có thể tránh kh�i sai sót v� text cũng như bố cục.

Việc khắc phục những sai sót đối vá»›i Elementor hoàn toàn đơn giản và nhanh chóng bằng công cụ “Lịch sử“. Ngoài ra, phím tắt hoàn tác thông thưá»�ng “Ctrl + Zâ€� cÅ©ng sẽ sá»­ dụng được trong Elementor.

» Các hành động nh� nhất sẽ được lưu lại ngay sau khi bạn thực hiện. Chúng sẽ được lưu lần lượt từ cũ và mới theo từng lớp hành động. Bạn chỉ cần di chuột tới hành động cần “hoàn tác� và click vào biểu tượng trong hình.

Lịch sử thao tác được lưu lại hoàn toàn

8. Lưu nháp và xuất bản bài đăng

Sau khi hoàn thành việc chỉnh sửa nội dung và bố cục bài đăng. Bạn có thể lưu bài đăng dưới dạng nháp thông thư�ng hoặc thành dạng mẫu để sử dụng sau này.

Nếu bài đăng nội dung đã đạt yêu cầu nội dung và bố cục. Bạn có thể đăng nó ngay trong Elementor.

Lưu hoặc xuất bản ngay đ�u được với Elementor

III. Tạm kết

Như vậy, mình đã cùng bạn tìm hiểu các chức năng chính cá»§a plugin Elementor qua bài viết hướng dẫn sá»­ dụng Elementor pro WordPress. Ä�ây là má»™t trong những công cụ tốt nhất hiện nay, trong việc xây dá»±ng má»™t trang landing page trên ná»�n tảng WordPress.

Elementor có uy tín lớn trong cộng đồng sử dụng WordPress và được rất nhi�u ngư�i sử dụng, với hơn 1 triệu lượt cài đặt.