Стыковка или интеграция шаблона и CMS C5

[cmsservice]

Я думаю, лучше начать писать в разделе Флейм, заводите новую тему и вперед. За одно и фидбэк будет, замечания там всякие, уточнения и предложения. Потом модератор перенесет куда надо, когда отшлифуется.

[Юра]

Я понял.

[Юра]

Я обращаюсь к cmsservice.Чтоб правильно написать об этом мне необходимы исходные материалы. Мне надо шаблон с html, CSS и папка с имиджем. Чтоб просто все, и главное итог, уже готовая тема. Я о чем? Чтоб правильно написать мне надо исход и итог. Если я сам могу найду первое, то второе если я буду делать сам, то для это много времени надо. Почему все это надо? Просто очень здорово будет, если это все будет на реальном примере.

[cmsservice]

Юрий, Вас ведь никто не торопит. Исходные файлы можно поискать на templatemonster.com, там есть бесплатные и уже сверстанные в HTML. Я думаю это как раз то, что нужно в данном случае.

Доеду до дома, посмотрю тоже, может подкину каких ссылок.

UPD: Вот например

Пожалуйста зарегистрируйтесь, чтобы увидеть ссылку

Простой, содержит сверстанный HTML, легко будет на нем построить пример.

[Юра]

Так получилось. Сам спросил-сам и постараюсь ответить, не только для себя ,но и для всех. Вообщем начинаю.
Интеграция (натяжка) собственной темы в С5.
Начнем конвертировать свою тему в С5 . Чтобы добиться этого, мы будем конвертировать HTML,CSS файлы, в concrete5 . Это означает, что мы должны заменить и вставить строки с PHP кодом, для того, чтобы была интеграция с С5 и назначить места для динамических изменений. Конечно, для этого желательно иметь базовые знания о concrete5. Но это уже другой урок. Поэтому пока будем выполнять, как это должно быть в соответствие с архитектурой С5. Сам процесс интеграции требует знание HTML,CSS,PHP. Если, вы, хотите заново создать тему, вы должны следовать каждому шагу и следуйте инструкциям. Лучше все сделать на реальном примере, чтоб было понятно.
Начнем!
Перед тем, как приступить к созданию темы в concrete5, мы должны иметь макет. В этой статье мы собираемся использовать макет, у которого уже есть HTML и CSS файлы, а также папка с картинками от макета. Это исходные данные, которые можно скачать из интернета и были бы подходящим для тем в С5. В принципе можно пройти весь процесс, не теряя времени, используя свой собственный макет. При хорошем знании базовых технологий под concrete5, вы должны внести изменения, в соответствии с собственным макетом сайта.
Для начала проделаем простые действия.
1. Создаем папку с темой. Есть некоторая особенность для правильного написания названия темы. Если название состоит из 2 и более слов ,то необходимо ставить между словами знак"_". Итак, назовем тему: theme_pluralism и создадим папку. Сразу оговорюсь, что тема уже существует, она очень простенькая.Но может каждый попробовать проделать тоже со своим сверстанным шаблоном. Ниже, созданные файлы и папки будем скидывать в theme_pluralism. Исходный материал состоит из :папки-images, файлов: index.html,license.txt,style.css. Содержание исходника будет опубликовано.
2. Создаем эскиз размером:120 х 90 пикселей нашего макета сайта, сохраняем и создаем его в файле : icon.png.
3. Перенесем файл из исходного материала с именем: license.txt.
4. В любом проекте могут быть изменения, поэтому создадим список изменений: Changelog.txt.
5. Создадим папку :themes. В этой папке и будут содержаться все файлы и папки нашей темы.
6. Создадим последний файл для нашей темы: controller.php. Но в других темах это может быть еще не последний файл и папка. Данный файл должен присутствовать. И он является связующим звеном между браузером и темой.
После всего этого должно выглядеть так:

theme.png

Содержание самих файлов:
changelog :

Код: Выделить всё

1.1 - Updated footer to include copyright notice, added conditional output of bottom bar to all page types (previously it was only on default), and added in C5 "required_footer" to bottom of pages so "Tracking Code" javascript from the dashboard settings will be outputted.
1.0 - Initial release.

controller.php:

Код: Выделить всё

