Двухуровневая рубрикация форума

В настоящей статье описан порядок включения и оформления двухуровневой рубрикации в модуле Форум.

Для включения двухуровневой рубрикации необходимо:

1. В Xevian.backend пройти по пути Автономные модули → Форумы.

   Если данный пункт отсутствует в панели навигации, необходимо включить доступ к нему для своей группы (обычно Администраторы).

2. Во вкладке Рубрикатор добавить несколько разделов, причем для некоторых разделов указать значение поля Расположение так, чтобы получилась двухуровневая структура рубрик.
3. В Xevian.backend пройти по пути Дизайн → имядизайна (обычно default). В появившемся списке файлов перейти в папку forum и открыть файл categories_items.html. Файл используется для шаблонизации названий и данных о рубриках.
4. Ввести шаблон с использованием плейсхолдера level, например:

   <tr class="level{level}">
       <td>
           <h2>{title2}</h2>
           <p></p>
       </td>
       <td>{topics}</td>
       <td>{posts}</td>
       <td class="content{last_topic_id}">
           <time>
               {last_date}
           </time>
           <dl>
               <dt>Тема:</dt>
               <dd>{last_topic}</dd>
               <dt>Автор:</dt>
               <dd>{last_user}</dd>
           </dl>
       </td>
   </tr>
   <tr class="headers level{level}">
       <th>Форум</th>
       <th>Тем</th>
       <th>Ответов</th>
       <th>Обновления</th>
   </tr>
   

   где
   • level — плейсхолдер уровня рубрики в двухуровневой структуре,
   • title2 — плейсхолдер названия рубрики,
   • intro — плейсхолдер краткого описания рубрики,
   • topics — плейсхолдер количества тем в рубрике,
   • posts — плейсхолдер количества сообщений в рубрике,
   • last_topic_id — плейсхолдер идентификатора последней темы в рубрике,
   • last_date — плейсхолдер даты последнего обновления темы в рубрике,
   • last_topic — плейсхолдер названия последней обновленной темы в рубрике,
   • last_user — плейсхолдер имени автора последнего сообщения в теме со ссылкой на сообщение.

   Важно отметить, что в рассмотренном примере заголовки таблицы (<th>) идут после ячеек, что с учетом роли шаблона categories_items.html приводит к созданию приблизительно такой таблицы:

   <table>
       <tr class="level0">
           <td>
               <h2>Рубрика 1 уровня</h2>
               <p>Краткое описание рубрики.</p>
           </td>
       </tr>
       <tr class="headers level0">
           <th>Форум</th>
           <th>Тем</th>
           <th>Ответов</th>
           <th>Обновления</th>
       </tr>
       
       <tr class="level1">
           <td>
               <h2><a href="/forum/?category=1">Рубрика 2 уровня</a></h2>
               <p>Краткое описание рубрики.</p>
           </td>
       </tr>
       <tr class="headers level1">
           <th>Форум</th>
           <th>Тем</th>
           <th>Ответов</th>
           <th>Обновления</th>
       </tr>
   </table>
   

   Для простоты демонстрации некоторые теги таблицы опущены.

   Из приведенного листинга видно, что для каждой темы в таблице создается 2 ряда: ряд ячеек с названием и данными о рубрике, и ряд заголовков. Также видно, что строки рубрики 1 уровня отмечены классом level0, а рубрики 2 уровня — классом level1 (согласно шаблону: class="levellevel").

   Данных полученной таблицы достаточно для оформления списка рубрик в CSS.

5. Оформить таблицу с помощью CSS.
   При оформлении таблицы необходимо прежде всего скрыть лишние ряды заголовков после каждой рубрики, оставив только заголовки после рубрики 1 уровня:

   .forumListing tr.level1.headers{
       display: none;
   }
   

   Затем скрыть или оформить заголовки и названия рубрик 1 и 2 уровня согласно макету:

   /* правила приведены в порядке визуального расположения соответствующих элементов */
   
   /* скрыть данные о рубрике 1 уровня */
   .forumListing tr.level0 td{
       display: none;
   }
   /* кроме названия рубрики, которое идет в первой ячейке */
   .forumListing tr.level0 td:first-child{
       display: block;
   }
   /* оформить название рубрики 1 уровня */
   .forumListing tr.level0 h2{
       font-size: 1.5em;
       font-weight: bold;
   }
   /* оформить заголовки таблицы */
   .forumListing th{
       background: black;
       color: white;
   }
   /* оформить название рубрики 2 уровня */
   .forumListing tr.level1 h2{
       font-size: 1em;
       font-weight: normal;
   }
   

Пример использования:

Форум портала города Котельники