Сжимаем изображения в контенте

Обрабатываем изображения на фронтенде

$('.article-content img').each(function(){
	var image = $(this);
	var imglink = null;
	var styles = image.attr('style');
	var alt = image.attr('alt');
	var src = image.attr('src');

	//if this domain or relative link
	if(src.indexOf('http') !== -1 && src.indexOf('mysite.com') || src.indexOf('http') == -1){
		//get new src
		$.ajax({
			url: 'ajax/thumb.html',
			data: {url: src, h: image.attr('height'), w: image.attr('width')}
		}).done(function(thumb){
			image.attr('src',thumb);
		});
	}
	imglink = image.attr('style','').wrap('<a href="'+src+'"></a>').parent();
	imglink.attr('title',alt).wrap('<figure style="'+styles+'"></figure>');
	imglink.after('<figcaption>'+alt+'</figcaption>');

	imglink.fancybox();
});

Импользуем пакет phpthumbon

Создаем ресурс ajax/thumb.html, в нем вызываем сниппет:

[[!ajaxThumb]]

if(empty($_GET['url'])) return false;
$pathinfo = pathinfo($_GET['url']);
if($pathinfo['extension'] == 'gif') return $_GET['url'];

$options = array();
if(!empty($_GET['h'])){
    $options[] = "h=".$_GET['h'];
}
if(!empty($_GET['w'])){
    $options[] = "w=".$_GET['w'];
}
return $modx->runSnippet('phpthumbon', array('input' => $_GET['url'], 'options' => implode('&',$options)));