Tạo hiệu ứng chuỗi hình ảnh với Elementor Magic Scroll
Trước khi chúng ta đi vào bài viết này, nếu bạn đang thắc mắc điều gì là Elementor Magic Scroll Addon? thì hãy ghé thăm bài viết tài liệu này của Elementor Magic Scroll Global addon để tìm hiểu thêm về tính năng mới này và các tùy chọn có trong đó.
Trong hướng dẫn này, chúng tôi sẽ hướng dẫn cách sử dụng hiệu ứng cuộn Chuỗi hình ảnh từ Elementor Magic Scroll Addon để thiết lập một nhóm hình ảnh theo trình tự và chuyển đổi giữa chúng trong khi cuộn tạo ra hình ảnh chuyển động.
Tạo hoạt ảnh cuộn chuỗi hình ảnh trong Elementor.
1- Thiết lập chuỗi hình ảnh
Trong ví dụ của chúng tôi, chúng tôi sẽ chuyển đổi video thành một nhóm hình ảnh. Có rất nhiều công cụ có thể giúp bạn chuyển đổi khung hình video của mình thành một tập hợp hình ảnh nhưng trong hướng dẫn của chúng tôi, chúng tôi sẽ sử dụng công cụ đơn giản này EZGIF.COM. Các bước dưới đây cho thấy quá trình đã được thực hiện để chuẩn bị sẵn các khung hình.
- Đi đến EZGIF.COM.
- Điều hướng đến tab “Video sang GIF”.
- Điều hướng đến tab phụ “Video sang JPG”.
- Nhấp vào “Chọn tệp” từ “Chọn video từ máy tính của bạn” để tải video của bạn lên hoặc bạn có thể sử dụng tùy chọn “dán URL video”.
- Nhấp vào “Tải video lên!” cái nút.
- Bạn sẽ được chuyển hướng đến một trang mới. Từ trang này, bạn có thể đặt các tùy chọn này
- Thời gian bắt đầu (giây): Đặt thời gian của hình ảnh đầu tiên, chúng tôi đặt nó thành ” 0 ” trong ví dụ của chúng tôi.
- Thời gian kết thúc (giây): Đặt thời gian của hình ảnh cuối cùng, chúng tôi đặt nó thành ” 6 ” trong ví dụ của chúng tôi.
- Kích cỡ: Chọn Kích thước Hình ảnh, chúng tôi đã chọn “Bản gốc” trong ví dụ của mình.
- Tốc độ khung hình (FPS): Chọn số lượng khung hình mỗi giây sẽ được tạo, chúng tôi đã chọn “10” khung hình mỗi giây. Điều này có nghĩa là video của chúng ta sẽ được chuyển đổi thành 60 hình ảnh.
- Nhấp vào “Chuyển đổi sang JPG!” nút.
- Cuộn xuống và bạn sẽ tìm thấy các hình ảnh JPG đầu ra được liệt kê bên dưới nhau.
- Nhấp vào “Tải xuống khung dưới dạng ZIP”.
Bây giờ hãy giải nén tập tin này vào bất kỳ thư mục nào bạn thích.
2- Sử dụng tiện ích hình ảnh Elementor
Truy cập trang web của bạn và từ trình chỉnh sửa Elementor, kéo tiện ích Hình ảnh và thả nó vào phần bạn muốn.
Từ Chọn Hình ảnh, đặt hình ảnh khung đầu tiên trong chuỗi.
3- Tạo chuỗi ảnh động bằng Elementor Magic Scroll
Điều hướng đến tab Nâng cao của tiện ích, cuộn xuống cho đến khi bạn thấy Premium Magic Scroll, bật nó lên, sau đó nhấp vào “Thêm vật phẩm”. Từ mục lặp lại xuất hiện, bạn chọn Chuỗi hình ảnh từ danh sách thả xuống Chọn Hoạt ảnh.
Từ cài đặt Mục lặp lại, điều hướng đến Chọn hình ảnh và chèn các khung hình ảnh đã giải nén sẽ được hiển thị theo trình tự trong khi cuộn trang nhưng hãy đảm bảo bạn tải chúng lên theo thứ tự.
Cài đặt chung của Elementor Magic Scroll Addon
- Hoạt hình này nên hoạt động như thế nào?: Chúng tôi đã sử dụng “Khóa trang cuộn cho đến khi hoạt ảnh kết thúc” vì chúng tôi muốn Giá trị phần trăm của thanh tiến trình đạt đến cuối trước khi chuyển sang phần Elementor tiếp theo. Kiểm tra Tài liệu Elementor Magic Scroll để tìm hiểu thêm về các tùy chọn khác được liệt kê trong “Hoạt hình này nên hoạt động như thế nào?” và chúng thực sự hoạt động như thế nào.
- Thứ tự hoạt hình: Đặt thứ tự hoạt ảnh của phần tử Elementor hiện tại. Hoạt ảnh có Thứ tự được đặt thành 1 sẽ bắt đầu trước, sau đó là hoạt ảnh có Thứ tự hoạt ảnh 2, v.v.
- Giảm tốc độ hoạt ảnh theo: Từ đây, bạn có thể điều chỉnh tốc độ hoạt động/hoạt động của hoạt ảnh nhanh hay chậm. Trong ví dụ của chúng tôi, chúng tôi giữ nó ở mức “5”.
Bạn đã thực hiện nó!
Giờ đây, bạn có thể tạo Hiệu ứng hoạt hình chuỗi hình ảnh Elementor của riêng mình cho trang web Elementor của mình. Chúng tôi rất mong được xem những gì bạn sẽ nghĩ ra và chúng tôi khuyến khích bạn đăng tác phẩm của mình lên Nhóm Facebook của chúng tôi và truyền cảm hứng cho các nhà thiết kế khác.
Bài viết gần đây
Sản phẩm nổi bật
- Microthemer v7.3.2.3 – WordPress Visual CSS Editor 99.000 ₫
- Axtra v2.6 – Digital Agency Creative Portfolio Theme 120.000 ₫
- StreamVid v6.0.6 – Streaming Video WordPress Theme 99.000 ₫
- Streamit WP v3.4.8 – Video Streaming WordPress Theme + RTL 99.000 ₫
- QSM Advanced Assessment v1.2.3 99.000 ₫
- FluentCommunity Pro v1.1.0 99.000 ₫
- Organio v1.5.9 – Organic Food Store WordPress 99.000 ₫
- HiStudy v2.8.2 – Education WordPress Theme 120.000 ₫