Tạo thumbnail cho bài viết wordpress

     

Mình nhận thấy có tương đối nhiều bạn đặt câu hỏi về việc giảm số lượng, bớt dung lượng hình ảnh trên WordPress, đôi khi cũng hỏi giải pháp tắt tác dụng tạo ra các form size hình ảnh nhỏ nhằm đỡ tốn dung lượng hosting. Điều này còn có thật sự tốt? Hãy cùng mình mày mò nhé.

Bạn đang xem: Tạo thumbnail cho bài viết wordpress

Bài này nhiều năm lê thê như mọi bài viết trên blog này. Chúng ta cũng có thể kéo xuống cuối bài viết hoặc nhấp vào chỗ này để xem giải pháp cuối cùng.

Thumbnail là gì?

Thumbnail là một tập hợp các ảnh thu nhỏ từ hình ảnh gốc được cắt (crop) theo một kích cỡ (size) và tỉ lệ (ratio) được mức sử dụng sẵn. Thumbnail được sử dụng trong WordPress nhằm mục tiêu tạo ra các kích thước ảnh đại diện cân xứng cho những giao diện, và dễ dàng hơn nữa, là làm cho giảm kích thước website.

Nhờ vào câu hỏi tạo ảnh thumbnail khôn cùng tự do theo rất nhiều kích cỡ không giống nhau mở đường cho việc phát triển của tương đối nhiều giao diện tân tiến sau này, làm cho WordPress phát triển thành một sự lựa chọn hàng đầu khi bạn muốn xây dựng những website gồm nội dung phong phú.

WordPress sản xuất ra hình ảnh thumbnail theo cách nào?

Đầu tiên họ phải nói về phong thái WordPress tạo thành các kích thước thumbnail không giống nhau. Bọn họ còn 3 form size mặc định là thumb, medium và large. Trước lúc phiên bản WordPress 2.9 được vạc hành vào năm 2009, họ chỉ có duy độc nhất 3 kích thước mặc định này.

Phiên phiên bản WordPress 2.9 giới thiệu cùng cùng với function add_image_size() góp nhà phát triển theme hoàn toàn có thể yêu cầu WordPress tạo thành các kích cỡ hình hình ảnh khác ngoại trừ 3 kích cỡ mặc định nói trên, lộ diện hướng đi new cho rất nhiều website, đặc biệt là website tin tức.

Sau lúc chứng kiến tận mắt qua bài viết này, chúng ta cũng có thể xem tiếp bài viết lazyload mang đến WordPress để về tối ưu thêm vận tốc tải trang cùng giảm băng thông không cần thiết cho website của bạn.

Vấn đề tạo hình ảnh thumbnail của WordPress

Cũng bởi vì quá “dễ dãi” mà chức năng tạo hình ảnh thumbnail của WordPress lại làm người dùng phải thắc mắc, thậm chí lo ngại khi chỉ upload một bên cạnh đó đôi khi tất cả hơn 20 ảnh thumbnail được sinh sản ra. Sự thuận tiện này còn biểu hiện trong vấn đề WordPress ko xử lý phần lớn kích thước ảnh cũ sau thời điểm đổi sang hình ảnh mới, làm sự việc ngày càng nặng hơn.

Để cho thấy sự nghiêm trọng này, hãy cùng xem qua thống kê hình hình ảnh trên blog jdomain.vn, một blog bé dại chưa khi nào sử dụng hình ảnh đại diện cho bài xích viết. Tính tới thời khắc viết bài, blog jdomain.vn của chính mình có 48 hình hình ảnh trong thư viện của WordPress, nghe hết sức ít đúng không? Hãy cùng mình tính chi tiết hơn bằng phương pháp so sánh số lượng và size của ảnh gốc và hình ảnh thumbnail nhé.

Để tìm kiếm các hình ảnh thumbnail, mình áp dụng Regular Expression để lọc ra những tên file có chứa size hình ảnh, ví dụ như 150×150:

cd ./wp-content/uploads/; find . -exec du -a + | grep -E "./20.*<0-9>2,x<0-9>2,"Kết quả của câu lệnh như hình mặt dưới. Bạn cũng có thể thêm > ~/thumbnail.txt vào cuối câu lệnh để xuất ra report, cho vô Excel cùng report với khách hàng nếu cần.

*
Câu lệnh cho chúng ta thấy được danh sách ảnh thumbnail và kích thước của chúng.

Từ file Excel này chúng ta cũng có thể tính tổng dung tích của hình ảnh thumbnail và con số của ảnh thumbnail được chế tạo ra. Mặc dù nhiên, Linux gồm có công vậy rất bạo gan mẽ để cho ra kết quả bọn họ mong ước ao muốn:

