Jak stworzyć nowe rozmiary zdjęć w WordPressie i jak dodać je do rozwijanej listy w panelu

Domyślnie WordPress oferuje zestaw predefiniowanych rozmiarów miniatur. Wystarczają do podstawowych potrzeb, ale jeśli chcesz mieć większą kontrolę nad wyglądem swojej strony warto stworzyć własne. W tym artykule opisałem jak stworzyć niestandardową miniaturę i jak dodać ją do rozwijanej listy w panelu WordPressa.

Definiowanie niestandardowego rozmiaru obrazka

Załóżmy, że potrzebujemy specjalnej miniatury która będzie wyświetlała się nad nagłówkiem artykułu na liście artykułów z danej kategorii.

Aby zdefiniować taką miniaturę, musimy dodać poniższy kod do pliku functions.php. Wcześniej zastąp my-custom-size własną nazwą oraz wpisz własne wartości szerokości i wysokości. Miniaturę definiuje add_image_size. Reszta kodu może się trochę różnić w twoim szablonie. Ważne jest to, że add_image_size musi znaleźć się w setupie szablonu na początku pliku functions.php.

function shapes_setup() {
  if ( function_exists( 'add_theme_support' ) ) {

    add_theme_support( 'post-thumbnails' );
    
    add_image_size( 'my-custom-size', 270, 167, true );

  }
}
add_action( 'after_setup_theme', 'shapes_setup' );

Jeśli ustawione jest true, wgrywany obrazek zostanie przycięty do określonych wymiarów, z wykorzystaniem pozycji środkowych.

Możesz stworzyć kilka niestandardowych miniatur. Dodaj tylko kolejną linijkę kodu z inną nazwą miniatury i innymi wymiarami. Dodatkowo, jeśli podasz tylko pierwszą wartość (szerokość) np. add_image_size( 'my-custom-size', 270);, zmieniona zostanie tylko szerokość obrazka, wysokość nie zostanie przycięta.

Mamy już własną miniaturę i od tego momentu, możemy jej używać w szablonie strony. Możemy na przykład ustawić instrukcję warunkową, którą będzie wyświetlać miniaturę w zależności od tego czy do artykułu wgraliśmy zdjęcie czy nie. W tym celu użyjemy kodu has_post_thumbnail(), który sprawdzi czy miniatura została wgrana i kodu the_post_thumbnail('my-custom-size');, który wyświetli naszą niestandardową miniaturę. Jak to zrobić opiszę w innym artykule. Teraz dodajmy jeszcze naszą miniaturę do rozwijanej listy w panelu.

Jak dodać niestandardowe rozmiary zdjęć do rozwijanej listy w panelu

Jeśli chcesz, żeby obok domyślnych rozmiarów wordpressowych w panelu pojawiła się twoja nowa miniatura, musisz nazwać swoją miniaturę i powiedzieć WordPressowi, że ma ją tam wyświetlać. Dodaj poniższy kod do pliku functions.php (zaraz pod add_image_size).

function show_custom_image_sizes( $sizes ) {
  $custom_sizes = array(
    'my-custom-size' => __( 'My Custom Size Name', 'shapes'),
  );
  return array_merge( $sizes, $custom_sizes );
}
add_filter( 'image_size_names_choose', 'show_custom_image_sizes' );

Funkcja show_custom_image_sizes zawiera tablicę ze zdefiniowanymi rozmiarami miniatur oraz ich nazwami. Kod __( deklaruje nazwę naszej miniatury jako element który możemy przetłumaczyć. shapes to slug danego szablonu (wpisz własny). Kod add_filter dodaje nasze miniatury do listy w panelu.

Finalny kod może wyglądać tak:

function shapes_setup() {
  if ( function_exists( 'add_theme_support' ) ) {

    add_image_size( 'my-custom-size', 270, 167, true );

    function show_custom_image_sizes( $sizes ) {
      $custom_sizes = array(
        'my-custom-size' => __( 'My Custom Size Name', 'shapes'),
      );
      return array_merge( $sizes, $custom_sizes );
    }
    add_filter( 'image_size_names_choose', 'show_custom_image_sizes' );

  }
}
add_action( 'after_setup_theme', 'shapes_setup' );

Od teraz, dodając zdjęcia do artykułów, możesz nadawać im niestandardowy rozmiar, który właśnie utworzyliśmy. Miniatura o szerokości 270px prawdopodobnie nie będzie przydatna w artykule, ale skoro wiesz już, jak tworzyć miniatury, nic nie stoi na przeszkodzie, aby stworzyć kolejną.

Tagi: miniatury, wordpress