Google đứng đầu chuỗi thức ăn trên Internet. Xã hội ảnh hưởng (hoặc ra lệnh) rất nhiều điều xảy ra trực tuyến. Và định dạng hình ảnh mới của họ, WebP, tiếp tục xu hướng này. Với tốc độ tải trang ngày càng trở nên quan trọng (chủ yếu là do Xếp hạng Trang của Google), các nhà phát triển và nhà thiết kế xem nén hình ảnh là cách dễ nhất để giảm thời gian tải. Hình ảnh Google WebP nhỏ hơn khoảng 30% so với hình ảnh JPG hoặc PNG thông thường và duy trì chất lượng tương đương. Hơn hết, bạn không phải lo lắng về việc chuyển đổi hình ảnh của mình sang WebP theo cách thủ công.

Trong bài viết này, chúng tôi sẽ hướng dẫn bạn cách sử dụng định dạng hình ảnh mới này với WordPress, mặc dù nó chưa được hỗ trợ theo mặc định.

Sử dụng Optimole để phục vụ các tệp WebP trên WordPress

WebP, như một định dạng hình ảnh, không được hỗ trợ theo mặc định trong WordPress. Bạn có thể tải lên hình ảnh .webp, nhưng với tệp SVG, bạn có thể nhận được thông báo lỗi. Và một lần nữa, đối với việc sử dụng Các tệp SVG với WordPress , có một cách giải quyết đơn giản thông qua trình cắm thêm.

Giải pháp hình ảnh Wordpress

Trong số các dịch vụ WebP được thử nghiệm, Optimole nổi bật giữa đám đông. Nó thực sự có thể hoạt động với cấu hình tối thiểu. Do đó, chúng tôi muốn giải thích cho bạn cách cấu hình nó và làm cho cài đặt WordPress của bạn tương thích với định dạng WebP dễ dàng nhất có thể.

Đầu tiên, bạn rõ ràng sẽ muốn tải về và cài đặt plugin . Nó nằm trên thư mục WP.org và hoàn toàn miễn phí. Kể từ khi dịch vụ dựa trên API bật nó lên (cho đến một thời điểm). Mặc dù có thể chuyển đổi hình ảnh truyền thống sang WebP nhanh chóng bằng PHP, nhưng không phải tất cả các máy chủ web đều cấp quyền này cho máy chủ của bạn. Nếu bạn có quyền này, bạn cũng có thể xem plugin WebP ExpressBạn có nhiều quyền kiểm soát với điều đó , nhưng nó là một hệ thống đòi hỏi cấu hình cao hơn để có thể chạy trơn tru.

Sau khi Optimole được cài đặt và kích hoạt trên Website WordPress, bạn sẽ tìm thấy một tùy chọn menu mới trên Phương tiện - Optimole .

Khóa API tối ưu của bạn

Ghi âm tối ưu

Trước khi có thể truy cập cài đặt hoặc cấu hình, bạn phải có tài khoản Optimole. Nếu bạn đã định cấu hình một, bạn có thể nhấp vào nút Tôi đã có khóa API . Nếu không, lưu và gửi khóa API qua email . Tài khoản khóa API cơ bản là miễn phí và bạn nhận được khoảng 5 lượt truy cập ở cấp độ này. Nếu bạn cần nhiều hơn thế, có sẵn các mức giá.

Định giá giá cả

Optimole định nghĩa một chuyến thăm là " bất cứ ai ghé thăm của bạn nếu bạn một lần [. . .] Mỗi người dùng chỉ được tính một lần. Không quan trọng họ làm gì trên trang web của bạn, họ tải xuống bao nhiêu hình ảnh hoặc họ truy cập bao nhiêu trang; nó chỉ là một người dùng. Nếu họ rời khỏi trang web của bạn và quay lại cùng ngày, họ vẫn chỉ là một người dùng. "

Khi số lượt truy cập đã đo hết, chỉ hình ảnh WebP ngừng phân phát. Bản thân hình ảnh của bạn thì không. Bạn sẽ tìm thấy khóa API trong bảng điều khiển Optimole của mình ở trên cùng.

phím api optimole wordpress

Chỉ cần dán nó vào bảng điều khiển WordPress của bạn và bạn sẽ sẵn sàng bắt đầu truyền bá hình ảnh WebP với WordPress.