# find . -exec du -a + | grep -E "./20.*<0-9>2,x<0-9>2," | awk "total+=$1 kết thúc print total/1000"32.62# find . -exec du -a + | grep -E "./20.*<0-9>2,x<0-9>2," | wc -l625Như vậy, dung lượng hình ảnh thumbnail là 32.62MB625 ảnh thumbnail, hoàn toàn đúng mực với kết quả trên Excel. Sau đó Tuấn cũng chạy lại câu lệnh với cùng 1 số đổi khác để chỉ lấy ảnh gốc cùng có công dụng như bảng bên dưới đây:

Tổng dung lượngSố lượng
Ảnh gốc6884 kilobytes100
Ảnh thumbnail32620 kilobytes (473%)625
Ảnh thumbnail sau khi loại trừ kích thướcmặc định(thumb, medium, large)24400 kilobytes (354%)357

Bạn rất có thể tìm file Excel những thống kê tại đây.

Nhìn vào bảng hoàn toàn có thể đưa ra một số kết luận chủ quan:

Chỉ là 1 theme đơn giản dễ dàng nhưng con số hình hình ảnh tăng sát 3.57 lần so với việc không chế tác ra ảnh thumbnail. Dung lượng hình ảnh cũng tăng 3.54 lần đối với chỉ có hình ảnh gốc.Trong lúc viết bài bác này, bản thân mới nhận ra mình cũng “quên” việc tắt các kích cỡ mặc định của WordPress đi và sau khi xóa, họ đã có một công dụng khả quan lại hơn.Việc tắt các kích cỡ không sử dụng đến có thể làm tụt dốc mạnh số lượng hình ảnh thumbnail được chế tác ra, tuy vậy không quá công dụng nếu xét đến dung lượng.

Cũng bởi vì lí vì chưng này, Tuấn thấy rất nhiều bạn hỏi xã hội WordPress về cách tắt hào kiệt tạo hình ảnh thumbnail này đi. Vậy hãy cùng tò mò những mặt lợi và hại khi chúng ta tắt tuấn kiệt này đi nhé.

Tại sao cần tắt ảnh thumbnail của WordPress?

Lí vày được các bạn đưa ra là nặng website. Mình gọi nghĩa nặng trĩu này như sau: nặng về dung lượng lưu trữ hoặc nặng trĩu về dung tích khi cài đặt trang.

Số lượng hình ảnh đó là vấn đề mà chúng ta đang áp dụng hosting phải quan tâm. Các nhà hỗ trợ hosting bây giờ luôn chỉ dẫn mức dung tích Unlimited (không giới hạn) để chúng ta thỏa sức lưu giữ trữ. Tuy nhiên, vật dụng mà các NCC ko nói đến chính là số lượng tập tin (inodes) mà bạn được quyền chứa.

*
Thông tin inodes có thể được xem ngay tại trang làm chủ cPanel.

Chẳng hạn, Hawkhost cho bạn không giới hạn dung lượng lưu trữ nhưng giới hạn con số tập tin là 500.000. Nghe thì nhiều đó cơ mà nếu tính ra mỗi bài viết có khoảng tầm 8 – 10 bức ảnh, mỗi bức ảnh được chia ra 6 kích cỡ nữa, tổng số là 7 bức. Bảy bức này vẫn x2 lên nếu như bạn sử dụng WebP như trang web của mình, chúng ta chỉ rất có thể lưu trữ 3500 – 4000 bức ảnh thôi.

Xem thêm: Cách Khắc Phục Lỗi Không Like Được Page Trên Facebook ? Tại Sao Không Thích Trang Facebook Được

Nên hay không việc tắt tạo hình ảnh thumbnail của WordPress?

Đây là vấn đề mà mình thích rất ao ước nói ngay từ đầu bài viết, nhưng mà phải lý giải khá các trước để các bạn tính toán với lựa chọn. Theo mình, câu trả lời cho vấn đề tắt kỹ năng tạo ảnh thumbnail cho WordPress là cùng KHÔNG.

Mình sẽ lựa chọn giả dụ website mình cực ít áp dụng hình ảnh, gần như không nên upload một hình hình ảnh nào cho bài viết. Đơn giản bởi thế thôi. Thiệt ra nếu như khách hàng không upload hình ảnh lên thì ko cần để ý đến việc mở tuyệt tắt có tác dụng gì.

Mình sẽ chắt lọc KHÔNG giả dụ website mình có sử dụng hình ảnh, kể cả lúc website không sử dụng ảnh đại diện (featured image) cho bài viết. Bởi sao vậy?

WordPress sử dụng hình ảnh thumbnail nhiều size cho thuộc tính srcset sẽ giúp đỡ trình phê chuẩn chỉ thiết lập đúng kích thước ảnh mà trình lưu ý cần, thay bởi vì tải một hình ảnh gốc cực nặng.

Thuộc tính srcset là một trong những thuộc tính chuẩn chỉnh của HTML5, được cung ứng trên không hề ít trình duyệt. Khả năng giúp cho những người dùng tải ảnh nhẹ hơn còn nếu không cần thiết, tương tự như tính năng cắt hình của WordPress.