<?php 

defined('C5_EXECUTE') or die(_("Access Denied."));

class ThemePluralismPackage extends Package {

   protected $pkgHandle = 'theme_pluralism';
   protected $appVersionRequired = '5.2.2';
   protected $pkgVersion = '1.1';
   
   public function getPackageDescription() {
      return t("Installs the Pluralism theme.");
   }
   
   public function getPackageName() {
      return t("Pluralism");
   }
   
   public function install() {
      $pkg = parent::install();      
      PageTheme::add('pluralism', $pkg);      
   }
}

lecense.txt:(В качестве примера взял из готовой темы файл меньше.В исходнике больше.Суть понятна все о лицензии. Одна писанина.)

Код: Выделить всё

This software is licensed under the terms described in the concrete5.org marketplace. Please find the add-on there for the latest license copy.

icon.png:

icon.png

Папка :themes пока пустая.
И, как я обещал, вот исходные материалы:

pluralism.zip

Приступим к самому главному. Начнем заполнять папку themes:
1. Создадим в папке themes еще одну папку : pluralism. И уже в ней будем создавать файлы и папки.
2. Первое, создадим папку images. Это та самая папка из исходника, но с изображениями для шаблона сайта. Лишнее из исходной папки убрали.
3. Далее, перенесем из папки theme_pluralism файл: icon.png .
4. На основании исходных файлов: index.html и style.css создадим файлы для страниц шаблона. В зависимости от типа страниц и будут созданы скрипты(файлы). В этом примере будет страница: одно колоночная и с сайд баром.
5. Для полной картины файлов(скриптов) страниц создадим папку:elements. Эта папка содержит элементы колонтитула верхнего: header.php и нижнего: footer.php на которые будет идти ссылка при создании файлов (скриптов) страниц. Эти колонтитульные файлы ,как и все остальные скрипты создаются на основании верстки сайта (исходники).
Верхний элемент страницы header.php:

Код: Выделить всё

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License

Name       : Pluralism
Description: A two-column, fixed-width template fit for 1024x768 screen resolutions.
Version    : 1.0
Released   : 20071218

-->
<!--
Modified for Concrete5 by Jordan Lev - http://jordanlev.com
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<?php   Loader::element('header_required'); ?>
<link rel="stylesheet" type="text/css" href="<?php   print $this->getStyleSheet('main.css'); ?>" />
<link rel="stylesheet" type="text/css" href="<?php   print $this->getStyleSheet('typography.css'); ?>" />
</head>
<body>
<div id="c5wrapper">
<div id="wrapper">
   <div id="wrapper2">
      <div id="header">
         <div id="logo">
            <h1><a href="<?php   print DIR_REL; ?>/" style="" ><?php   print SITE; ?></a></h1>
         </div>
         <div id="menu">
            <?php 
            $a = new Area('Header Nav');
            $a->setBlockLimit(1);
            $a->display($c);
            ?>
         </div>
      </div>
      <!-- end #header -->

Нижний элемент footer.php :

Код: Выделить всё

   </div>
   <!-- end #wrapper2 -->
   <div id="footer">
      <p>&copy; <?php   echo date('Y')?> <a href="<?php   echo DIR_REL?>/"><?php   echo SITE?></a>. Design by <a href="http://www.nodethirtythree.com/" target="_blank">NodeThirtyThree</a> + <a href="http://www.freecsstemplates.org/" target="_blank">Free CSS Templates</a>.</p>
   </div>
</div>
<!-- end #wrapper -->
</div>
<!-- end #c5wrapper -->

<?php  Loader::element('footer_required'); ?>
</body>
</html>


Сравните как было в исходнике index.html и как стало. Если хоть немного знать php уже понятно что добавилось и изменилось.
Если коротко, то в верхней части добавились ссылки на стили. Эти файлы будут рассмотрены ниже. А самое интересное, это добавился код php,который показывает о появлении динамики:$a = new Area('Header Nav'). А в нижней части, реклама, немного по другому. Лучше всего понимать в сравнении. Посмотрите в исходник ( ту область которая интересует) и как должно получится. Суть - добавление php в html. Это как отчий наш!
6. Создадим файл: default.php, который будет по умолчанию, для страниц без конкретного типа. Ну типа страница на все случаи жизни. Все как бы просто, опять вставляем php в html как отче наш. Вот,что должно получиться:

