Hướng Dẫn Sử Dụng Elementor

Page builder : Plugin được cài đặt trên WordPress để giúp bạn dễ dàng tạo các layout phức tạp trên website mà không cần đòi hỏi bạn cần biết bất kì một loại ngôn ngữ lập trình nào.

  Tôi sử dụng Page builder để thiết kế website nhanh và để khách hàng dễ dàng chỉnh sửa sau bàn giao. Phần lớn website tôi thiết kế đều sử dụng Elementor – Plugin phát triển vô cùng nhanh trong năm 2017 từ 20k lượt cài đặt lên đến 400k lượt kích hoạt.

Update: Tháng 07/2018: lượt kích hoạt plugin này đã là 1 triệu. Nhiều người dùng + mã nguồn mở –> nhiều người phát triển –> bạn sẽ được lợi rất rất nhiều khi sử dụng plugin này.

Hướng Dẫn Sử Dụng Elementor

Elementor rất dễ sử dụng, tuy nhiên để thiết kế MỚI một layout đẹp đòi hỏi bạn phải có một vài kiến thức về thẩm mỹ và sự sắp xếp bố cục sao cho đẹp mắt. Vì vậy trong bài viết này tôi chỉ hướng dẫn chỉnh sửa những layout CÓ SẴN mà tôi đã thiết kế cho các bạn.

1/Chỉnh sửa bằng Elementor

Khi bạn đã đăng nhập vào quản trị website, sẽ có một menu nền đen trên cùng.
Để chỉnh sửa bất kì trang nào trong website, chỉ cần truy cập vào trang đó và ấn nút “Edit with Elementor”

2/Các thành phần chính trong layout website

Các thành phần chính của một layout website

  • Section: (ở đây là vùng backgroung màu xanh) – là hàng chứa các cột
  • Cột: 1 Seciton có thể có nhiều cột
  • Đối tượng– Element:   Là nội dung của mỗi cột, có thể là icon, văn bản, hình ảnh, video…

3/Chỉnh Sửa Các Element

Nguyên tắc cơ bản của chỉnh sửa trong page builder: Nếu bạn muốn chỉnh sửa nội dung nào trên layout, hãy click vào nội dung đó, tùy vào từng giao diện làm việc của page builder, sẽ có chỗ để bạn chỉnh sửa nội dung đó.

Với Elementor, khi click vào bất kì đối tượng nào, sidebar bên trái sẽ xuất hiện nhựng nỗi dung của đối tượng đó như icon, hình ảnh, văn bản.. bạn sẽ chỉnh sửa trực tiếp ở vùng này.

Ví dụ khi click vào nội dung image box - sẽ bao gồm hình ảnh, tiêu đề và mô tả

4/Chỉnh Sửa Cột - Section

 Tùy chỉnh, sửa đổi section -cột: Để tùy chỉnh( màu sắc, nền, chiều cao…) của section hay cột, hãy di chuyển chuột vào góc trên( với section – icon 6 dấu chấm, nền xanh) hay góc bên phải( với cột- icon cửa sổ, nền đen).

 Tùy chỉnh, sửa đổi đối tượng: click trực tiếp vào đối tượng hoặc click vào icon cây bút trên góc phải

Ở mức căn bản tôi chỉ hướng dẫn chỉnh nền của section, cột

Để chỉnh sửa nên của section, click cài đặt section--> vào style--> phần background: tại đây bạn có thể cài đặt nền của section là ảnh hay màu tùy bạn

5/Menu Chuột Phải

  Từ bản 2.1, elementor có chức năng copy+ dán và  có thêm chức năng “chuột phải” trên môi trường làm việc. Các menu của chuột phải trong elementor sẽ giúp bạn:

  •  Nhân đôi section, cột, đối tượng
  • Copy rối dán đối tượng, cột, section, hoặc toàn bộ trang
  • Copy rồi dán các cài đặt của đối tượng, cột, section ( paste)
  • Xóa

6/Lưu

Sau khi chỉnh sửa nhớ ấn update để lưu lại.

Bài viết chỉ đơn giản là hướng dẫn các bạn chỉnh sửa từ layout sẵn có mà tôi đã thiết kế. Elementor là một công cụ vô cùng mạnh mẽ, những seting, styling, hiệu ứng.. đa dạng và phức tạp đều có thể sử dụng công cụ này. Nếu muốn thành thạo và làm chủ công cụ này, hãy thường xuyên sử dụng, tham khảo các layout sẵn có, sử dụng và tìm hiểu chi tiết từng element..

Bình Luận
Bình Luận

[fc id=’2′ align=’center’][/fc]

Bình Luận

yêu cầu thiết kế website