Nếu độc giả blog của chính mình trên một màn hình hiển thị full HD, rất có cơ may ban đã tải hình ảnh ở form size 1400px chiều ngang thay vì chưng “phải” tải hình ảnh gốc như khi sử dụng màn hình retina hoặc độ sắc nét lớn hơn. Chúng ta có thể xem demo tại phía trên để biết mật độ pixel của màn hình hiển thị máy mình là từng nào nhé.

Vậy những hình ảnh nhỏ và thuộc tính srcset ở đâu mà ra? Vâng, chính từ chức năng cắt ảnh của WordPress cơ mà ra, với cũng chính WordPress tạo thành thuộc tính srcset này.

Vì vậy, việc tắt tác dụng tạo ảnh thumbnail của WordPress tương tự như bài toán bạn ép người dùng phải tải ảnh gốc bên trên website của bạn, đồng nghĩa tương quan với vấn đề tải trang chậm trễ hơn.

Cách tắt anh tài tạo hình ảnh thumbnail của WordPress

“Ơ, bản thân tưởng nội dung bài viết đã không còn rồi vì bạn khuyên KHÔNG yêu cầu tắt tuấn kiệt này?”. Yes, chính xác là như vậy, mặc dù nhiên, bạn vẫn rất có thể tắt các kích thước hình ảnh thừa mà bạn không lúc nào dùng tới. Điều này giúp cho bạn giảm inodes nếu như bạn sử dụng hosting và vứt bỏ các tác vụ vượt khi thiết lập hình ảnh lên.

Lưu ý: Việc sa thải 1 size hình hình ảnh chỉ áp dụng cho phần nhiều hình ảnh được sở hữu lên sau này. Bây giờ có hết sức ít plugin rất có thể thực hiện tại xóa gần như kích thước hình ảnh không thực hiện mà không gây ra lỗi.

Cách hiện tại đại

Ở đầy đủ theme tin tức thực hiện nhiều thumbnail như Newspaper, chúng ta có một trang tùy chọn để tắt đi được cất kĩ vào Theme panel > Block Settings > Thumbs on Modules/Blocks.

*
Nếu ko sử dụng những Block như bên phải, bạn cũng có thể tắt các kích thước hình ảnh này đi.

Cách truyền thống

Đối với hồ hết theme không tồn tại tính năng tắt tạo ảnh thumbnail (mà 99% theme trên thị phần đều không có), hãy sử dụng cách sau đây để sa thải bạn nhé.

Cách 1. Bạn có thể sử dụng plugin Stop Generating Image Sizes để tắt các kích thước ảnh không yêu cầu thiết. Cách áp dụng khá solo giản, bạn chỉ việc tick vào phần nhiều size ảnh bạn không thích được tạo ra nữa, vậy là xong. Chú ý cách này chỉ áp dụng cho các hình hình ảnh được tạo thành sau này.

*

Cách 2 dành cho những bạn không thích sử dụng plugin mặt ngoài. Bản thân chưa lúc nào khuyến khích bí quyết comment/xóa loại add_image_size trường đoản cú theme gốc mà rứa vào đó, hãy chèn đoạn code bên dưới vào tệp tin functions.php trong Child theme của bạn.

add_action("init", "remove_plugin_image_sizes");function remove_plugin_image_sizes() remove_image_size("size-name");Cả hai giải pháp trên phần đông yêu cầu các bạn biết được các kích thước hình ảnh không sử dụng, mặc dù nhiên, xin chia bi đát rằng không tồn tại cách nào tự động hóa để plugin giỏi code hoàn toàn có thể biết được. Bạn sẽ phải tự kiếm tìm kích thước ảnh thủ công.

Có một vài cách để biết được các form size đang được sử dụng, từ kia dùng phương thức loại trừ để hiểu rằng các size không được sử dụng: xem thương hiệu class của hình ảnh có chứa một class thương hiệu size-tên-size, nhờ vào đuôi của hình hình ảnh có chứa size hình.

*

Tuy vậy, mình thấy phương pháp kiểm tra class CSS là đơn giản và dễ dàng và đúng chuẩn hơn vì chưa phải lúc nào form size trên tên ảnh cũng phần đông giống nhau.

Kết luận

Chỉ một tính năng nho nhỏ, rất kì có ích của WordPress tuy nhiên lại khá trắc trở và đem về một chút thắc mắc, phiền toái cho người mới sử dụng.

Chính bởi vậy, đối với mình, mình vẫn KHÔNG tắt tính năng này đi không tính 3 kích cỡ có sẵn của WordPress. Theme yêu cầu gì mình cho tạo nên nấy, không giới hạn gì cho đau đầu. Còn chúng ta thì sao?


Chuyên mục: Domain Hosting