Код: Выделить всё

<?php   
defined('C5_EXECUTE') or die(_("Access Denied."));
$this->inc('elements/header.php'); ?>

      <div id="page">
         <div id="content">
            <?php 
            $a = new Area('Main');
            $a->setBlockWrapperStart('<div class="post">');
            $a->setBlockWrapperEnd('</div>');
            $a->display($c);
            ?>
         </div>
         <!-- end #content -->
         <div id="sidebar">
            <ul>
               <?php 
               $a = new Area('Sidebar');
               $a->setBlockWrapperStart('<li>');
               $a->setBlockWrapperEnd('</li>');
               $a->display($c);
               ?>
            </ul>
         </div>
         <!-- end #sidebar -->
         <div style="clear: both;">&nbsp;</div>
         
         <?php 
         $a1 = new Area('Bottom Bar Left');
         $a2 = new Area('Bottom Bar Middle');
         $a3 = new Area('Bottom Bar Right');
         $block_count = $a1->getTotalBlocksInArea($c) + $a2->getTotalBlocksInArea($c) + $a3->getTotalBlocksInArea($c);
         if ($block_count > 0 || $c->isEditMode()) { ?>
            <div id="widebar">
               <div id="colA">
                  <?php  $a1->display($c); ?>
               </div>
               <div id="colB">
                  <?php  $a2->display($c); ?>
               </div>
               <div id="colC">
                  <?php  $a3->display($c); ?>
               </div>
               <div style="clear: both;">&nbsp;</div>
            </div>
            <!-- end #widebar -->
         <?php   } ?>
      </div>
      <!-- end #page -->

<?php    $this->inc('elements/footer.php'); ?>


7. Следующий файл, который создадим :full.php это примерно как default.php но для полной страницы. И он будет выглядеть:

Код: Выделить всё

<?php   
defined('C5_EXECUTE') or die(_("Access Denied."));
$this->inc('elements/header.php'); ?>

      <div id="page">
         <div id="content" class="full">
            <?php 
            $a = new Area('Main');
            $a->setBlockWrapperStart('<div class="post">');
            $a->setBlockWrapperEnd('</div>');
            $a->display($c);
            ?>
         </div>
         <!-- end #content -->
         <div style="clear: both;">&nbsp;</div>
         <?php 
         $a1 = new Area('Bottom Bar Left');
         $a2 = new Area('Bottom Bar Middle');
         $a3 = new Area('Bottom Bar Right');
         $block_count = $a1->getTotalBlocksInArea($c) + $a2->getTotalBlocksInArea($c) + $a3->getTotalBlocksInArea($c);
         if ($block_count > 0 || $c->isEditMode()) { ?>
            <div id="widebar">
               <div id="colA">
                  <?php  $a1->display($c); ?>
               </div>
               <div id="colB">
                  <?php  $a2->display($c); ?>
               </div>
               <div id="colC">
                  <?php  $a3->display($c); ?>
               </div>
               <div style="clear: both;">&nbsp;</div>
            </div>
            <!-- end #widebar -->
         <?php   } ?>
      </div>
      <!-- end #page -->
      
<?php    $this->inc('elements/footer.php'); ?>


8. Тип страницы может быть с сидебаром слева или справа. Рассмотрим файл с левым сидебаром: left_sidebar.php и он выглядит:

Код: Выделить всё

