1. Главная
  2. Блоги
  3. Блог Jean Jack

Вывод подписи (title, alt) под каждой картинкой в поле типа ImageField

Главные вкладки

Аватар пользователя Jean Jack Jean Jack 3 ноября 2009 в 0:44

Долго искал и наконец нашел здесь
Как вывести подпись под каждой картинкой поля ImageField, то есть чтобы при просмотре ноды отображалась картинка, а рядом содержание title или alt.

Вот примерный перевод:

  1. Копировать sites/all/modules/cck/theme/content-field.tpl.php в свою тему.
  2. Затем создать еще один файл в папке темы вида content-field-field_image.tpl.php если хотим темизировать вывод поля field_image. Там разместить копию содержимое файла из пункта 1.
  3. Вставить в новый файл (из пункта 2) следующий код в том месте, где необходимо вывести подпись
    <?php if ($item['data']['title']): ?>
         <div class="image-caption"><?php print $item['data']['title']; ?></div>
         <?php endif; ?>

    Title можно заменить на alt или description, кому что нужно

  4. Очистить кеш Друпала в разделе Администрирование/Производительность

П.С. Сам пока не попробовал, не хватает времени. Может будет полезно кому-нибудь.

Комментарии

Аватар пользователя Cyber Cyber 5 сентября 2011 в 23:50

Читорский подход, для тех кому не доставляет дампинг и джеркинг

$('selector img').each(
 function() {
  var desc = $(this).attr('alt');
  if( desc && desc.length > 10 ){
   $(this).wrap('<div class="alter_wrap" />');
   $(this).parent('div').append('<p>' + desc + '</p>');
  }
 }
);

Примерно так. Остальное css Biggrin

Аватар пользователя lastuser lastuser 1 октября 2011 в 23:52

А для 7-ки есть аналогичное решение, как у ТС? Понял, что нужно делать field--image.tpl.php, но как внутри расписать - не дойду никак (

Аватар пользователя C_CLuber C_CLuber 2 июля 2012 в 1:45

Можно еще переопределить функции рендеринга изображений theme_image_style или посерьезнее theme_image_formatter.
Выделите отдельный стиль вывода для изображений в разделе admin/config/media/image-styles и по нему добавляйте описание. например вот так

<?phpfunction youtheme_image_style($variables) {
  // Determine the dimensions of the styled image.
  $dimensions = array(
    'width' => $variables['width'], 
    'height' => $variables['height'],
  );

  image_style_transform_dimensions($variables['style_name'], $dimensions);

  $variables['width'] = $dimensions['width'];
  $variables['height'] = $dimensions['height'];

  // Determine the url for the styled image.
  $variables['path'] = image_style_url($variables['style_name'], $variables['path']);
  $output = theme('image', $variables);
  if ($variables['style_name'] == 'you_image_style' && $variables['alt']!= '') {
    $output .= '<div class="image_'.$variables['style_name'].'_description">'.$variables['alt'].'</div>';
    }
  return $output;
}?>