Tạo landing page đơn giản sử dụng elementor miễn phí
Ngày đăng: 10/26/2021 4:29:08 PM - Lĩnh vực khác - Toàn Quốc - 65Chi tiết [Mã tin: 3493194] - Cập nhật: 33 phút trước
1. Elementor là gì?
Elementor là một công cụ đang rất hot hiện này khi nói về thiết kế website mà không động tay vào code.
Nó là một page builder trực quan theo kiểu rê thả. Nghĩa là bạn có thể thiết kế một trang web phức tạp chỉ bằng kéo thả các phần tử đã được thiết kế sắn.
Công cụ hỗ trợ thiết kế trực quan. Bạn sẽ thiết kế trang web trong giao diện giống như độc giả nhìn thấy.
Elementor làm việc với hầu hết các theme WordPress. Nhưng tốt nhất bạn nên tham khảo những theme có tương thích cao với Elementor ở đây.
2. Hướng dẫn nhanh cách sử dụng Elementor
Đầu tiên bạn cần cài đặt và kích hoạt phiên bản miễn phí của plugin. Bạn có thể vào trang chủ của plugin tải bản zip và upload lên website của mình.
Cách đơn giản hơn là tìm plugin ngay trong phần cài đặt plugin của website. Sau đó cài đặt và kích hoạt như thường lệ. Sau khi plugin được kích hoạt, bạn tạo một trang mới. Ở giao diện soạn thảo trang mới, đầu tiên bạn cần chọn template.
Có 2 lựa chọn để bạn bắt đầu:
Full-width template: bạn sẽ xây dựng landing full-width, nhưng vẫn giữ lại phần header và footer của website
Blank canvas: bạn xây dựng landing page từ đầu luôn, một trang trắng đúng nghĩa.
Trong landing page mình hướng dẫn trong bài, chúng ta sẽ chọn full-width template. Bây giờ bạn chọn template kiểu này. Nhập tên page mới. Click nút Save Draft. Sau đó click vào nút Edit with Elementor để mở giao diện thiết kế của Elementor.
Giao diện gồm hai phần:
Sidebar bên trái là nơi bạn bổ sung các element vào phần bên phải. Nó cũng là nơi bạn chỉnh sửa phần tử bạn đang chọn bên phải.
Visual Preview: là nơi chứa bản thiết kế của bạn. Giao diện của nó chính xác như người dùng cuối sẽ nhìn thấy.
Để bắt đầu với Elementor, có lẽ bạn sẽ sử dụng template có sẵn để giảm thời gian phát triển landing page. Click vào nút Folder ở phía đáy trang và chọn Template Library. Bên cạnh các template chỉ có ở bản Pro, bạn cũng sẽ có nhiều template miễn phí
Về cơ bản, để xây dựng landing page với Elementor, bạn sẽ rê thả element bạn cần từ sidebar. Sau đó bạn tùy chỉnh lại elementor:
Lúc này sidebar sẽ có 3 tab:
Content: ở đây bạn sẽ thay đổi nội dung của phần tử
Style: nơi bạn thay đổi màu sắc và typography
Advanced: nơi bạn thực thiện thay đổi nâng cao như margin và padding. Thay đổi margin và padding giúp bạn điều chỉnh vị trí của element.
Ok. Bây giờ chúng ta sẽ bắt tay vào tạo một landing page đơn giản như mình giới thiệu bên trên.
3. Tạo Landing Page đơn giản sử dụng Elementor miễn phí
Như bạn thấy landing page của chúng ta gồm 4 khối:
Header, phần tính năng, phần thông tin tác giả, phần đăng ký khóa học để thu thập email.
Đầu tiên tạo phần header, bạn cần click vào nút Add New Section.
Lúc này bạn cần chọn cấu trúc cột. Chúng ta sẽ chọn cấu trúc hai cột. Để bổ sung ảnh vào cột bên phải, bạn chỉ cần kéo element Image. Sau đó trên sidebar click vào phần ảnh để tải và chèn ảnh bạn muốn. Phần cột bên trái, bạn kéo lần lượt 3 element: Heading, Text Editor và Button.
Thực hiện thay đổi nội dung, vị trí vân vân theo ý muốn. Nhớ bạn thay đổi vị trí phần tử ở tab Advanced bằng cách thay đổi margin và padding.
Phần tính năng sản phẩm. Bạn cũng tạo cấu trúc cột đầu tiên. Sau đó kéo element Icon box. Bạn cũng có thể chọn Image box nếu bạn muốn sử dụng ảnh tùy biến thay vì icon.
Phần thông tin tác giả. Cũng tạo cấu trúc hai cột. Kéo ảnh vào cột bên trái. Phần cột bên phải chúng ta sử dụng Heading và Text Editor.
Phần đăng ký. Ở cột bên trái chúng ta sẽ sử dụng counter. Ở bản miễn phí không có element này. Bạn có thể sử dụng plugin counter.
Phần cột bên phải bạn sẽ thêm form thu thập email. Cũng như trên bản miễn phí không có phần tử này. Chúng ta sẽ thiết kế một form thu thập email trong SendPulse. Sau đó bạn lấy code HTML.
Lúc này bạn kéo element HMTL và chèn code vào. Ở giao diện thiết kế bạn sẽ không nhìn thấy form. Nhưng khi chuyển sang xem ở front-end form sẽ hiển thị như bình thường.
Kết luận: Như vậy ttôiddax hướng dẫn các bạn cách tạo Landing Page đơn giản sử dụng elementor miễn phí. Mong rằng các bạn sẽ thích bài viết này. Nếu có câu hỏi thắc mắc nào khác, hãy cmt phía dưới chúng tôi sẽ trả lời bạn nhanh nhất có thể.
Nguồn: Tạo landing page đơn giản sử dụng elementor miễn phí - Cloud Email
Tin liên quan cùng chuyên mục Lĩnh vực khác
- 2
Siêu hot!!! trả nợ ngân hàng cần tiền bán gấp nhà 4 tầng tại trạm trôi diện tích 50 m2 giá chỉ 2 tỷ
Cập nhật: vài giây trước - 4
Bán nhà phố lê văn lương- thanh xuân - dt50m2, mt 7m ,
Cập nhật: vài giây trước - 5
Bán nhà mặt tiền 120m2 ngang gần 9m sân thượng vi vu vip
Cập nhật: vài giây trước - 2
Quận 10-mặt tiền kinh doanh nguyễn duy dương , 76m, 5tầng, nhỉnh 11tỷ
Cập nhật: vài giây trước - 2
Bán nhà riêng cạnh giga mall hiệp bình chánh dưới 5 tỷ, dt 4.5xm, 3t, sổ riêng
Cập nhật: vài giây trước - 2
Nhà đẹp di trạch hoài đức, giá chỉ 3 tỷ 1, s: 40m2 mặt tiền 4,7 m, nhà xây 5 tầng đầy đủ công năng,
Cập nhật: vài giây trước - 2
Bán nhà hiệp bình chánh thủ đức, dt 4.5xm, 3t, nhà đẹp, sổ riêng cạnh giga mall
Cập nhật: vài giây trước - 3
Bán nhà bình thạnh hxh 88m2 5 tầng nở hậu 5,4 m siêu phẩm
Cập nhật: vài giây trước - 2
Bán đất tặng nhà 110m2, đường xe hơi gần chợ vườn lài, an phú đông, quận 12
Cập nhật: vài giây trước - 1
Cần bán mảnh đất ở vị trí mặt phố đường cao xá, đức thượng, hoài đức, s: 65m2 , giá nhỉnh 3 tỷ
Cập nhật: vài giây trước - 1
Bán nhà mặt phố vũ trọng phụng 25m 4 tầng mặt tiền 4.5m vỉa hè kinh doanh sầm uất nhỉnh 8 tỷ lh
Cập nhật: vài giây trước - 0
Bán nhà nguyễn trãi thanh xuân 72m 3 tầng ô tô đỗ cửa gần phố ở ngay chỉ 6 tỷ lh 0975124520
Cập nhật: vài giây trước - 3
Bán nhanh dãy nhà trọ 10 phòng, 95m2, hxh lê văn khương,
Cập nhật: vài giây trước - 2
Cần bán nhà 4 tầng tại vân canh, hoài đức., diện tích 40m2 4 tầng lô góc
Cập nhật: vài giây trước - 5
Bán nhà mặt tiền 2t, 298m2 đường nguyễn oanh, gò vấp, đang
Cập nhật: vài giây trước - 2
Gấp bán nhà riêng gần chợ linh trung, thủ đức, hxh,dt 64m2, 3 tầng, gía nhỉnh 4,5 tỷ
Cập nhật: vài giây trước - 2
Cần bán nhà mới xây 5 tầng 40m2 tại di trạch, hoài đức, nội thất đẹp thiết kế đầy đủ công năng
Cập nhật: vài giây trước - 4
Cần bán nhà 4 tầng tại trạm trôi, nhà đẹp mới xây, tiện ích
Cập nhật: vài giây trước - 4
Bán nhà tân bình hxh 2 hẻm ô tô sát mặt tiền nở hậu 3 tầng
Cập nhật: vài giây trước - 5
Bán nhà phú nhuận hxh 62m2 sát mặt tiền 4 tầng btct nguyễn
Cập nhật: vài giây trước - 2
Ngộp bank giảm 500tr bán gấp nhà linh xuân thủ đức 60m2, hxh, 3t bao đầu tư
Cập nhật: vài giây trước - 2
Bán nhà kha vạn cân, linh chiểu, thủ đức, 95m2, shr chỉ 4.2 tỷ_40tr.m2 ngay trung tâm tp
Cập nhật: vài giây trước - 2
Bán nhà riêng hiệp bình chánh dưới 7 tỷ, dt 90m2, 3t, xe tải tránh, chính chủ sang tên ngay
Cập nhật: vài giây trước - 2
Bán ccmn mỹ đình ô tô, dòng tiền 58 5t mt 4.5m giá 9.5 tỷ
Cập nhật: 1 phút trước - 2
Bán căn hộ dòng tiền mặt ngõ thông,ô tô , thang máy, 55m 8t nguyễn khánh toàn chỉ 12.5 tỷ q. cầu
Cập nhật: 1 phút trước - 2
Ngộp bank,bán gấp nhà riêng, hxh, linh xuân, td, 5x27m, 2 tầng thêm 5 phòng trọ vừa ở vừa cho thuê,
Cập nhật: 1 phút trước - 5
Bán nhà phú nhuận hxh 4 tầng btct 50m2 giáp phan xích long
Cập nhật: 1 phút trước - 5
Bán nhà tân bình hxh 100m2 sát mặt tiền sổ vuông dân trí
Cập nhật: 1 phút trước - 3
Bán nhà thành thái full nội thất, gần ô tô 45m x 5t, nhỉnh
Cập nhật: 1 phút trước - 2
Bán đất cc phân lô mặt ngõ thông, văn hội bắc từ liêm , ô tô vào đất 56m mt4m gia nhỉnh 5 tỷ
Cập nhật: 1 phút trước - 2
Giảm mạnh 1 tỷ, nhà mới, ở ngay, trường thọ, tđ, 80m, 3t, gía nhĩnh 5 tỷ, shr
Cập nhật: 1 phút trước - 5
Bán nhà phú nhuận sát hxh 45m2 2 tầng đẹp lung linh khu vip
Cập nhật: 1 phút trước - 2
Bán nhà riêng xuân la tây hồ 35m 6 tầng 3 ngủ full nội thất nhà đẹp ở ngay nhỉnh 5 tỷ lh 0817606560
Cập nhật: 1 phút trước - 5
Bán nhà bình thạnh hxh 50 m2 5 tầng ngang 4m 9 phòng ngủ lê
Cập nhật: 1 phút trước - 2
Bán nhà quan nhân nhân chính 42m 6 tầng lô góc mặt tiền 4m nhà đẹp ở ngay nhỉnh 7 tỷ lh 0975124520
Cập nhật: 1 phút trước - 5
Bán nhà bình thạnh 100 m2 mặt tiền vip kinh doanh sầm uất
Cập nhật: 1 phút trước - 4
2 tỷ 4 có ngay nhà tại thị trấn trạm trôi diện tích 40 m2 x
Cập nhật: 1 phút trước - 2
Bán nhà 5 tầng phố trung kiên vị trí siêu đẹp ngay ngã tư nhổn - gần trường học các cấp
Cập nhật: 1 phút trước - 1
Chưa đến 2 tỷ có ngay mảnh đát 50 m2 nằm sát khu đô thị hinode royal park, đường rộng ô tô vào tận
Cập nhật: 1 phút trước - 2
Bán nhà hxh phường an phú đông, quận 12, 75m2, 4t, tặng nt
Cập nhật: 1 phút trước - 2
Bán 110m2 đất 2mt hxh nở hậu đường phường thạnh xuân, quận
Cập nhật: 1 phút trước - 2
Nhà đẹp 4 tầng ngay sát ngã tư canh s; 40m2 mặt tiền 4m, giá chỉ 3 tỷ 9 sổ đỏ cất két sẵn sàng giao
Cập nhật: 1 phút trước - 4
Nhà đẹp tt. trạm trôi chủ tâm huyết xây kiên cố - nội thất
Cập nhật: 1 phút trước - 2
Bán nhà phố trung kiên - tây tựu, vị trí đẹp đường thoáng ô tô đỗ cửa giá chỉ 2 tỷ 7
Cập nhật: 1 phút trước - 5
Bán nhà phú nhuận hxh 52m2 ngang 4.3 3 phòng ngủ sát mặt
Cập nhật: 2 phút trước - 5
Bán nhà phú nhuận hxh 112m2 ngang 8m nhà đẹp khu vip phan
Cập nhật: 2 phút trước - 2
Bán nhà nguyễn an ninh. ngõ thông sát ô tô - kd. dt khủng 65m× 4 tầng. sđcc chỉ hơn 4 tỷ
Cập nhật: 2 phút trước - 2
Gia đình bán đất giá tốt- thạnh hòa# long an shr 2000m2.nhỉnh 2tỷ tl
Cập nhật: 2 phút trước - 2
Bán nhà gần kha vạn cân trường thọ thủ đức 26m2 shr chỉ nhỉnh 2 tỷ rẻ quá rẻ
Cập nhật: 2 phút trước - 2
Bán nhà gần chợ thủ đức trường thọ 26m2 shr chỉ nhỉnh 2 tỷ vào ở ngay
Cập nhật: 2 phút trước