<?php   
defined('C5_EXECUTE') or die(_("Access Denied."));
$this->inc('elements/header.php'); ?>

      <div id="page">
         <div id="content" class="right">
            <?php 
            $a = new Area('Main');
            $a->setBlockWrapperStart('<div class="post">');
            $a->setBlockWrapperEnd('</div>');
            $a->display($c);
            ?>
         </div>
         <!-- end #content -->
         <div id="sidebar" class="left">
            <ul>
               <?php 
               $a = new Area('Sidebar');
               $a->setBlockWrapperStart('<li>');
               $a->setBlockWrapperEnd('</li>');
               $a->display($c);
               ?>
            </ul>
         </div>
         <!-- end #sidebar -->
         <div style="clear: both;">&nbsp;</div>
         <?php 
         $a1 = new Area('Bottom Bar Left');
         $a2 = new Area('Bottom Bar Middle');
         $a3 = new Area('Bottom Bar Right');
         $block_count = $a1->getTotalBlocksInArea($c) + $a2->getTotalBlocksInArea($c) + $a3->getTotalBlocksInArea($c);
         if ($block_count > 0 || $c->isEditMode()) { ?>
            <div id="widebar">
               <div id="colA">
                  <?php  $a1->display($c); ?>
               </div>
               <div id="colB">
                  <?php  $a2->display($c); ?>
               </div>
               <div id="colC">
                  <?php  $a3->display($c); ?>
               </div>
               <div style="clear: both;">&nbsp;</div>
            </div>
            <!-- end #widebar -->
         <?php   } ?>
      </div>
      <!-- end #page -->
      
<?php    $this->inc('elements/footer.php'); ?>


9. И еще один файл ,который будет как общий или макет для отдельных страниц : view.php и вот его содержание:

Код: Выделить всё

<?php   
defined('C5_EXECUTE') or die(_("Access Denied."));
$this->inc('elements/header.php'); ?>

      <div id="page">
         <div id="content" class="full">
            <?php   print $innerContent; ?>
         </div>
         <!-- end #content -->
         <div style="clear: both;">&nbsp;</div>
         <?php 
         $a1 = new Area('Bottom Bar Left');
         $a2 = new Area('Bottom Bar Middle');
         $a3 = new Area('Bottom Bar Right');
         $block_count = $a1->getTotalBlocksInArea($c) + $a2->getTotalBlocksInArea($c) + $a3->getTotalBlocksInArea($c);
         if ($block_count > 0 || $c->isEditMode()) { ?>
            <div id="widebar">
               <div id="colA">
                  <?php  $a1->display($c); ?>
               </div>
               <div id="colB">
                  <?php  $a2->display($c); ?>
               </div>
               <div id="colC">
                  <?php  $a3->display($c); ?>
               </div>
               <div style="clear: both;">&nbsp;</div>
            </div>
            <!-- end #widebar -->
         <?php   } ?>
      </div>
      <!-- end #page -->
      
<?php    $this->inc('elements/footer.php'); ?>


10. И последнее,что должны сделать это переименовать и разбить файл из исходника со стилями. Поэтому создаем 2 файла main.css и typography.css . Другими словами создаем файл с графикой и файл связанный с текстом. Последний и есть то файл ,который будет отвечать за текст (шрифт, размер,цвет и т.д). И редактор текстов видит файл typography.css. Просто делим исходный файл с css, но конечно с небольшим добавлением.
Тогда новый main.css будет выглядеть:

Код: Выделить всё

/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/

/* Modified for Concrete5 by Jordan Lev - http://jordanlev.com */

* {
   margin: 0;
   padding: 0;
}

#c5wrapper { /* Instead of "body", so C5 toolbar pushes down background appropriately */
   background: #F6F6F6 url(images/img01.jpg) repeat-x;
}

#c5wrapper input, #c5wrapper textarea {
   padding: 2px 5px;
   border: 1px solid #EBEBEB;
   font: bold 12px "Trebuchet MS", Arial, Helvetica, sans-serif;
   color: #6B6B6B;
}

#c5wrapper h1, #c5wrapper h2, #c5wrapper h3, #c5wrapper h4 {
   margin: 0;
}

#c5wrapper h2, #c5wrapper h3, #c5wrapper h4 {
   margin-bottom: 9px;
   padding-bottom: 9px;
   border-bottom: 1px solid #F2F2F2;
}

#c5wrapper p, #c5wrapper ul, #c5wrapper ol {
   margin-bottom: 1.5em;
}

#c5wrapper ul, #c5wrapper ol {
   margin-left: 3em;
}

dl.list1 {
   margin: 0;
   padding: 0;
   list-style: none;
}

dl.list1 dt {
   float: left;
   width: 70px;
}

dl.list1 dd {
   margin-bottom: 10px;
}

dl.list1 a {
   color: #666666;
}

ul.list2 {
   margin: 0;
   padding: 0;
   list-style: none;
   line-height: normal;
}

