Tạo hiệu ứng Before And After cho hình ảnh trong WordPress

Tạo hiệu ứng Before And After cho hình ảnh trong WordPress

Nếu bạn thường xuyên đọc báo hoặc tạp chí thì chắc hẵn đã từng bắt gặp những hình ảnh có hiệu ứng Before And After. Đây là một hiệu ứng rất trực quan để so sánh sự khác nhau giữa hai bức ảnh.

Trong WordPress, chúng ta có thể thêm hiệu ứng Before And After rất dễ dàng vào các hình ảnh của bài viết. Để làm được việc này trước tiên bạn cần cài đặt plugin Twenty20 Image Before-After.

Xem thêm:

Thêm hiệu ứng Before And After

Sau khi active plugin Twenty20 Image Before-After thì bạn đã có thể sử dụng nó ngay sau đó. Khi này, trình soạn thảo bài viết sẽ có thêm 2 nút nhấn là:  Add Twenty20 và Help T20.

Twenty20 button

Để thêm hiệu ứng Before And After bạn nhấn vào nút Add Twenty20 sẽ có một popup hiện lên để lựa chọn 2 hình ảnh mong muốn. Sau khi chọn xong, bạn nhấn vào nút Insert.

Chọn hình ảnh cho hiệu ứng Before After

Sau đó, một popup khác hiện lên để bạn thiết lập các thông số như sau:

  • Width: chiều rộng của hình ảnh theo % và pixel.
  • Offset: Vị trí ban đầu của thanh slider.
  • Direction: Hướng của thanh slider (vertical: chiều dọc, horizontal: chiều ngang).
  • Alignment: Canh trái hoặc phải.

Sau khi thiết lập xong bạn nhấn vào Insert Shortcode. Như vậy bạn đã thêm thành công hiệu ứng Before And After vào hình ảnh của bài viết WordPress.

Kết quả giống như hình bên dưới:

Hiệu ứng Before After

Ngoài ra, bạn có thể tham khảo thêm một số plugin có chức năng tương tự như:

Từ nay bạn có thể thêm hiệu ứng này vào bất cứ bài viết nào để tăng độ trực quan. Đặc biệt với các hình ảnh dạng như: trước và sau khi photoshop, trước và sau khi nén ảnh, trước và sau khi nâng mũi,..là vô cùng phù hợp.

Chúc bạn thành công!

Tạo hiệu ứng Before And After cho hình ảnh trong WordPress
2.5 (2 votes)

Để lại một bình luận

2 Bình luận trên "Tạo hiệu ứng Before And After cho hình ảnh trong WordPress"

avatar
700
HAI NAM
Khách

bữa nay toàn bài viết chủ đề ăn chơi nhỉ 😀

Đăng kí BẢN TIN

Đăng kí BẢN TIN

Đăng kí bản tin to cập nhật bài viết nhanh nhất and receive the following phần quà hấp dẫn từ Nam Ngô Blog.

Bạn đã đăng kí thành công!