Инструменты пользователя

Инструменты сайта


limb2:ru:howtos:for-nubs

Туториал для начинающих

Введение

Оговоримся сразу, что данный туториал расчитан на начинающих, кто до этого не использовал какую либо CMF (Content Management Framework). На наш взгляд, проще всего разобраться с новой системой - это создать свой проект на ее основе.

Предположим, что нам требуется создать сайт на основе LIMB 2.4.x. Для этого необходимо:

  1. Наличие установленых Apache, PHP, MySQL;
  2. Установить и настроить LIMB;
  3. Создать шаблоны страниц сайта.

Установка LIMB 2.x

Нам требуется скачать ядро LIMB 2.x, следует использовать самые последний релиз 2.x, т.к старые версии могут иметь проблемы совместимости с версиями PHP выше 4.4.x. Последние версии LIMB 2.x можно найти в разделе релизов на SourceForge страничке проекта.

Разархивируем на сервере архив в какую нибудь папку (на пример /home/bob/limb-2.x/). LIMB сам по себе ничего не «умеет», т.к. это скорее библиотека нежели готовое приложение, поэтому нам также потребуется макет проекта, использующего LIMB.

Создание проекта на базе LIMB 2.x

Создадим проект на основе заготовки, для этого скачиваем пустой проект(empty project) из раздела релизов 2.x на SourceForge и разархивируем его в document_root домена.

Устанавливаем БД

Создаем отдельную базу данных в MySQL (Надо чтобы она могла поддерживать кодировку utf8), и загружаем в эту базу данных русскоязычный дамп из файла проекта init/init_ru.sql

Редактируем настройки

Теперь файл setup.override.php-example переименовываем в setup.override.php и правим в нем настройки для подключения к MySQL базы данных. Если ядро LIMB было установлено в отдельную папку (как в данном примере), нужно добавить в файл setup.override.php строчку:

...
define('LIMB_DIR', '/home/bob/limb-2.4.0-alpha5/');
...

Таким образом мы явное определили путь до ядра LIMB 2.x.

Настройка http shared путей

Из директории ядра LIMB 2.x в папку проекта нужно скопировать папку shared (самый простой путь) или назначить ей Alias в настройках Apache.

В данной папке хранятся стили, javascripts, изображения и проч., используемые для административного интерфейса LIMB, в принципе, можно обойтись и без нее, но тогда мы лишимся многих административных возможностей, например, управление структурой сайта, регистрация контроллеров, расстановка прав и многое другое.

FIXME Дополнить описанием shared

Тестируем проект

В этот момент наш проект полностью готов к запуску. Если открыть в браузере домен с проектом, то должна возникнуть надпись «Главная» (если же ничего не отображается, то скорее всего произошла какая-то ошибка, описание которой, можно посмотреть в логах Apache или более подробно в логах проекта var/log/error.log)

Не так уж и много, учитывая затраченные усилия, однако если зайти в административную зону проекта по адресу http://localhost/admin(логин admin, пароль test), то можно увидеть, что в структуре сайта уже присутствует достаточно большое количество различных элементов, настроены права доступа, созданы пользователи, зарегестрированны контроллеры и проч. Осталось только наполнить проект требуемым функционалом ;)

FIXME Необходимо переработать нижестоящий контент, сделать его более модульным, разбить по параграфам и сделать более читабельным

Создание простейшего проекта

Создание структуры сайта

Пусть нам требуется сайт с разделами:

Общий принцип работы LIMB 2.x

Теперь необходимо сделать паузу и объяснить некоторую логику работы LIMB. Если начинать с малого, то выглядит это так: Проект на лимб - это есть дерево некоторых объектов, каждому объекту сопоставляется некоторый набор действий (actions) которые описываются в специальных классах - называемых контроллерами (controllers), назначаемые объекту или группе объектов. Контроллеры также сопоставляют каждому действию, php класс действия(action), и шаблон для отображения. Т.е. получается что для каждого действия есть свой шаблон отображения и свой класс действия (action) , который может передавать результаты своей работы в шаблон посредством шаблонной системы WACT (ох, незнаю насколько понятно изложил…). Когда запрос выполняется через браузер, лимб определяет какой объект и какое действие было запрошено С помощью контроллера определяется имя класса действия и шаблон отображения.Далее запускается класс действия, по его завершению рендерится шаблон.

Теперь вернемся к нашему установленному проекту… Когда мы запрашиваем просто / в браузере отрабатывается объект / , ему сопоставлен контроллер main_page_controller который по дефолту запускает действие display для которого определен шаблон main_page.html, файлы всех шаблонов хранятся в design/templates/

ВАЖНО!: Резолвинг имен файлов в LIMB работает по правилу: сначала простаматривается папка проекта, а потом папка ядра лимб. Т.е. если лимб не находит файл в папке проекта, то просматривает папку ядра. Т.е., Если мы поместим в файл design/templates/main_page.html какой либо хтмл код - он будет выводится в браузере.

Верстка и создание дизайна проекта

Создание дизайна главной страницы

Теперь, давайте создадим главную страницу сайта. Для этого посмотрим какой контроллер обрабатывает объект main? Если вы используете limb 2.4.x то это main_page_controller. Открываем его (все контроллеры находятся в папке /src/controllers ) и смотрим какие действия (actions) он позволяет выполнить. По умолчанию при запросе объекта используется action=display . Смотрим параметр template_path в секции display, template_path указывает какой шаблон будет рендерится у меня он равен /main_page.html значит рендериться будет шаблон /design/templates/main_page.html

