Dodanie własnego rozmiaru obrazków w WordPress

Tworzymy własny wymiar obrazków w systemie WordPress poprzez:
add_image_size ( string $name, int $width, int $height, bool|array $crop = false )

 

Przycinanie obrazku możemy ustawić na jedną z trzech opcji:

  1. wartość false(default) – obrazek jest skalowany, nie przycinany
  2. jako tablicę wartości ( x_crop_position, y_crop_position ) gdzie:
    • x_crop_position accepts – przyjmuje wartości:‘left’ ‘center’, ‘right’
    • y_crop_position – przyjmuje wartości: ‘top’, ‘center’, bottom’
  3. wartość true gdzie przycinanie obrazka jest w pionie i poziomie jako center

 

Tworząc nazwę nowego wymiary należy pamiętać że pewne nazwy są zarezerwowane dla defaultowych wymiarów WordPress’a:

‘thumb’, ‘thumbnail’, ‘medium’, ‘large’, ‘post-thumbnail’

przy czym ‚thumb’ i ‚thumbnail’ są aliasami i oznaczają ten sam wymiar.

 

Czyli kod stworzenia nowego wymiaru obrazka wyglądał by następująco:

add_image_size( 'custom-size', 220, 220, array( 'left', 'top' ) );

 

W function.php wprowadzamy:

if ( function_exists( 'add_image_size' ) ) { 
  add_image_size( 'person-thumb', 344, 344, true );
  add_image_size( 'custom-size', 220, 220, array( 'left', 'top' ) );
}

Stworzony wymiar można użyć na parę sposobów:

 

jako miniatura wpisu:

należy tylko pamiętać by w temacie w function.php było zawarte:

add_theme_support( ‘post-thumbnails’ );

w kodzie strony zamieszczamy:

if ( has_post_thumbnail() ) { 
    the_post_thumbnail( 'your-custom-size' ); 
}

lub kiedy chcemy pobrać miniaturę wpisu w konkretnym rozmiarze:

<?php $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'your-custom-size' );
    $url = $thumb['0']; echo $url; ?>

jako obrazek biblioteki multimediów/ wymiar wybierany podczas dodawania obrazka do wpisu lub strony:

w pliku function.php wprowadzamy:

 
if ( function_exists( 'add_image_size' ) ) {
	add_image_size( 'my-image', 300, 200, true );
}
add_filter( 'image_size_names_choose', 'my_custom_sizes' );
function my_custom_sizes( $sizes ) {
    return array_merge( $sizes, array(
        'my-image' => __('My Image'),
    ) );
}

źródło: https://developer.wordpress.org/reference/functions/add_image_size/

#image #Wordpress

Agnieszka Trefler

Agnieszka Trefler (Ruda) - freelancer, web developer, specjalistka od WordPressa z Wrocławia. Z pasją budowania stron, blogowania i fotografowania. Twórca Inspiracji fotograficznych.