studio

Плагин SmartResizer - универсальный вариант решения этой проблемы.

Плагин поддерживает форматы изображений jpg, png, gif.

 Параметры плагина:

• Ширина эскиза для блогов - ширина мини-эскиза для картинки статьи в блоге категории, блоге раздела и статей на главной.
• Высота эскиза для блогов - высота мини-эскиза для картинки статьи в блоге категории, блоге раздела и статей на главной..
• Ширина эскиза по умолчанию для статей - ширина эскиза по умолчанию для картинки статьи в самой статье.
• Высота эскиза по умолчанию для статей - высота эскиза по умолчанию для картинки статьи в самой статье.
• Ширина эскиза по умолчанию для других компонентов - Ширина создаваемого эскиза по умолчанию в пикселах для картинок в других компонентах (не com_content).
• Высота эскиза по умолчанию для других компонентов - Высота создаваемого эскиза по умолчанию в пикселах для картинок в других компонентах (не com_content)

Расширенные параметры:

• Создавать эскизы для всех картинок - Если НЕТ, то эскизы будут создаваться только для картинок с командой 'smartresize'. Если ДА, то эскизы будут создаваться для всех картинок, исключая картинки с командой 'nosmartresize'.
• Игнорировать индивидуальные размеры картинки - Если ДА, то индивидуальные размеры картинки в тэге IMG будут игнорироваться и размер эскиза будет браться из параметров плагина, исключая картинки с командой 'smartresizeindividual'.
• Создавать ссылку на статью в блогах - Если ДА, то в блоге раздела, категории или на главной эскиз картинки будет ссылаться на статью.
• Стиль эскиза в блоге - вы можете задать стиль оформления (свойство style тэга <img>) для эскизов статей в блогах категорий, блогах разделов, а так же материалов на главной. Значение этого параметра будет вставлено в свойство style тэга <img> эскиза. Пример значения параметра: background-color:#EEEEEE; border:1px solid #999999; padding: 3px;margin-right:5px
• Стиль эскиза в статье - вы можете задать стиль оформления (свойство style тэга <img>) для эскизов в самих статьях.
• Стиль эскиза в сторонних компонентах - вы можете задать стиль оформления (свойство style тэга <img>) для эскизов в контенте сторонних компонентов.
• Способ отображения полноразмерной картинки -
   - Новое окно или RokBox lightbox - полная картинка будет открываться в новом окне браузера или в лайтбоксе, если установлен системный плагин RokBox.
   - Popup окно - полная картинка будет открываться в popup окне в центре экрана.
• Сохранять эскизы в - той же папке, что и оригинальная картинка или в папке cache.
  
• Качество эскиза в % - Качество jpg картинки мини-эскиза (влияет на размер эскиза: чем меньше качество, тем меньше размер).
  
• Суффикс эскиза - задает суффикс для имени файла мини-эскиза.
  

Параметры 1 и 2 задают фиксированный размер мини-эскиза для картинок в блоге категории, блоге раздела, статей на главной странице.

Параметры 3 и 4 задают размер по умолчанию картинки в самой статье. Можно задать свой размер мини-эскиза для каждой картинки в статье с помощью свойств картинки высота и ширина (свойства width и height тэга img) в редакторе статьи. Если ни высота ни ширина картинки не заданы, то размер мини-эскиза будет взят из параметров 3,4 по умолчанию.

Можно задать только ширину или только высоту картинки в параметрах плагина или в свойствах картинки. В данном случае незаданный параметр размера картинки будет вычислен автоматически, исходя из отношения ширины и высоты исходной картинки. Если отношение заданных вами ширины и высоты мини-эскиза будет отличаться от отношения ширины и высоты исходной картинки, то мини-эскиз будет обрезан либо сверху-снизу, либо слева-справа.

Чтобы указать плагину для каких картинок нужно делать мини-эскизы, нужно в свойствах картинки в редакторе задать значение smartresize в свойстве class (Класс).Необходимо включить расширенный режим редактора TinyMCE для того чтобы поле "Класс" было доступно для ввода в свойствах изображения во вкладке "Оформление". Для ввода поля "Класс" выберите из выпадающего списка значение "value", при этом поле "Класс" станет доступно для ввода команды smartresize. Если используется свойство "Класс", то в файле шаблона template.css можно добавить класс smartresize. Этот класс может быть пустым:

.smartresize { }

или с оформлением картинки полями:

.smartresize { 
 padding: 5px 5px 5px 5px;  
 margin:10px 10px 10px 10px;
 border:1px solid #CCCCCC; 
 background:#EEEEEE;
 float:left;
}

Для картинок в блогах можно задать оформление отдельно от картинок в статьях:

.blog img.smartresize { 
 padding: 5px 5px 5px 5px;  
 margin:10px 10px 10px 10px;
 border:1px solid #CCCCCC; 
 background:#EEEEEE;
 float:left;
}

Для оформления эскизов вместо описания класса smartresize в css файле шаблона можно использовать параметры плагина "Стиль эскиза (в блоге, в статье, в сторонних компонентах )", описанные выше. Этот вариант проще и универсальнее, чем описание класса, так как позволяет задать отдельное оформление эскизов в сторонних компонентах и не требует изменения CSS файла шаблона.

Чтобы задать индивидуальные размеры для эскиза в блоге или на главной нужно воспользоваться командами blogwidth и blogheight, которые можно задать в свойсте style картинки:

<img class="smartresize" style="blogwidth:200; blogheight:100;" 
  src="images/stories/image.jpg">

Для того, чтобы плагин создавал эскизы для всех картинок, нужно включить параметр плагина Создавать эскизы для всех картинок.В этом случае будут обрабатываться все картинки в статьях, блогах, а так же в сторонних компонентах, поддерживающих обработку своего содержимого плагинами контента. В этом режиме вы можете запретить создавать эскиз для отдельных картинок, включив в поле "Класс" картинки команду nosmartresize.

Пример эскизов с произвольным размером в блоге: http://minimart.lotix.ru/smartresizer-demo

Пример эскиза в статье: http://minimart.lotix.ru/smartresizer-demo/8-lorem-ipsum-5

Обсудить плагин можно на форуме.