ul.list2 li {
   float: left;
   margin: 0 18px 18px 0;
}

ul.list2 li.nopad {
   margin-right: 0;
}

#c5wrapper blockquote {
   margin-left: 3em;
   margin-right: 3em;
}

#c5wrapper a img {
   border: none;
}

#c5wrapper img.left {
   float: left;
   margin: 5px 20px 0 0;
}

#c5wrapper img.right {
   float: right;
   margin: 5px 0 0 20px;
}

/* Wrapper */

#wrapper {
   width: 960px;
   margin: 0 auto;
   background: url(images/img02.jpg) repeat-y;
}

#wrapper2 {
   background: url(images/img10.jpg) no-repeat left bottom;
}

/* Header */

#header {
   height: 140px;
   background: #087FE7 url(images/img03.jpg) no-repeat;
}

/* Logo */

#logo {
   float: left;
}

#logo h1 {
   margin: 0;
   padding: 90px 0 0 78px;
   letter-spacing: -3px;
   /* customize_header_logo */ font: normal normal normal 40px "Trebuchet MS",Arial,Helvetica,sans-serif; /* customize_header_logo */
   /* customize_header_logo */ color: #FFFFFF; /* customize_header_logo */
}

#logo h1 a {
   text-decoration: none;
   color: #FFFFFF;
}

/* Menu */

#menu {
   float: right;
}

#menu ul {
   margin: 0;
   padding: 112px 68px 0 0;
   list-style: none;
   line-height: normal;
}

#menu li {
   display: inline;
}

#menu a {
   margin-left: 20px;
   padding: 5px 10px 5px 10px;
   text-decoration: none;
   font-size: 13px;
   font-weight: bold;
   color: #FFFFFF;
}

#menu a:hover {
   text-decoration: underline;
}

/* Page */

#page {
   background: url(images/img04.jpg) no-repeat;
}

/* Content */

#content {
   float: left;
   width: 555px;
   padding: 0 0 0 76px;
}
#content.right {
   float: right;
   width: 600px;
   padding: 0 76px 0 0;
}
#content.full {
   float: left;
   width: 817px;
   padding: 0 0 0 76px;
}

.post {
   padding-top: 50px;
}

.post .title {
}

.post .title a {
   text-decoration: none;
   color: #37404C;
}

.post .title a:hover {
   text-decoration: underline;
}

.post .entry {
}

.post .meta {
   height: 16px;
   margin: 0;
   padding: 10px;
   background: url(images/img07.jpg) repeat-x left bottom;
   line-height: normal;
}

.post .meta .posted {
   display: block;
   float: left;
}

.post .meta .permalink {
   display: block;
   float: right;
   padding-left: 17px;
   background: url(images/img09.gif) no-repeat left center;
}

.post .meta .comments {
   display: block;
   float: right;
   padding: 0 30px 0 19px;
   background: url(images/img08.gif) no-repeat left center;
}

/* Sidebar */

#sidebar {
   float: right;
   width: 186px;
   padding: 67px 76px 0 0;
}
#sidebar.left {
   float: left;
   width: 186px;
   padding: 67px 0 0 76px;
}

#sidebar ul {
   margin: 0;
   padding: 0;
   list-style: none;
}

#sidebar li {
   margin-bottom: 40px;
}

#sidebar li ul {
}

#sidebar li li {
   margin: 0;
}

/* Search */

#search {
}

#search br {
   display: none;
}

#search input {
   padding: 1px 5px;
   border-top: 1px solid #BAD300;
   border-left: 1px solid #A9C817;
   border-right: 1px solid #7DAB00;
   border-bottom: 1px solid #578900;
   background: #6E9D00 url(images/img18.gif) repeat-x;
   font-size: 11px;
   font-weight: bold;
   color: #FFFFFF;
}

#search #s {
   width: 130px;
   padding: 2px 5px;
   background: #FFFFFF;
   border: 1px solid #EBEBEB;
   font: bold 12px "Trebuchet MS", Arial, Helvetica, sans-serif;
   color: #6B6B6B;
}

/* Widebar */

#widebar {
   margin: 0 50px;
   padding: 25px 28px 0 28px;
   background: #F2F2F2 url(images/img11.gif) repeat-x;
}

