Hướng dẫn sử dụng Elementor để tạo website (phần 1)

Mong muốn của chúng ta là tự tay tạo ra một website đẹp và chuyên nghiệp. Tuy nhiên, không phải ai cũng có đủ kỹ năng về lập trình, code, PHP, CSS… để làm được điều này.

May mắn là hiện tại có nhiều plugin hỗ trợ người dùng tạo trang chỉ bằng những thao tác kéo/ thả trực quan, 1 trong những plugin page builder hàng đầu hiện nay đó là Elementor.

Bài viết hôm nay, mình sẽ chia sẻ với các bạn cách sử dụng plugin tạo trang mạnh mẽ này.

Elementor là 1 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 biết nhiều về thiết kế web hay lập trình.

Đây là 1 plugin có phí, tuy nhiên bạn chỉ cần sử dụng bản Free của Elementor là đã có thể thoải mái sáng tạo rồi.

Ở dưới là bảng giá tham khảo, bạn có thể chọn mua bản Pro để ủng hộ nhà phát triển.

Bạn có thể tải bản cài đặt của Elementor theo link này

Để cài đặt plugin Elementor, bạn có thể làm theo hướng dẫn này của mình: Hướng dẫn cài đặt Plugin WordPress

Elementor có thể dùng để làm gì?

Với Elementor, chúng ta có thể tạo giao diện cho tất cả thành phần của website:

  • Trang chủ
  • Landing page giới thiệu sản phẩm, bán hàng
  • Trang giới thiệu
  • Trang liên hệ
  • Header, footer, sidebar
  • Giao diện bài viết (Post)
  • ….

Về có bản, chúng ta có thể dùng Elementor để tạo: Page, Post và Template.

Về sự khác biệt của Page và Post, bạn có thể đọc bài viết của mình ở đây

Hướng dẫn sử dụng trước khi dùng

Đầu tiên, bạn khoan hẵng vội lao vào mần phần mềm ngay, mà việc đầu tiên là bạn sẽ cần phải hình dung ra giao diện website của bạn nó sẽ như thế nào trước đã. Bạn nên lấy 1 tờ giấy ra và phác thảo giao diện bạn muốn như thế nào trước. Một vài gợi ý cho bạn:

  • Header cần có những gì? Logo đặt đâu? Có nên đặt button gì không?…
  • Footer thì mình show nội dung gì? Chia mấy cột?…
  • Trang chủ thì mình muốn làm gì, show những nội dung gì?…

Những nội dung này sẽ thay đổi tùy theo mong muốn của bạn, nên tốt nhất bạn nên có 1 cái khung (wireframe) rồi hẵng bắt đầu lên design để tránh mất thời gian về sau, sẽ bị cuốn vào việc làm layout mà lạc trôi (như mình).

Bạn có thể tham khảo các giao diện mẫu ở Pinterest với keyword “Web Design” hoặc đơn giản là click link này cho lẹ.

Source: https://www.pinterest.com/pin/74309462577821706/

Ở bên trái là 1 ví dụ mình tìm được trên pinterest, giờ chúng ta bắt đầu phân tích xem là chúng ta sẽ làm gì với Elementor nào.

Như bạn thấy ở hình bên trên, 1 giao diện sẽ gồm các thành phần cơ bản là Header (nằm trên), Footer (nằm dưới), và các Section ở giữa, trong các Section to sẽ có các Section nhỏ, và mình sẽ break down hình bên trái để bạn rõ hơn.

Tiếp theo bạn sẽ hình dung được là 1 website nó sẽ gồm những phần nào và tương ứng khi chúng ta làm bên elementor thì nó sẽ như nào nhé, bên trái là hình mình đã phân tích giao diện của hình bên trên, và bên phải là mình mà mình (và bạn) có thể làm với Elementor chỉ cần kéo và thả.

Okay, bạn đã có thể hình dung được cách chúng ta tạo ra 1 giao diện như nào rồi đúng ko, đơn giản là chỉ cần kéo thả để tạo các section, muốn 1 cột làm 1 cột, muốn 2 cột thì làm 2 cột, sau đó lại tiếp tục fill in các nội dung bạn muốn làm vào. Và thế là bùm, ta có 1 cái giao diện.

Mình nghĩ bài này tới đây là cũng nhiều rồi, giờ mình tiếp tục học sử dụng Elementor ở bài 2 nhé!

Link here: https://natecue.com/huong-dan-su-dung-elementor-de-tao-website-phan-2/

Facebook
LinkedIn

4 thoughts on “Hướng dẫn sử dụng Elementor để tạo website (phần 1)”

  1. Pingback: Hướng dẫn sử dụng Wordpress toàn tập -

  2. Pingback: Các bước để tạo 1 website với Wordpress và Elementor -

  3. Pingback: Hướng dẫn tất tần tật về Font chữ cho người mới -

  4. Pingback: Những cách tạo website - Hướng dẫn cho người mới bắt đầu -

Leave a Comment

Your email address will not be published. Required fields are marked *