Webdesign, WordPress

Eigene Bildgrößen definieren

Für diverse Szenarien gibt es die Möglichkeit eigene Bildgrößen zu definieren. So kann man Preview-Bildchen beispielsweise für die Mobile-Ansicht und die Desktop-Ansicht unterscheiden. Dazu müsst ihr nur ein Snippet in dieser Art in eure functions.php eures WordPress-Themes kopieren und anpassen:

/** Eigene Bild-Größen */

add_image_size('jado-mobilethumb', 250, 250);
add_image_size('jado-desktopthumb', 600, 600);

So wird das Bild beschnitten und auf diese Größen skaliert.

Wenn man die Bilder auf diese exakte Größen bescheiden möchte muss man folgendes eingeben:

/** Eigene Bild-Größen */

add_image_size('jado-mobilethumb', 250, 250, true);
add_image_size('jado-desktopthumb', 600, 600, true);

… und wenn man dann noch bestimmen möchte von WO das Bild beschnitten wird kann man dies so machen:

/** Eigene Bild-Größen */

// X = left, center, right // Y = top, center, bottom

add_image_size('jado-mobilethumb', 250, 250, array( 'center', 'top' )); 
add_image_size('jado-desktopthumb', 600, 600, array( 'center', 'top' ));

eingebettet wird es dann im jeweiligen Template mit folgendem Code:

if ( has_post_thumbnail() ) { 
  if(wp_is_mobile()){
    the_post_thumbnail( 'jado-mobilethumb' ); 
  }else{
     the_post_thumbnail( 'jado-desktopthumb' ); 
  }
}