поэтому макет главной страницы нужно поместить в design/templates/main_page.html. Все имажи используемые в хтмл макете, желательно помещать в папку design и ставить им путь от корня сайта(например: <img src=«/design/images/logo.gif»>). Вот пример моего кода:

<head> <metadata:METADATA> <title>{$title}</title> <meta name="description" content="{$description}"> <meta name="keywords" content="{$keywords}"> </metadata:METADATA> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <link href="/design/styles/style.css" rel="stylesheet" type="text/css"> </head>   <body> <table width="100%" border="0" cellpadding="0" cellspacing="0" background="/design/images/index_02.jpg"> <tr> <td><img src="/design/images/index_01.jpg" width="235" height="21"></td> <td><div align="right"><img src="/design/images/index_04.gif" width="210" height="21"></div></td> </tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="90%"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="44" background="/design/images/patch001_06.gif"><img src="/design/images/spacer.gif" width="1" height="1"></td> <td>&nbsp;</td> </tr> <tr> <td background="/design/images/patch001_06.gif"><div align="center"><img src="/design/images/index_08.jpg" width="214" height="94" hspace="87"></div></td> <td width="592"><div align="right"><img src="/design/images/index_10.jpg" width="47" height="94"><img src="/design/images/spacer.gif" width="31" height="1"><img src="/design/images/index_12.jpg" width="141" height="94"><img src="/design/images/spacer.gif" width="98" height="1"><img src="/design/images/index_14.jpg" width="42" height="94"><img src="/design/images/spacer.gif" width="229" height="8"></div></td> </tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td background="/design/images/index_17.gif"><img src="/design/images/index_16.gif" width="181" height="131"></td> <td width="795" background="/design/images/index_17.gif"><table width="100%" border="0" align="right" cellpadding="0" cellspacing="0"> <tr> <td width="285"><img src="/design/images/index_18.jpg" width="285" height="62"><img src="/design/images/index_21.gif" width="285" height="20"><img src="/design/images/index_24.gif" width="285" height="49"></td> <td width="168"><img src="/design/images/index_19.jpg" width="168" height="62"><img src="/design/images/index_22.gif" width="168" height="23"><img src="/design/images/index_25.gif" width="168" height="46"></td> <td><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td><img src="/design/images/index_20.jpg" width="341" height="66"></td> <td width="1"></td> </tr> <tr> <td bgcolor="#FFFFFF" class="index-navigation"> <core:INCLUDE file='main_navigation.html'> </td> <td width="1" bgcolor="#FFFFFF"><img src="/design/images/spacer.gif" width="1" height="32"></td> </tr> <tr> <td bgcolor="#FFFFFF"><img src="/design/images/index_26.gif" width="178" height="33"></td> <td width="1" bgcolor="#FFFFFF"></td> </tr> </table></td> </tr> </table></td> </tr> <tr> <td valign="top" class="index-left-down_bgr" ><img src="/design/images/index_28.jpg" width="181" height="121"></td> <td width="795" background="/design/images/index_29.gif" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td class="content"> <fetch:MAPPED>{$content}</fetch:MAPPED> </td> <td width="210" valign="top" bgcolor="#FFFFFF"><img src="/design/images/index_31.gif" width="210" height="135"></td> </tr> </table></td> </tr> </table></td> <td width="10%" class="index-all-bgr">&nbsp;</td> </tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="0" background="/design/images/index_36.gif"> <tr> <td><img src="/design/images/index_35.gif" width="489" height="28"></td> <td><div align="right"><img src="/design/images/index_37.gif" width="485" height="28"></div></td> </tr> </table>   </body>

сам пример находится здесь: http://v2.modsystems.ru

После окончания верстки макета главной страницы проверяем его работоспособность (пример здесь). Далее таким же образом создаем макет для шаблонов остальных страниц сайта. Чтобы не верстать каждый раз заново шаблоны отображения для каждого действия разных объектов, можно воспользоватся тегами WACT <core:PLACEHOLDER id='id'> и <core:WRAP file='/path/to/file' placeholder='placeholder'>. Работают они так: если поместить второй тег в начале какого нибудь файла шаблона указав в параметре file имя_родительского_файла и placeholder id тега <core:PLACEHOLDER id='id'> в родительском файле, то весь файл шаблона будет вставлен на место <core:PLACEHOLDER id='id'> в родительском файле шаблона (уф, сорри если не понятно:)). Так вот, основную тему дизайна сайта мы можем вынести, допустим, в файл page.html, а контент будем подключать тегом <core:PLACEHOLDER id='content'>. Теперь мы можем просто в начале каждого шаблона какого-либо действия указывать: <core:WRAP file='/page.html' placeholder='content'> и этот шаблон будет полностью вставляться в page.html.

FIXME Дополнить реальными примерами

Обсуждение

Ваш комментарий. Вики-синтаксис разрешён:
   ___    ____   ___    ___    ___ 
  / _ |  / __/  / _ )  / _ \  / _ )
 / __ | / _/   / _  | / // / / _  |
/_/ |_|/___/  /____/ /____/ /____/
 
limb2/ru/howtos/for-nubs.txt · Последние изменения: 2010/11/10 10:02 (внешнее изменение)