Tháng trước, đã có một lỗ hổng lớn được phát hiện trong một kịch bản thay đổi kích thước hình ảnh nổi tiếng gọi là TimThumb. Kể từ đó cộng đồng đã hợp tác và cố định các vấn đề. Trong khi TimThumb là một lựa chọn khả thi, chúng tôi tin rằng các nhà phát triển chủ đề WordPress nên tập trung vào việc sử dụng các chức năng cốt lõi hơn là dựa vào kịch bản của bên thứ ba. Trong bài này chúng tôi sẽ chỉ cho bạn cách thêm các kích thước hình ảnh bổ sung trong WordPress.
WordPress có một tính năng tích hợp sẵn được đăng Hình thu nhỏ và Các hình ảnh nổi bật. Ngoài ra còn có một chức năng built-in add_image_size () cho phép bạn chỉ định kích thước hình ảnh và cung cấp cho bạn tùy chọn để cắt. Sử dụng các chức năng cốt lõi này trong chủ đề của bạn về cơ bản có thể loại bỏ sự cần thiết của một tập lệnh bên thứ ba như TimThumb trong hầu hết các trường hợp.
Đăng ký kích cỡ ảnh bổ sung cho chủ đề của bạn
Bạn sẽ cần phải bắt đầu bằng cách thêm sự hỗ trợ của hình thu nhỏ của bài đăng bằng cách đặt đoạn mã sau vào tệp tin functions.php của chủ đề:
add_theme_support ('post-thumbnails');
Khi bạn bật hỗ trợ cho hình thu nhỏ của bài đăng, bây giờ bạn có thể sử dụng chức năng đăng ký kích thước hình ảnh bổ sung với chức năng add_image_size (). Việc sử dụng các add_image_size chức năng là như thế này: add_image_size (‘tên của kích thước’, chiều rộng, chiều cao, chế độ cây trồng);
Ví dụ mã có thể như sau:
add_image_size ('sidebar-thumb', 120, 120, true); // Chế độ Cứng
add_image_size ('trang chủ-ngón tay cái', 220, 180); // Chế độ Cắt Nhẹ
add_image_size ('singlepost-thumb', 590, 9999); // Chế độ Chiều cao không giới hạn
Bây giờ, nếu bạn nhận thấy, chúng tôi đã chỉ định ba loại kích thước hình ảnh khác nhau. Mỗi loại có các chế độ khác nhau như cắt cứng, cắt nhỏ, và chiều cao không giới hạn. Vì vậy, hãy để cho mỗi ví dụ và cách bạn có thể sử dụng chúng cho lợi ích của bạn.
Chế độ cắt cứng – Như bạn nhận thấy, có một giá trị “true” được thêm vào sau chiều cao. Đó là giá trị thực sự nói với WordPress để cắt ảnh với kích thước mà chúng tôi đã xác định (trong trường hợp này là 120 x 120px). Đây là phương pháp chúng tôi sử dụng rất nhiều trong thiết kế chủ đề của chúng tôi để đảm bảo rằng mọi thứ đều phù hợp và thiết kế của chúng tôi không phải là phá vỡ. Chức năng này sẽ tự động cắt hình ảnh từ bên hoặc từ trên xuống dưới tùy thuộc vào kích thước. Nhược điểm của việc cắt xén khó khăn là bạn không thể kiểm soát phần nào của hình ảnh được hiển thị .
Chỉnh sửa bởi Mike Little – Khi bạn đã tải lên hình ảnh và trước khi chèn vào bài đăng, bạn có thể nhấp vào ‘chỉnh sửa hình ảnh’ và từ đó thay đổi hình thu nhỏ hoặc toàn bộ hình ảnh, xoay, hoặc lật hình, và cho hình thu nhỏ chọn phần chính xác của hình ảnh mà bạn muốn.
Chế độ Cắt Nhẹ – Theo mặc định chế độ cắt nhỏ được bật là vì sao bạn không thấy bất kỳ giá trị gia tăng bổ sung sau khi chiều cao. Phương pháp này thay đổi kích thước hình ảnh một cách tương ứng mà không làm biến dạng nó. Vì vậy, bạn có thể không có được kích thước mà bạn muốn. Thông thường nó phù hợp với chiều rộng chiều rộng và độ cao khác nhau dựa trên tỷ lệ của mỗi hình ảnh. Một màn hình hiển thị ví dụ sẽ như sau:
Chế độ Chiều cao không giới hạn – Đôi khi bạn có hình ảnh siêu dài mà bạn muốn sử dụng trong thiết kế của bạn, nhưng bạn muốn đảm bảo rằng chiều rộng có giới hạn. Việc sử dụng chính cho loại kích thước hình ảnh này là trên các bài viết về infographic. Infographics có xu hướng rất dài và đầy đủ thông tin. Cắt xén những hình ảnh như vậy trên một trang đăng không phải là một ý tưởng tuyệt vời. Nhưng theo infographics tự nhiên thì rộng hơn chiều rộng nội dung. Vì vậy, những gì bạn có thể làm là chỉ định một chiều rộng mà sẽ không phá vỡ thiết kế của bạn trong khi để lại chiều cao là không giới hạn, do đó, tất cả các Infographic có thể được hiển thị mà không bóp méo bất kỳ. Một màn hình hiển thị ví dụ sẽ như sau:
Hiển thị kích thước hình ảnh bổ sung trong chủ đề WordPress của bạn
Bây giờ bạn đã thêm các chức năng cho các kích thước hình ảnh mong muốn cho phép xem một hiển thị chúng trong chủ đề WordPress của bạn. Mở tệp chủ đề nơi bạn muốn hiển thị hình ảnh và dán đoạn mã sau:
Lưu ý: Đoạn mã này phải được dán bên trong vòng lặp bài đăng.
Đó là tất cả những gì bạn phải làm để hiển thị kích thước hình ảnh bổ sung trong chủ đề WordPress của bạn. Bạn nên quấn nó xung quanh với kiểu dáng phù hợp với nhu cầu của bạn.
Tạo lại kích thước hình ảnh bổ sung
Nếu bạn không làm điều này trên một trang web hoàn toàn mới, thì có thể bạn sẽ phải tạo lại hình thu nhỏ. Cách add_image_size () chức năng hoạt động là nó chỉ tạo ra các kích thước từ điểm nó đã được thêm vào chủ đề. Vì vậy bất kỳ hình ảnh bài đăng nào đã được thêm vào trước khi đưa vào chức năng này sẽ không có kích thước mới. Vì vậy, những gì chúng tôi cần làm là tạo lại kích thước hình ảnh mới cho hình ảnh bài đăng cũ hơn. Điều này được thực hiện dễ dàng bằng plugin được gọi là Tạo lại hình thu nhỏ. Một khi bạn cài đặt và kích hoạt plugin này, một tùy chọn mới được thêm vào trong menu: Tools »Regen. Hình thu nhỏ
Nhấp vào biểu tượng Tạo lại biểu tượng thu nhỏ và để cho plugin hoạt động.
Một plugin khác có thể thực hiện công việc này là Simple Image Sizes.
Bật Kích thước Hình ảnh Bổ sung cho Nội dung Bài đăng của bạn
Mặc dù bạn đã bật kích thước hình ảnh trong chủ đề của mình, việc sử dụng chỉ giới hạn ở chủ đề mà không có ý nghĩa nào. Tất cả các kích thước hình ảnh đang được tạo bất kể, vì vậy tại sao không làm cho nó có sẵn cho tác giả bài đăng để sử dụng nó trong nội dung bài viết. Bạn có thể làm điều này bằng cách sử dụng một plugin gọi là Simple Image Sizes.
Sau khi cài đặt và kích hoạt plugin này, các tùy chọn mới sẽ được thêm vào trang Settings »Media của bạn. Bạn sẽ thấy một danh sách các kích thước mà bạn đã xác định trong chủ đề của bạn. Tất cả bạn phải làm là kiểm tra hộp có nội dung “Hiển thị trong chèn bài đăng”.
Khi bạn chọn hộp này, kích thước bổ sung sẽ có sẵn cho tác giả của bạn sử dụng trong nội dung bài đăng.
Lưu ý trong hình trên, chúng ta có tất cả các kích thước hình ảnh mà chúng tôi đã xác định trong chủ đề của chúng tôi có sẵn cho các tác giả sử dụng trong nội dung bài đăng nếu họ muốn.
Plugin Hình ảnh Đơn giản hóa kích thước cũng cho phép bạn tạo các kích thước hình ảnh tùy chỉnh trực tiếp từ bảng điều khiển WordPress.
Chúng tôi tin rằng phương pháp này nên được thêm vào dưới thực tiễn tốt nhất cho tất cả các nhà phát triển chủ đề WordPress. Quan điểm của bạn là gì?