04.03.11

Внешний вид шаблона TemplaVoila через beLayout

TemplaVoila beLayout

При работе с сайтами, которые имеют сложную структуру и состоят из нескольких текстовых или функциональных блоков, в TYPO3 есть одна очень хорошая и полезная хитрость. Изначально чтобы пользователь смог добавлять текстовую и любую другую информацию на сайте для него в шаблоне определяются специальные области, которые задаются через элемент TemplaVoila типа Page-Content Element. Например, как правило, в дизайне присутствует шапка, футер, основной контент и боковые колонки (сайдбары). Когда таких блоков 1-2, то никаких вопросов не возникает, но есть если у вас новостной сайт с 10-тью разными блоками, каждый из которых называется по типу Middle Right News Element и раз пятый видите TYPO3? — правильно, возникнут сложности.

Немного сгладить эффект позволяет параметр beLayout (BackEnd Layout), предусмотренный в TemplaVoila. Вообще, кстати, изначально когда искал решение попал на похожий плагин, но добрые люди объяснили, что использовать его не обязательно. По умолчанию TemplaVoila все созданные элементы типа «Блок контента» (Page-Content Element) располагает в ряд начиная с тех, которые созданы и определены ранее. В итоге получается «полоса» из блоков с разными названиями, где не всегда понятно их функциональное назначение и место в дизайне.

блоки контента TemplaVoila

Опять же, если вы хорошо разбираетесь в TYPO3 или, например, создавали этот шаблон, то в течении пары минут сможете сориентироваться. Но давайте представим, что заходит в админку заказчик, знающих TYPO3 не так хорошо — без документации или даже помощи тут разбираться он будет долго.

А теперь давайте взглянем на еще одно изображение — какой вид может получить этот же шаблон.

улучшенный шаблон страницы

По моему, становится очевидно какой из вариантов более «user friendly» и лучше воспринимается. Чтобы задать для блоков контента неких «дизайн», заходим в меню TemplaVoila, выбираем для редактирования DS запись шаблона, где в поле Data Structure XML находим блок кона начинающийся с <meta> и закрывающийся </meta>.

структура шаблона TemplaVoila

<beLayout>
<![CDATA[
<table width="100%" cellspacing="0" cellpadding="0" border="1">
  <tr><td colspan="3">###field_headertext###</td></tr>
  <tr>
    <td rowspan="2" valign=top width="25%">###field_left###</td>
    <td valign=top width="50%">###field_content###</td>
    <td rowspan="2" valign=top width="25%">###field_right###</td>
  </tr>
  <tr>
    <td>###field_content2###</td>
  </tr>
  <tr>
    <td colspan="3">###field_footer###</td>
  </tr>
</table>
]]>
</beLayout>

Внешний вид блоков контента задается через таблицу Table и имеет некоторые характерные для нее атрибуты. Важно лишь заметить что в той или иной ячейке таблицы название блока представляется в виде ###field_footer### (то есть название элемента + символы ### с каждой стороны). В принципе, ничего сложного в этом нет, сам процесс настройки занимает минут 10, зато положительное впечатление у заказчика и внимание к деталям вам «зачтется».

P.S. Для своей питерской квартиры можете заказать качественные межкомнатные двери волховец в Петербурге через интернет магазин и сэкономить за счет скидок.
Также в сети можно быстро и без проблем купить контактные линзы как обычные, так и цветные с различными аксессуарами и доставкой.

Понравился пост? Подпишись на TYPO3 блог typo3 blog RSSRSS, RSS typo3 blogEmail или typo3 twittertwitter!
TemplaVoila Админка TYPO3

комментариев 9 к статье “Внешний вид шаблона TemplaVoila через beLayout”

  1. Нариман   06.03.11

    Спасибо за статью! И правда очень легко

  2. Владимир   05.04.11

    Подскажите где можно вообще посмотреть как подключается элемент TemplaVoila так как сейчас я его у себя не нашёл. CMS typo3 установил прям с хостинга пару дней её уже юзаю, но до конца с блоками не могу разобраться пришёл к тому что не хватает у меня в сборке TemplaVoila! Подскажите Где её скачать и как установить! Заранее благодарен

  3. Tod   05.04.11

    Владимир, по умолчанию в сборке typo3 модуля нет, нужно скачать с сайта отсюда или установить через менеджер экстеншенов.

  4. Владимир   05.04.11

    Cпасибо за быстрый ответ
    Тод подскажи чем лучше typo3 чем остальные! Но по крайней мере что тебя привлекло в ней?

  5. Tod   05.04.11

    Владимир, преимущества typo3 — функциональность, гибкость, надежность, можно почитать о некоторых особенностях тут — особенности и плюсы системы typo3, чем привлекла? — на момент ознакомления с ней, она была лучше джумлы и битрикса (за который еще и платить приходилось), сейчас, думаю, typo3 с друпалом одни из самых крутых cms для корпоративных сайтов, точнее друпал больше по социальным, а типо3 — чисто корпоративные.

  6. Владимир   05.04.11

    Спасибо, к тому вроде и пришёл после хождения по форумам где обсуждали typo3. А у меня вроде задачи на копоративный сайт не стоят, но желание изучить typo3 пока ещё не пропало! Хотябы из за того что она сильно отличается от других cms. Хотя конечно изучение не так легко даётся. много специфики именно этой cms. У вас много на этой cms сайтов? если не трудно дайте ссылочки посмотрю на них! Может и вопросик для новой темы Вам подкину после просмотра сайтов!)

  7. Нариман   06.04.11

    Здравствуйте!
    Известно ли вам что-нибудь про разметку beLayout шаблона для повторяющихся объектов (SC section : CO container), чтобы они нормально повторялись и в админке. ?

  8. Tod   06.04.11

    Владимир, когда работал в веб-студии сайтов было много) Сейчас чуть меньше, по возможности некоторые из них буду рассматривать в разделе блога сайты на typo3 — вот еще штучки 3 туда могу добавить, причем интересные весьма экземпляры.

    Нариман, с этим не знаком, давно не делал повторяющиеся элементы, а тем более разметку для них.

  9. alex_tesla   27.12.11

    Добавлю еще, что в свойствах и DS и каждого TO есть поле «Файл шаблона макета внутреннего интерфейса», где можно указать html шаблон того, что вы описали в статье, без необходимости ручной правки. В этом шаблоне можно разместить баннеры, заголовки, статический текст и прочее, в общем можно сделать почти точную эмуляцию внешнего вида (только верстка шаблона должна быть табличной). Подробно все описано в книге «TYPO3 Templates» Jeremy Greenawalt (Packt publishing, 2010) в 7-й главе.

Оставить комментарий к статье Внешний вид шаблона TemplaVoila через beLayout

Полезные блоги

  • для блоггеров и вебмастеров