Shortcode for resizing images

Новият кратък код е вече факт С негова помощ( а всъщност в основата си благодарение на Timthumb ), изображенията се преоразмеряват изключително лесно За да работи краткия код се нуждае само и единствено от пътя към изображението, естествено има няколко допълнителни опции, които позволяват по-голяма гъвкавост в използването му.

Като цяло това са аргументите, които краткия код приема:

  • src – път към изображението. Без стойност по подразбиране.
  • link – Преоразмереното изображение да бъде ли линк към оригинала? Приема “yes”/”no” . “yes” по подразбиране.
  • class – Какъв клас да се добави към изображението – буквално може да е всичко. Най-често ползвани – “alignleft”/”aligncenter”/”alignright”. “aligncenter” по подразбиране.
  • width – Ширина на смаленото изображение. “610” по подразбиране.
  • height – Височина на смаленото изображение. Без стойност по подразбиране.
  • title – Title атрибут за линка и alt атрибут за изображението. Без стойност по подразбиране.
  • location – Crop location – за повече информация, посетете http://www.binarymoon.co.uk/2010/08/timthumb-part-4-moving-crop-location/ . “c”( центрирано ) по подразбиране.

С горните аргументи, може да се постигне едно основно ниво на използване на Timthumb – наистина основно, защото скрипта има доста повече възможности Но като цяло това на мен ми е достатъчно това и в редки случаи може да ми се наложи да ползвам някоя от другите екстри на скрипта

Ето го и самия код за функцията, която показва преоразмерената картинка:

/*
function resize_shortcode( $atts ) {
	extract( shortcode_atts( array(
		// Път към изображението
		'src' => '',
		// Преоразмереното изображение да бъде ли линк към оригинала? yes|no
		'link' => 'yes',
		// Какъв клас да се добави към изображението - буквално може да е всичко. Най-често ползвани - alignleft|aligncenter|alignright
		'class' => 'aligncenter',
		// Ширина на смаленото изображение
		'width' => '610',
		// Височина на смаленото изображение
		'height' => '',
		// Title атрибут за линка и alt атрибут за изображението
		'title' => '',
		// Crop location - за повече информация, посетете  http://www.binarymoon.co.uk/2010/08/timthumb-part-4-moving-crop-location/
		'location' => 'c',
	), $atts ) );
	if ( $src == '' ) {
		return;
	}
	$return_html = '';
	$width = ( $width != '' )? '&w=' . intval($width) : '';
	$height = ( $height != '' )? '&h=' . intval($height) : '';
	$location = ( $location != '' )? '&a=' . $location : '';
	$class = ( $class != '' )? ' class="' . $class . '"' : '';
	if ( $link == 'yes' ) {
		$return_html = '<a href="' . $src . '" target="_blank" title="' . $title . '">';
	}
	$return_html .= '<img' . $class . ' src="' . get_bloginfo('stylesheet_directory') . '/lib/timthumb.php?src=' . urlencode($src) . $width . $height . $location . '" alt="' . $title . '" />';
	if ( $link == 'yes' ) {
		$return_html .= '</a>';
	}
	return wpautop($return_html);
}
add_shortcode( 'resize', 'resize_shortcode' );
 

Ето и няколко нагледни примера:

[ resize src="https://themoonwatch.com/wp-content/uploads/2011/05/IMG_0503.jpg" title="Untitled..." height="250"]
[resize src=”https://themoonwatch.com/wp-content/uploads/2011/05/IMG_0503.jpg” title=”Untitled…” height=”250″]

[resize src=”https://themoonwatch.com/wp-content/uploads/2011/05/IMG_0265.jpg” height=”350″ width=”250″ class=”alignleft”]
[ resize src="https://themoonwatch.com/wp-content/uploads/2011/05/IMG_0265.jpg" height="350" width="250" class="alignleft"]

 

[resize src=”https://themoonwatch.com/wp-content/uploads/2011/05/Flower.jpg” title=”Flower” height=”500″ width=”300″ location=”br” class=”alignright”]
[ resize src="https://themoonwatch.com/wp-content/uploads/2011/05/Flower.jpg" title="Flower" height="500" width="300" location="br" class="alignright"]

 

Leave a Reply

Your email address will not be published. Required fields are marked *