Как шаблон Templatemonster адаптировать под ImageCMS

В процессе адаптации шаблона под ImageCMS расширен список страниц доступных в шаблоне, однако появились и некоторые ограничения:

• Не более 5-ти пунктов в главном меню;
• Отсутствие поддержки фотогалереи;
• Ограничения (последние комментарии, теги) на странице блога.

В качестве основы взят шаблон #43798, при создании нового шаблона была использована инструкция по созданию корпоративного сайта на базе ImageCMS Corporate.

1. Создаем в папке \templates\ папку шаблона. Называем ее motheme (как на templatemonster). Копируем в нее все содержимое из папки \templates\default дефолтного шаблона.
2. Скрипты, рисунки и стили, которые планируем применять при верстке, загружаем в папки images, css, js.
3. Из файла верстки index.html копируем html-код в файл main.tpl, оставляя из дефолтного шаблона только meta-теги.
4. Дописываем к пути вызова скриптов, рисунков и классов переменную {Theme} для их корректного вызова, к примеру
   

   <div data-src="{$THEME}images/slide1.jpg">

5. В админке меняем в дефолтный шаблон на новый (в конфигурации сайта).
6. На логотип в файле main.tpl ставим ссылку на главную страницу {site_url('')}.
7. В верхний правый угол шаблона ставим отвечающие за вход и регистрацию переменные (в файле main.tpl).
8. Вставляем в файл main.tpl код вызова главного меню сайта
   

   {load_menu('main_menu')}

   Вносим необходимые правки в файл main_menu\level_0\container.tpl в папке main_menu для корректного отображения меню согласно шаблону.

9. Скрываем ненужные пункты в админ. части (раздел “Меню-Главное меню”), уменьшаем их количество до 5 и убираем галерею.
10. Для вывода слайдера только на главной странице, ставим в файле main.tpl возле него условие
    

    {if $page_type == 'main'}

11. В месте вывода контента главной страницы в файле main.tpl ставим условие
    

    {if $page_type == 'main'}
    <div class="grid_10">
    {$content}
    </div>
    <div class="grid_5 prefix_1">
    <h2>Новости компании</h2>
    {widget('news')}
    </div>
    

12. Для отображения страниц в соответствии с макетом вставляем соответствующий html-код в файл page_full.tpl.
13. В админке убираем отображение на главной странице комментариев.
14. В настройках виджета news уменьшаем количество новостей до 2-х, исправляем согласно макету html-код в папке widgets\news.tpl.
15. Создаем виджет product_main, тип “Последние новости”, что даст возможность отображать продукцию на главной странице. Указываем в настойках отображение 4 новостей, правим его в widgets\product_main.tpl и вставляем в шаблон при помощи блока: {widget('product_main')}.
17. Текст для клиентов ставим в футер в файле main.tpl.
18. С помощью блока:{load_menu('bottom_menu')} вставляем нижнее меню в файл main.tpl. В администаторской части указываем использовать шаблон bottom_menu (“Нижнее меню” редактирование). Для отображения меню согласно шаблону вносим правки в файл bottom_menu\level_0\container.tpl в папке bottom_menu.
19. В файле main.tpl в футере ставим ссылки на соц.сети, меняем контактную информацию, ставим ссылки на копирайт и лого.
20. Для того, чтобы в разделе “Продукция” с правой стороны отображался виджет с продуктами, поставим условие в файле main.tpl (в месте, где отображен контент главной страницы)
    

    <!-- Products Page-->
    {elseif $category.id == 55}
    <div class="grid_11">
    {$content}
    </div>
    <div class="grid_5">
    <h2>Продукция</h2>
    {widget('product_all')}
    </div>
    <!-- End Products Page-->
    

    Затем настраиваем виджет продуктов в файле widgets\product_all.tpl.

21. Отображение категории “Продукция” настраиваем в файле category.tpl.
22. Отображение обратной связи настраиваем в файле application/modules/feedback/templates/feedback.tpl
23. Для того, чтобы в разделе “Блог” отобразить справа все категории “Блога”, нужно поставить дополнительное условие в том месте файла main.tpl, где при помощи переменной {$content}отображается контент главной страницы:
    

    <!-- Blog Page-->
    {elseif $category.id == 59 || $category.parent_id == 59}
    <div class="grid_11">
    {$content}
    </div>
    <div class="grid_5">
    <h2>Категории</h2>
    <ul class="list_3">
    {$sub_cats = get_sub_categories('59')}
    {$count = 0}
    {foreach $sub_cats as $sub_cat}
    <li><a href="{site_url('bloh/'. $sub_cat.url)}" {if $sub_cat.id == $category.id} class="active" {/if}>{$sub_cat.name}</a></li>
    {$count++}
    {/foreach}
    </ul>
    </div>
    <!-- End Blog Page-->
    

25. Отображение раздела “Блог” настраиваем в файле blog.tpl
26. Отображение раздела “Новости” настраиваем в файле news.tpl.

В результате мы получили шаблон для ImageCMS.
Главная страница:

Страница "О компании":

Страница блога:

Создание нового шаблона для ImageCMS Corporate на этом завершено и его можно использовать. На его основе вы также можете создавать и другие похожие шаблоны для своих потребностей.