Расскажу с демонстрацией на картинках о простом решении вывода на шаблоне Electronics блока кликабельных фотографий, подгружаемых в специальные страницы (как впрочем и в новость, статью, товар и вообще любую другую запись, в какую Impera CMS позволяет подгрузить фотографии), притом чтобы каждой из картинок или только некоторым можно было задать свой URL страницы, куда поведет эта картинка кликнувшего по ней.

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

Как пример, в одном магазине возникла необходимость вывести на главной странице логотипы брендов. Так как о наличии в используемом шаблоне Electronics какого-либо специального модуля, предназначенного для вывода брендов в виде кликабельных картинок (а такого модуля там и в самом деле нет), люди естественным образом не знали, то загрузили логотипы брендов в ту страницу, которая у них на сайте является главной (в данном случае вместо каталога они на главную вывели простую специальную страницу, тип контента которой - статическая страница).

Однако логотипы появились на главной в виде фото галереи, клик по картинкам приводил к открытию картинки, а не переходу человека на связанную страницу. Ведь при загрузке фотографий в текущей версии движка не было предусмотрено, что к загружаемым фотографиям, кроме имени сохраняемого файла, alt-надписи и краткого описания, еще неплохо было бы задавать URL ссылки.

Такое появится лишь в следующей версии движка, но пока этого нет, то на ум пришло, что модуль center/images.htm (он помечен справа зеленым цветом в списке файлов шаблона), занимающийся отрисовкой фото галереи в любом виде публикаций, к числу которых неявно относится и статическая страница, ведь можно очень быстро приспособить под возникшую задачу. Если на кликабельных логотипах отказаться от текста описания (зачем оно на логотипе?) и ставить в поле описания URL желаемой страницы - вот вам и галерея, превращаемая в блок разводящих по страницам кликабельных картинок.

  {* в какой папке лежат картинки специальных страниц *}
  {$prefix = $settings->sections_files_folder_prefix|default:''}
  {$folder = $smarty.const.ADMIN_SECTIONS_CLASS_UPLOAD_FOLDER|default:''}

  {* рисуем фото галерею *}
  {include file = 'center/images.htm'
           item = $section|default:''
           files_folder = $prefix|cat:$folder}

1 Это был пример готового фрагмента кода, чтобы вызвать отрисовку фото галереи в необходимой точке шаблона специальной страницы (на таких страницах доступна переменная $section), например код можно вставить в файл catalog.tpl, где-нибудь над, под или среди фрагментов вывода списков "хиты продаж", "новинки", "акционные товары", "недавно покупавшиеся" и так далее.

Собственно, код вызова отрисовки галереи можно еще упростить, если у вас на том же движке работает только один магазин и вы не пользуетесь префиксами папок (то есть когда папка для хранения картинок специальных страниц остается дефолтной - files/images/sections/). Тогда код допустимо записать так:

  {* рисуем фото галерею *}
  {include file = 'center/images.htm'
           item = $section|default:''
           files_folder = 'files/images/sections/'}

Тот же фрагмент кода возможно использовать в специфичных шаблонах callme.tpl (позвоните мне), feedback.tpl (контакты, обратная связь), login.tpl (авторизация), registration.tpl (регистрация), sitemap.tpl (карта сайта) - как правило, на эти страницы фотографии не загружают, однако под формами ввода вполне можно расположить галерею разводящих картинок-ссылок, скажем на основные категории или какую-то дополнительную информацию, связанную с отображаемой на странице формой ввода.

2 Теперь посмотрим на получаемый внешний вид сайта. Здесь вызов модуля center/images.htm вставлен в файле catalog.tpl прямо над тем фрагментом, где выводится вступительный текст страницы (в оригинальном файле это сделано с помощью модуля center/preamble.htm).

3 Следующим делом нам нужно внести небольшую правку в модуль вывода фото галереи center/images.htm. Правка изменит поведение модуля так, чтобы он анализировал содержимое поля описания фотографии, и если там записан URL ссылки, то он делал фотографию кликабельной со ссылкой на указанный URL, иначе выводил фотографию как обычно (ведь мы же не хотим, чтобы по всему сайту у нас перестали работать фото галереи, где картинки никуда не ведут, а всплывают или открываются в новом окне и просто демонстрируют разные ракурсы предмета публикации).