#widebar #colA {
   float: left;
   width: 260px;
}

#widebar #colB {
   float: left;
   width: 260px;
   padding-left: 45px;
}

#widebar #colC {
   float: left;
   width: 186px;
   padding-left: 45px;
}

/* Footer */

#footer {
   height: 108px;
   background: url(images/img05.jpg) no-repeat;
}

#footer p {
   margin: 0;
   padding-top: 45px;
   text-align: center;
   color: #8E8E8E;
}

#footer a {
   color: #666666;
}

.poll h5 {
   font-size: 13px;
   line-height: 110%;
   padding-bottom: 5px;
}
.poll .buttons input {
   margin-top: 5px;
}

/* customize_miscellaneous */ /* customize_miscellaneous */


Посмотрите тут нет стиля шрифтов и того ,что связывает с текстом.
И вот тоже новый typography.css:

Код: Выделить всё

/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/

/* Modified for Concrete5 by Jordan Lev - http://jordanlev.com */

body {
   /* customize_body */ font: normal normal normal 12px "Trebuchet MS",Arial,Helvetica,sans-serif; /* customize_body */
   /* customize_body */ color: #6B6B6B; /* customize_body */
}

h2, h3, h4 {
   letter-spacing: -0.035em;
   font-weight: normal;
   color: #37404C;
}

h2 {
   font-size: 28px;
}

h3 {
   font-size: 16px;
   font-weight: bold;
}

h4 {
   font-size: 14px;
   font-weight: bold;
}

p, ul, ol {
   line-height: 170%;
   text-align: justify;
}

a {
   /* customize_link */ color: #FF5A00; /* customize_link */
}

a:hover {
   /* customize_link_hover */ color: #FF5A00; /* customize_link_hover */
   text-decoration: none;
}

А в этом файле все то,что связано с текстом.

И в итоге должно получиться когда скачаете готовую тему вот тут:

Пожалуйста зарегистрируйтесь, чтобы увидеть ссылку

Вот, как то, так. Не журите строго. Я понимаю,что многого и возможно не все доходчиво написал. Также понимаю, что это один из самых простых шаблонов. Там нет прибамбасов. Поэтому можно сказать, сложнее шаблон и может появится больше файлов. Ну вроде обещали меня типа причесать. Прошу всех высказываться! И в заключении, изучайте HTML и CSS а также PHP и особенно CMS C5, тогда все будет понятно!!!!

[Юра]

Продолжение будет!!

[Count_Raven]

Пока комментировать не буду. Пусть будет. Много могу сказать, но сейчас совсем нет времени.

[Юра]

Про много я все понимаю. Но, пока пишу. Просто дальше писать, или нет? Хоть бы сказали .... писать дальше или нет? Дальше все будет как будет. Не мне судить. Просто, надо дальше? Еще хоть кто-нибудь... Писать.... дальше?

[Юра]

Уважаемый Count_Raven,а что,еще можно по моему написанному добавить? Я вроде как пишу о самом элементарном. Я понимаю когда крутая тема... Самое главное понять азы... Да тут можно много чего еще написать. Но почему то никто не пишет об элементарных вещах! Просто скажите писать далее или нет?

[cmsservice]

Про много я все понимаю. Но, пока пишу. Просто дальше писать, или нет? Хоть бы сказали .... писать дальше или нет?

Дальше писать обязательно, потом причешем совместными усилиями.

[Юра]

Спасибо! Буду писать далее. Так глядишь общими усилиями получится глава книги, которую пишет наш модератор!

[cmsservice]

Так глядишь общими усилиями получится глава книги, которую пишет наш модератор!

И ему будет что поправить, а не сидеть перед "чистым листом"

[Юра]

Это конечно! Я просто чайник в этом! Я пишу можно сказать как слепой. Хотя уже начинаешь читать, смотреть,анализировать и как бы въезжаешь малость! Я просто буду рад если будут причесывать. Мне очень интересно. И самое главное рассмотреть про дополнительные штучки в шаблоне. А то как яву ,хтмл5 и т.д ну т.есть не совсем классически.

[Юра]

Прошу посматривать: Стыковка или интеграция шаблона и CMS C5. Я дополняю.

[Юра]

Я закончил писать статью!