Hướng dẫn sử dụng Elementor – Thư viện Elements Kit

Khi sử dụng Plugin Elementor chắc hẳn các bạn đều biết đến thư viện Elements Kit – Thư viện giao diện mẫu đi kèm với Plugin Elementor.

Các bạn chỉ cần kích Hoạt Plugin Elements Kit sau đó vào phần tùy chọn và tiến hành import dữ liệu sẵn có.

Ở bài viết này mình sẽ hướng dẫn các bạn thao tác chỉnh sửa giao diện trong bộ thư viện mẫu này. Phần lớn Themes được xây dựng bằng Elememntor đều có cách chỉnh sửa giống nhau.

Sửa Header

Truy cập vào quản trị Website, chọn Xem trang để mở giao diện trang chủ. Ở tùy chọn Sửa với Elementor, chọn Header để bắt đầu chỉnh sửa phần Header.

Rê chuột và Nhấn trực tiếp vào phần cần sửa ( bên trong khung màu xanh ) hoặc icon cây bút chì để tùy chỉnh.

Sau khi hoàn tất chỉnh sửa bạn nhấn vào cập nhật để lưu lại kết quả đã chỉnh sửa

Điều quan trọng nhất bạn cần phải ghi nhớ ở phần này là: Muốn chỉnh sửa phần nào thì rê chuột và nhấn trực tiếp vào phần đó.

Sửa trang chủ.

Truy cập vào quản trị Website, chọn Xem trang để mở giao diện trang chủ. Ở tùy chọn Sửa với Elementor để bắt đầu chỉnh sửa phần trang chủ.

Slider

Trong phần Slide có 3 phần để chỉnh sửa: Nội dung, Kiểu, Nâng cao.

Nội dung

Trong phần nội dung ta có thể chỉnh sửa chiều cao Slide, Background, thời gian chạy Slide … Quan trọng nhất là phần Images Slide để thay ảnh của Slide.

General

Height Slider, Height Slider Tablet, Height Slider Mobile thứ tự chỉnh sửa lần lượt là chiều cao Slider giao diện máy tính, máy tính bảng và giao diện moblie.

Background Effect, Background Size, Background Position thứ tự chỉnh sửa lần lượt là hiệu ứng nền, kích thước nền và vị trí nền. Để rõ hơn tác dụng của 3 tùy chọn này bạn hãy thử thao tác trực tiếp.

Infinite Loop: On slide chạy lặp lại, Off Slide không lặp lại, bình thường tùy chọn này thì bạn nên để On(lặp lại).

Duration (ms) : Thời gian lặp lại Slide.

Content Area Into Grid?: Sắp xếp nội dụng theo định dạng có sẵn.

Content Area Container Width: Chiều rộng của nội dung so với Slide.

Images Slide: Thay đổi hình ảnh.

Chọn mục: Thêm  một Slide mới(Duplicate), thường thì chúng ta thường nhân đôi 1 Slide có sẵn rồi sau đó chỉnh sửa sẽ nhanh hơn.

Arrow Setting

Tùy chọn chỉnh sửa nút chuyển Slide.

Bullets Setting

Tùy chọn chỉnh sửa khối đếm Slide.

Kiểu

Alignment canh lề nội dung Slide.
Color màu sách nội dung Slide.
Typography chỉnh font chữ cho Slide
Spacing khoảng cách nội dung Slide

Nâng cao

Phần này là tùy chọn chỉnh sử hiệu ứng Slide, thường thì phần này bạn nên để mặc định.

Sau khi hoàn tất chỉnh sửa bạn nhấn vào cập nhật để lưu lại kết quả đã chỉnh sửa.

Nội dung chính

Phần lớn nội dung trang chủ có cấu trúc giống nhau và đều có thể chỉnh sửa trực tiếp, gọi chung là Section trong bên trong là nội dung Section. Bạn muốn sửa Section nào cứ rê chuột trực tiếp vào Section.

Sau khi đã nhấn chuột vào icon màu xanh màn hình sẽ mở tab layout, ở đây các bạn có thể tùy chỉnh chiều rộng của Section, đường viền… và các tùy chọn nâng cao, các bạn có thể tự thực hiện thêm.

Để chỉnh sửa nội dung bên trong Section ta cũng rê chuột và nhấn vào icon hình cây bút chì.

Sau khi hoàn tất chỉnh sửa bạn nhấn vào cập nhật để lưu lại kết quả đã chỉnh sửa

Điều quan trọng nhất bạn cần phải ghi nhớ ở phần này là: Muốn chỉnh sửa phần nào thì rê chuột và nhấn trực tiếp vào phần đó.

Form liên hệ

Form liên hệ là phần khách truy cập sẽ nhập vào thông tin cá nhân và gửi cho người quản trị Website. Để chỉnh sửa Form liên hệ bạn nhấn trực tiếp vào nó. vào chọn Edit Form. Sau khi chỉnh sửa bạn nhấn close & update để cập nhật.

Sửa Footer

Truy cập vào quản trị Website, chọn Xem trang để mở giao diện trang chủ. Ở tùy chọn Sửa với Elementor, chọn Footer để bắt đầu chỉnh sửa phần Footer.

Rê chuột và Nhấn trực tiếp vào phần cần sửa ( bên trong khung màu xanh ) hoặc icon cây bút chì để tùy chỉnh.

Sau khi hoàn tất chỉnh sửa bạn nhấn vào cập nhật để lưu lại kết quả đã chỉnh sửa

Điều quan trọng nhất bạn cần phải ghi nhớ ở phần này là: Muốn chỉnh sửa phần nào thì rê chuột và nhấn trực tiếp vào phần đó.

Kết luận

Đây là bài viết hướng dẫn chỉnh sửa chi tiết 1 trong những giao diện của kho giao diện Mắt Bão. Ở những giao diện sử dụng Plugin Elementor để xây dựng giao diện, các bạn cũng có thể áp dụng theo thao tác trong bài viết này.