Ниже показан весь исходный код модуля и таким цветом выделены добавляемые фрагменты для поддержки ссылок. Одновременно сюда же внесены правки иного рода - для SEO, они выделены другим цветом. Желающим разобраться в алгоритме работы модуля разными цветами выделены входные переменные модуля, его локальные переменные, глобальные переменные, поля переменных, модификаторы Smarty.

{* <!-- центральная колонка: фотографии --> *}{strip}

    {* <!-- если в записи существует список фотографий --> *}
    {if isset($item->images) && is_array($item->images) && !empty($item->images)}

        {* <!-- вычисляем url папки с фотографиями --> *}
        {$url = (($site|default:'')|cat:($files_folder|default:''))|escape}


        {* <!-- захватываем вывод в переменную $result --> *}
        {capture assign = 'result'}

            {* <!-- перебираем разрешенные к показу фотографии --> *}
            {$index = 0}
            {foreach $item->images as $f}
                {if !isset($item->images_view[$index]) || $item->images_view[$index]}

                    <div class="image">

                        {* <!-- в описании фото указана ссылка? --> *}
                        {$href = $item->images_texts[$index]|default:''}
                        {$href = ($href|regex_replace:'!^https?://[^/]+(/.*)?$!i':'' == '') ? $href : ''}

                        {* <!-- альтернативный текст фотографии (для SEO) --> *}
                        {$alt = $item->images_alts[$index]|default:''}

                        {* <!-- ссылка и фотография --> *}
                        <a class="image" href="{if $href == ''}{$url}{$f|escape}" target="_blank{else}{$href|escape}{/if}" {if $alt != ''} title="{$alt|escape}" {/if}>
                            {if $item->images_thumbs[$index]|default:'' != ''}
                                <img src="{$url}{$item->images_thumbs[$index]|escape}" {if $alt != ''} alt="{$alt|escape}" {/if} />
                            {else}
                                <img src="{$url}{$f|escape}" {if $alt != ''} alt="{$alt|escape}" {/if} />
                            {/if}
                        </a>

                        {* <!-- описание фотографии --> *}
                        {if $href == '' && $item->images_texts[$index]|default:'' != ''}
                            <div class="info">
                                {$item->images_texts[$index]}
                            </div>
                        {/if}

                    </div>

                {/if}
                {$index = $index + 1}
            {/foreach}
        {/capture}


        {* <!-- если результат не пустой, выводим --> *}
        {if $result|regex_replace:'/[\s\t\r\n]/':'' != ''}

            {* <!-- фотографии --> *}
            <div class="rte" id="gallery">
                <h2>
                    Фото галерея
                </h2>

                {$result}

                <div class="clear"></div>
            </div>

        {/if}
    {/if}

{/strip}

4 Теперь на странице админпанели страницы -> Специальные страницы нужно вызвать на редактирование интересующую специальную страницу и загрузить в нее набор фотографий, введя для каждой картинки желаемый URL страницы вместо текста описания фотографии. Это показано на скриншоте.

Обратите внимание, что с помощью соответствующего флажка у каждой фотографии можно включать/выключать показ отдельных фото.

Ну в шабоне Electronics по папкам разложено более 50 каких то файлов. Вы могли бы перечислить список tpl файлов и напротив справа дописать что каждый делает?

Думаю мы все смогли бы придумать ещё идей, если знали назначение файлов.

Как создать страницу и наполнить изображениями-ссылками я понял. Но не совсем ясно куда загружать эти фотки с сылками если я хочу добавить такой блок на страницу catalog.tpl ниже блоков Хиты продаж и прочее. Для этого мне тоже нужно создавать специальную страницу и напонять её фотографиями?

Разработчик спасибо все получилось. Молодец что делаешь подробные описания на чайника. Систему просто оуеть удобную ты сделал. Но большую пздец такую что никого верстальщиков нет умеющих работать с ней чтобы гарантию дал что сделает и не сольется потом.

Федор на верху всех стоящих файла написано зачем он.

EraUa фото грузи в страницу какая у тебя для главной сделана. Ищи на "страницы > специальные страницы" ту что с типом контента "товары".