И чтобы понятно было, о чем идет речь, предлагаю ознакомится со статьей Термины
1) Я не стал переходить на чисто блочную верстку. В теории выглядит хорошо, но на практике при подготовке скина работается тяжеловато. Возможно, я недостаточно хорошо продумал систему блоков, возможно, сказывается общий недостаток опыта (все же я не верстальщик). Поэтому принял компромиссный вариант — есть блочная основа, но при этом активно используется Smarty-директива include.
Все шаблонные хуки сохраняются из соображений совместимости.
2) Во всех tpl-шаблонах исхожу из принципа «валидной закрытой структуры». Т.е. если в шаблоне какой-то тег открывается, то закрываться он обязательно должен в этом же шаблоне. Такое, что открыть тег, скажем, в шаблоне «шапки», а закрыть его в шаблоне «подвала» — это недопустимо.
3) Основной макет (themes/default/defauly.tpl), от которого потом все наследуется, собран из header.tpl и footer.tpl, и шаблонов в них входящих. Не вижу причин, почему, например, header.tpl нужно разбивать на несколько шаблонов, а потом их инклудить. Собрав отдельные кусочки в одном файле, получаем четкую и внятную основу для HTML-страницы, которую можно окинуть и понять одним взглядом.
4) В самом начале макета есть Smarty-блок vars — {block name="vars"}{/block}. Он нужен не для визуализации, а исключительно для задания переменных Smarty, которые влияют на структуру и отображение отдельных частей шаблона. Например, раньше в шаблоне писалось так:
{assign var="noSidebar" value=true}
{include file='header.tpl'}
Или так:
{include file='header.tpl' noSidebar=true menu='blog'}
Теперь же надо писать так:
{extends file="_index.tpl"}
{block name="vars"}
{$noSidebar=false}
{$menu="blog"}
{/block}
5) Шаблоны отдельных страниц (экшенов) наследуются, как правило, не напрямую от макета, а через промежуточный файл _index.tpl, который лежит в корне скина и наследуется уже от макета темы. Примерное содержимое _index.tpl:
{extends file="themes/`$alto.skin.theme`/default.tpl"}
Пока всего одна строка, но это для развития на будущее, т.к. в перспективе у одной темы может быть несколько макетов (напр., для статических страниц — одни, для топиков — другой, для профиля — третий), и в этом файле все будет разруливаться.
6) Как правило, основное содержимое страницы выводится в блоке content, поэтому стандартная структура шаблона экшена выглядит примерно так:
{extends file="_index.tpl"} <!-– указываем шаблон «родителя» -->
{block name="vars"} <!-– задаем переменные, которые используются в шапке -->
{$menu="blog"}
{$sidebar="left"}
{/block}
{block name="content"} <!-– формируем блок контента -->
<!-- здесь можно непосредственно формировать контент -->
<!-- и/или использовать Smarty-директиву include -->
{include file='topic_list.tpl'}
{/block}
7) Виджеты передаются в шаблон в переменной Smarty $alto.widgets. Выводить виджеты в шаблоне можно либо по отдельности, либо сразу целой группой:
<!-- вывод виджетов по отдельности -->
{foreach $alto.widgets.toolbar as $oWidget}
{if <какое-то условие>}
{widget object=$oWidget}
{/if}
{/foreach}
Вывод сразу всех виджетов конкретной группы:
{wgroup group='toolbar'}
При этом шаблонны виджетов располагаются в папке скина widgets и имеют в названиях файлов префикс 'widgets.'. Например, /mono/widgets/widget.blogs.tpl.
8) Для обратной совместимости оставлена возможность добавлять виджет в текущий набор прямо из шаблона:
{wgroup command="add" group='toolbar' name='toolbar_comment.tpl'
aPagingCmt=$aPagingCmt
iTargetId=$iTargetId
sTargetType=$sTargetType
iMaxIdComment=$iMaxIdComment
}
Или альтернативный вариант:
{wgroup_add group='toolbar' name='toolbar_comment.tpl'
aPagingCmt=$aPagingCmt
iTargetId=$iTargetId
sTargetType=$sTargetType
iMaxIdComment=$iMaxIdComment
}
9) Для совместимости с ЛС оставлены Smarty-функции {block ...}, {add_block ...} и {get_blocks ...} (но должен быть включен плагин Ls), но их использование крайне не рекомендуется.
10) Поддерживается обратная совместимость с системой шаблонов LS (т.е. они должны работать без всяких изменений), но должен быть включен плагин Ls.
11) Примерная схема организации системы шаблонов для скина Alto CMS.
/actions/ - шаблоны экшенов
/css/ - файлы ресурсов (стили, js, изображения...)
/.../ - файлы ресурсов (стили, js, изображения...)
/settings/ - описание и конфигурация скина
/config/
/skin.xml - XML-описание скина
<другие файлы, например, скриншоты>
/themes/ - темы скина
/default/ - тема по умолчанию
/default.tpl - макет по умолчанию
/widgets/ - шаблоны виджетов
/_index.tpl – наследуется от макета, от него наследуются все остальные шаблоны
/*.tpl – все остальные шаблоны
12) Примерная структура макета (themes/default/defauly.tpl)
<!DOCTYPE html>
{block name="vars"}{/block}
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="ru"> <![endif]-->
<!-- . . . -->
<html class="no-js" lang="ru"> <!--<![endif]-->
<head>
{hook run='html_head_begin'}
<!-- здесь содержимое тега head -->
{hook run='html_head_end'}
</head>
<body class="{$body_classes} width-{cfg name='view.grid.type'}">
{hook run='body_begin'}
{if $oUserCurrent}
{include file='window_write.tpl'}
{include file='window_favourite_form_tags.tpl'}
{else}
{include file='window_login.tpl'}
{/if}
<div id="container" class="i-container {hook run='container_class'}">
{include file='header_top.tpl'}
{include file='nav.tpl'}
{include file='system_message.tpl'}
<div id="wrapper" class="{hook run='wrapper_class'}">
{if !$noSidebar && $sidebarPosition == 'left'}
{include file='sidebar.tpl'}
{/if}
<div id="content-wrapper">
<div id="content">
{block name="content_menu"}
{if $menu}
{if in_array($menu,$aMenuContainers)}
{$aMenuFetch.$menu}
{else}
{include file="menu.$menu.tpl"}
{/if}
{/if}
{/block}
{block name="content"}
{hook run='content_begin'}
{hook run='content_end'}
{/block}
</div><!-- /content -->
</div><!-- /content-wrapper -->
{if !$noSidebar && $sidebarPosition != 'left'}
{include file='sidebar.tpl'}
{/if}
</div><!-- /wrapper -->
<footer id="footer" class="b-footer i-container">
{hook run='footer_begin'}
<div class="b-footer-copyright">
{hook run='copyright'}
</div>
{hook run='footer_end'}
</footer>
</div><!-- /container -->
{include file='toolbar.tpl'}
{hook run='body_end'}
</body>
</html>
1 комментарий