Tối ưu hóa hình ảnh cho plugin Elementor của WordPress

Khái niệm về các khối mô-đun tạo nên bài viết và trang trong WordPress xuất hiện cùng với Gutenberg, nhưng thực tế, bản thân WordPress đã có cấu trúc mô-đun. Ví dụ, hãy xem Thư viện phương tiện của WordPress. Bạn có thể tải lên hình ảnh và sử dụng chúng trong bài viết hoặc trang, bất kể bạn đang sử dụng trình soạn thảo nào. Trong bài viết này, chúng ta sẽ tập trung cụ thể vào Elementor và cách bạn có thể tối ưu hóa hình ảnh bằng ImageRecycle.

Giống như Gutenberg, Elementor là một trình soạn thảo WordPress cho phép bạn tạo bài viết hoặc trang và xem trước giao diện chúng sẽ trông như thế nào đối với người đọc. Cấu trúc của Elementor cũng tương tự như Gutenberg vì nó sử dụng khái niệm khối (block) quen thuộc. Điều đó giúp việc sử dụng Thư viện đa phương tiện của WordPress trở nên dễ dàng hơn, bao gồm cả việc thêm hình ảnh đã được tối ưu hóa. Nhưng trước hết, làm thế nào để tối ưu hóa hình ảnh trên WordPress?

Tối ưu hóa hình ảnh với ImageRecycle

Nếu bạn chưa từng sử dụng ImageRecycle , việc tối ưu hóa hình ảnh WordPress là một quá trình nhanh chóng và dễ dàng. Trước tiên, bạn cần tải xuống và cài đặt ImageRecycle trên trang web WordPress của mình. Sau khi cài đặt plugin, hãy vào phần cấu hình trong cài đặt và nhập Khóa API và Mã bí mật của bạn. Lưu các thay đổi và nếu khóa và mã bí mật trùng khớp, bạn có thể bắt đầu tối ưu hóa hình ảnh ngay lập tức.

Bạn có thể truy cập giao diện chính ImageRecycle từ phương tiện . Trang này đơn giản và khá dễ sử dụng. Nó liệt kê tất cả các hình ảnh trong thư viện phương tiện của bạn, cùng với kích thước và tỷ lệ nén của chúng. Bạn có thể nhấp vào "Tối ưu hóa" bên cạnh từng hình ảnh để nén chúng, hoặc nhấp vào "Tối ưu hóa tất cả" để tối ưu hóa tất cả các hình ảnh cùng một lúc.

Rất nhiều thứ xảy ra trong quá trình nén phụ thuộc vào ImageRecycle . Ví dụ, bạn có thể chọn sử dụng chế độ nén chất lượng tốt nhất hoặc chất lượng gốc, có thể nén hình ảnh lần lượt lên đến 80% và 20%. Bạn có thể tìm hiểu thêm về sự khác biệt giữa hai chế độ này tại đây .

Dù bạn chọn chế độ tối ưu hóa nào, những hình ảnh này đều được lưu trong Thư viện phương tiện của WordPress, có nghĩa là bạn có thể sử dụng chúng trong bài viết và trang của mình… bất kể bạn đang sử dụng trình soạn thảo nào. Trong phần còn lại của bài viết này, chúng ta sẽ tập trung vào một trình soạn thảo cụ thể: Elementor.

Sử dụng hình ảnh được tối ưu hóa trong Elementor

Elementor là một trình soạn thảo mạnh mẽ dành cho bài viết và trang WordPress. Giống như Gutenberg, nó sắp xếp nội dung thành các khối, mỗi khối đại diện cho một yếu tố khác nhau. Như bạn đã biết, không có trang web nào thực sự hoàn chỉnh nếu thiếu hình ảnh và Elementor không thiếu các khối hình ảnh. Đây là nơi Thư viện Phương tiện phát huy tác dụng.

Chúng ta bắt đầu bài viết bằng cách giải thích rằng bản thân WordPress khá có tính mô-đun, và đây là nơi mọi thứ liên kết với nhau. Elementor sẽ lấy hình ảnh từ đâu nếu không phải từ Thư viện đa phương tiện? Tức là, chính Thư viện đa phương tiện của WordPress mà bạn vừa tối ưu hóa bằng ImageRecycle.

Việc sử dụng ảnh nén của ImageRecycletrong Elementor rất đơn giản, chỉ cần kéo và thả bất kỳ khối ảnh nào—cho dù đó là ảnh cơ bản, ảnh băng chuyền, thư viện ảnh hay bất cứ thứ gì khác—và tải ảnh lên. Bạn chọn ảnh trực tiếp từ Thư viện phương tiện của WordPress, thư viện này sẽ tự động tải các ảnh nén.

Về cơ bản, WordPress có cấu trúc mô-đun và sẽ thật lãng phí nếu không tận dụng điều đó. ImageRecycle tích hợp với bất kỳ trình soạn thảo nào bạn sử dụng mà không ảnh hưởng đến quy trình làm việc của bạn. Tất cả những gì bạn cần làm là tối ưu hóa hình ảnh và chèn chúng vào blog của mình sau đó, cho phép bạn tối ưu hóa trải nghiệm của người đọc WordPress, bất kể bạn sử dụng trình soạn thảo nào.