Hỏi các bác về giảm kích cỡ ảnh trong Wordpress

Các bác tư vấn giúp mình trường hợp này nhé.
Trang của mình là

Mã:

standavietnam.net

Khi mình check ở các công cụ thì đều báo kich cỡ ảnh quá lớn. Trong khi ảnh sản phẩm mình up lên host luôn để 600*600
Vậy mà GTmetrix luôn đề xuất nên để loanh quanh ở 150*150. Vậy có nghĩa là mình phải thay đổi kích cỡ của ảnh thumbnail đúng không?
Mình phải làm như thế nào nhỉ?
Cảm ơn các bác đã đọc bài!!

 

Sử dụng Regenerate Thumbnails khi người dùng ở độ phân giải nào thì nó sẽ lấy ảnh phù hợp
Điểm mạnh : tốt cho người dùng. ( load nhanh hơn )
Điểm yếu: nó tạo ra nhiều ảnh với các size khác nhau. ( tốn tài nguyên )

 

nên cắt ảnh theo kích thước chuẩn. nén lại trước khi up lên host

 

Cứ cắt bằng Photoshop trước rồi đưa lên.
Khi thiết kế cố gắng tự làm ra một chuẩn ảnh của trang web đó. Ví dụ ảnh Slider, ảnh bài viết trang chủ bao nhiêu rồi cứ thế mà cắt bằng Photoshop.

 

wp quản lý ảnh hơi kém. mình thấy một số nền tảng ảnh up lên thì thoải mái, nhưng nó sẽ tạo ra 1 thư mục cache để chứa các ảnh theo tỉ lệ phù hợp. như vậy quản lý cũng dễ mà cũng tối ưu dung lượng host

 

Em vừa cài nhưng thấy Gtmetrix vẫn báo vậy bác ạ..

Em đều cắt bằng PTS, 600*600, nén lại rồi. Vấn đề là nó báo kích thước cơ bác.

Thế đó bác... Bạn e làm web dịch vụ bên Bizweb thấy nó up hẳn ảnh 3mb , kích thước >3000 mà ngon lành ko sao hết...

 

Ảnh đại diện sản phẩm của chú kích thước chỉ hiển thị 165x165 nhưng chú lại lôi ảnh gốc ra hiển thị như vậy là chưa tối ưu:

Để tối ưu phần này chú phải chỉnh code của web, lôi thumbnail ra thôi chứ không lôi ảnh gốc ra làm gì cả.

 

Ôi, đúng là thứ e cần đây rồi. Qúa chuẩn luôn. E thì mù mờ về code, bác nói thêm giúp e đc ko???
@chienlentnd bạn ơi vấn đề đây này

 

Trong Wordpress mặc định chỉ có 3 loại ảnh (xem ở wp-admin/options-media.php):


Khi chú upload 1 file ảnh lên thì bên cạnh việc lưu trữ ảnh gốc ra, Wordpress sẽ tự tạo ra 3 phiên bản ảnh khác của ảnh gốc với kích thước như trong phần cấu hình ở đây:

Ví dụ ảnh gốc tên là anh-goc.jpg (1600x900) thì nó sẽ tạo ra 3 phiên bản khác là: anh-goc-150x150.jpg, anh-goc-300x300.jpg, anh-goc-1024x1024.jpg nằm trong cùng thư mục với anh-goc.jpg

Chú có thể chỉnh size tùy ý trong phần Settings => Media (wp-admin/options-media.php) sau đó save lại, rồi cài plugin Regenerate Thumbnails để thiết lập lại đống ảnh đã up lên web theo kích thước mới)

Tuy nhiên vì chú dùng Woocommerce nên phải chỉnh kích thước ảnh sản phẩm ở đây: Woocommerce => Settings, chuyển qua tab Products (sản phẩm), phía dưới có phần Display (Hiển thị).



Bình thường các lập trình viên khi code ra 1 theme (giao diện) mới cho Wordpress thì những ảnh đại diện sẽ lấy ảnh thumbnail ra hiển thị, cấu trúc code:

Mã:

get_the_post_thumbnail( $post_id, 'thumbnail' );      // Lấy ra ảnh Thumbnail (là ảnh 150x150 ở ví dụ trên)
get_the_post_thumbnail( $post_id, 'medium' );         // Lấy ra ảnh Medium (là ảnh 300x300)
get_the_post_thumbnail( $post_id, 'large' );          // Lấy ra ảnh Large (là ảnh 1024x1024)
get_the_post_thumbnail( $post_id, 'full' );           // Lấy ra ảnh gốc
get_the_post_thumbnail( $post_id, array( 100, 100) ); // Lấy ra ảnh tùy chỉnh, ở ví dụ này là 100x100 

Muốn lấy ra ảnh loại nào thì dùng code tương ứng nhé. Nếu chú không biết code thì thật khó để hướng dẫn chi tiết hơn. Ngoài ra còn tùy vào Theme và các Plugins mà chú sử dụng, đôi khi những thiết lập này được các nhà phát triển tạo sẵn trong phần cấu hình cho từng Theme hoặc Plugin.

 

Cảm ơn bác cực cực kì nhiều vì những hướng dẫn quá chi tiết này! E ko rành code, e sẽ mày mò thêm vậy.
Chúc bác ngày mới tốt lành.
E xin cảm ơn 1 lần nữa