Dán khóa vào trang web

Bảng điều khiển Optimole WordPress của bạn

Trong bảng điều khiển WordPress của bạn, bạn nhận được thông tin cơ bản về tối ưu hóa WebP của mình. Điều này cho phép bạn khắc phục sự cố và đánh giá mức độ thành công của việc tăng tốc này. Bằng cách này, bạn có thể thay đổi các cài đặt khác nhau.

Bảng điều khiển Optimole

Đầu tiên, bạn thấy tài khoản được liên kết với API, sau đó ở cuối màn hình, plugin hiển thị các hình ảnh được tối ưu hóa mới nhất. Bạn có thể thấy hình ảnh WebP được phân phát nhỏ hơn bao nhiêu so với hình ảnh ban đầu bạn đã tải lên WordPress.

Sau đó, có tab khó khăn có thể được trên đầu trang. Không ai thích xem tab được đánh dấu, nhưng tất cả chúng ta cũng cần xem những xung đột nào có thể phát sinh.

Lỗi bảng điều khiển Optimole

Vấn đề chính mà chúng tôi gặp phải là với các plugin phân phối và nén hình ảnh khác. Như bạn có thể thấy trong hình trên, plugin Jetpack hoạt động tương tự như Optimole thông qua APoton , nên họ có thể va đầu vào. Đối với chúng tôi, điều này thể hiện ở chỗ không có hình ảnh nào được truyền tới khách thăm quan. Chúng tôi chưa gặp bất kỳ sự cố nào với các dịch vụ nén khác như TinyPNG hoặc Smush.

Sử dụng bảng điều khiển

Nếu bạn muốn biết thêm thông tin chi tiết về cách trang web của bạn hoạt động với WebP, Bảng điều khiển bên ngoài Optimole chứa thông tin này cho bạn.

Sử dụng bảng điều khiển optimole 1

Thay vì chỉ nhỏ hơn 9,5 lần, bạn có thể thấy kích thước thực của các tệp đang được phân phát. Cũng như các tệp trong khoảng thời gian 30 ngày.

Báo cáo trang tổng quan Optimole 1

Bạn cũng có thể đặt hình mờ trong bảng điều khiển Optimole (hoặc WP) để bất kỳ ai nhận được WebP từ trang WordPress của bạn sẽ tự động nhận được logo blazon của bạn. Đó là một quá trình đơn giản và bạn có thể kiểm soát độ mờ, vị trí và hơn thế nữa.

Điều chỉnh plugin Optimole

Về cơ bản, bạn có thể làm như vậy từ cả hai trang tổng quan. Dưới tab Tham số của WordPress hoặc bằng cách truy cập bảng điều khiển bên ngoài Optimole. Tất cả phụ thuộc vào những gì bạn cảm thấy thoải mái nhất, cũng như mức độ données những gì bạn cần tại bất kỳ thời điểm nào.

Ngoài ra, bạn sẽ có thể kiểm soát mức độ nén, tải chậm và khi / nếu một số hình ảnh nhất định được phát trực tuyến dưới dạng WebP dựa trên tên tệp. Bạn sẽ tìm thấy tất cả những điều này trong tab Tham số de Phương tiện - Optimole .

Plugin Lazyload wordpress

gói

Phần tốt nhất khi sử dụng WebP với các trang web WordPress là bạn không phải làm việc với các tệp theo cách thủ công. Không có tải thêm, không có thêm thời gian nén, không có gì. Do cách hoạt động của các API, tất cả các quy trình và tính toán được thực hiện nhanh chóng trong thời gian thực. Google đã thực sự làm cho Internet nhanh hơn bằng cách sử dụng WebP thay vì JPG hoặc PNG. Tuy nhiên, ưu điểm chính là hình ảnh vẫn giữ nguyên chất lượng, ngay cả khi kích thước của chúng bị giảm đáng kể. Bạn có thể thấy thú vị khi Google buộc bạn sử dụng định dạng của họ để tăng tốc trang web của bạn để nó có thể xếp hạng bạn cao hơn và trải nghiệm người dùng cuối cũng tốt hơn. Và đó là điều quan trọng cuối cùng.