Второй sidebar (слева)

Итак, появилась необходимость сделать второй сайдбар (слева) с возможностью указывать в common/config/widgets.php что и где в нем показывать. Возможно, у кого-то уже оскомина от этой темы (и на Альто уже поднимался этот вопрос), но я всё же опишу здесь, как я это реализовал. Надеюсь, кто-то укажет на ошибки.

Внимание: данная статья НЕ РУКОВОДСТВО.

Сначала для Synio
1. Для начала, нужно создать позицию для нового сайдбара.
Открываем файл header.tpl и сразу после:
<div id="wrapper" class="{if $noSidebar}no-sidebar{/if}{hook run='wrapper_class'}">

вставляем:
{include file='leftbar.tpl'}

2. Далее, создаем файл шаблона отвечающего за вывод блоков в новом сайдбаре указанных в widgets.php. Для этого, дублируем файл в sidebar.tpl, переименовываем его в leftbar.tpl и меняем всё его содержимое на этот код:
<aside id="leftbar">
    {wgroup group='left'}
</aside>

Т.е. изменили значение id и right поменяли на left.

3. Далее прописываем css (можно в synio/themes/default/style.css) для нашего сайдбара:
#leftbar { float: left; width: 25% }

Идем в css/grid.css и изменяем ширину контента с
#content-wrapper { float: left; width: 100%; margin-right: -295px; }

на
#content-wrapper { float: left; width: 75%; margin-right: -295px; }

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

4. Теперь, для того, чтобы вывести в нашем сайдбаре блоки (виджеты), нам нужно, либо создать свой блок (виджет) с нужным содержимым и вписать его в widgets.php указав новую позицию ('wgroup' => 'left'):
$config['widgets'][] = array(
    'name' => 'widgets/my_widget.tpl',
    'wgroup' => 'left',
);

— либо прописать новое значение ('left') в уже существующих виджетах, которые мы хотим видеть в нашем новом сайдбаре.

Developer-kit для AltoCMS 1.0
С «developer-kit» (а делалось это, в-первую очередь, для него) добавление «левого» сайдбара выглядит немного иначе. В header.tpl после
<div class="row-fluid">
    {if !$noSidebar && $sidebarPosition == 'left'}
        {include file='sidebar.tpl'}
    {/if}

— добавляем:
{include file='leftbar.tpl'}

— создаем в корне скина шаблон leftbar.tpl с содержимым:
<aside class="span4">
    {wgroup group='left'}
</aside>

— настраиваем css (для указанного шаблона основные стили прописаны в developer-kit/bootstrap/css/) и проделываем то, что описано выше в пункте «4».

Нюансов — целый вагон и маленькая тележка, поэтому описывать все нет смысла. Все решается «по месту» и в зависимости от ваших требований. Как-то так... Прошу прощения за многа букаф. Надеюсь, не наделал ошибок в описании...

P.S.: если наличие левой колонки выглядит несколько напряжно при просмотре в мобильных устройствах, то её можно и вовсе скрыть (отключить), добавив следующий код в любой css файл шаблона (условно поставим ограничение на 600px):
@media (max-width: 600px) {
  #leftbar {display: none;} /* скрываем левую колонку */
}


Прямой эфир слева (Synio)


Прямой эфир слева (developer-kit)


«Свой» виджет (developer-kit)

Похожие статьи

  • Переместить sidebar в профиле влево
    Скажите пожалуйста! Битый час сижу и не понимаю как перенести, или сделать вывод сайтбара в профиле слева. В правой части он при изменении размеров окон уходит вниз и ерунда какая то получается. Т.е я жму на кнопку...
  • Блоки в Альто
    Камрады, подскажите: поставил на Альто шаблон «Фортуна», в настройках ActionPage снял ограничение показа сайдбара (noSidebar=false), однако блоки на статических страницах не выводятся. Пробовал экспеременитировать с...

28 комментариев

0
в избранное
0
Спасибо, за подробное описание. Побольше бы таких…
Такой вопрос — а настройки виджетов в админке не поломались после этого или все ок — включается/выключается/двигается?
0
а настройки виджетов в админке не поломались после этого или все ок — включается/выключается/двигается?
Проверил включение/выключение, изменение приоритета блоков — всё в порядке вроди…
0
полезная статья!
0
Быть может, не совсем по теме, но не подскажите, можно ли выводить записи со стен пользователей в сайдбар/«Прямой эфир» и если да, то как? Заранее благодарю за ответ.
0
ну, можно сделать все что угодно. Смысл в том, что для вас будет проще сделать новый виджет, который будет реализовывать необходимый функционал. Если не знаете, как это сделать — смотрите пример работы других виджетов. На сколько помню, там весь код довольно подробно прокомментирован.
0
Я в свое время отталкивался от этой наработки: Новости админа на главной — плагин для LS. Немного подкорректировал код, сделал чтобы выводились все новости со стен (не только админа). Но потом были какие-то конфликты (уже не помню какие именно) и я оставил эту затею…
+2
У меня топик-инструкция была — livestreet.ru/blog/13791.html — там вывод стены админа на главную в виде ленты новостей. Реализация вашей задачи будет похожей.
0
Вот на Ваш плагин я и дал ссылку. Небольшая правка BlockNews.class.php позволила выводить записи со всех стен. А конфликт (вспомнил) был с регистрацией и авторизацией пользователей через модальное окно (со страниц /login и /registration зайти получалось).
+1
Упс. Я это давно делал, и не сразу понял, что про моё (. Извиняюсь.

По поводу ошибки: посмотрите в консоли браузера, что отдает сервер, при включенном отображении ошибок во время входа на сайт — там должна быть ошибка. Картинка от хрома вот такая
0
Хорошо! Сейчас немного освобожусь и проверю. Пока пользователи не стали жаловаться, что не могут зайти на сайт (методом «тыка» вычислил что дело в «News») — в Вашем плагине души не чаял…

0
Спасибо! Скажите, а если напрямую выводить в прямой эфир, то это через ActionAjax.class.php?
+1
Если только вам, то да, а если всем, у кого страничка открыта и без ее перезагрузки, то нет. Такое реализуется комет-серверами (не только, но как вариант). Мне очень нравится realplexor — вот ссылка: habrahabr.ru/post/79189/
0
А адаптивность это не ломает? Не проверяли на мобильных устройствах?
+1
Ноут:



Планшет (600Х800):



Смартфона нет.
Но если что, вот сервис quirktools.com
Вот сайт для теста: demo

P.S.: Позицию «левой» колонки (как и отображение её на определенных страницах) в мобильных устройствах (на моих скринах она, например, в самом верху) можно менять манипулируя вставкой:
{include file='leftbar.tpl'}

в шаблонах. Например, для отображения «левой» колонки только на Главной, вставляем указанный код не в header.tpl, а в actions/ActionIndex/index.tpl и т.д.
0
Т.е. правый сайдбар при «схлопывании» уходит вниз, как и задумано, а левый — вообще отключается
Отредактирован:
0
Не туда нажал (ответил ниже) :)
+1
Ну здесь он остается в самом верху (в данном случае так задумано).
Но если наличие левой колонки выглядит несколько напряжно при просмотре в мобильных устройствах, то её можно и вовсе скрыть (отключить), добавив следующий код в любой css файл шаблона (условно поставим ограничение на 600px):

@media (max-width: 600px) {
  #leftbar {display: none;} /* скрываем левую колонку */
}
0
Да, я как-то не заметил сразу, что вверху Прямой эфир остается
0
Ребята, подскажите, насколько правильно такое решение: копирую из widgets.php движка код одного из виджетов и переношу его widgets.php скина (код именно копирую, т.е. он присутствует и там и там). Потом, в widgets.php скина меняю позицию виджета (с 'wgroup' => 'right' на 'wgroup' => 'left'). На выходе, позиция меняется. Результат удовлетворительный. Как я понял, приоритет widgets.php скина выше? Вообще, так можно делать?
+1
Да, можно. Приоритет будет выше у конфига скина. Все то, что есть по умолчанию в конфиге движка можно (и нужно) переопределять в конфигах плагинов, скинов и в папке app/config
Так вы сможете обновлять движок и при этом не терять свои наработки и настройки конфигов.
0
Вот! Отлично.
Спасибо.
+2
Было бы здорово, если бы кто-то написал как вообще правильно кастомизировать систему, пользуясь этими и другими механизмами, чтобы как можно меньше трогать сам движок. Какие-то основные правила и приемы.
+2
Все просто, но в тоже время и нет…
Первое правило — не трогать все, что находится в папках /engine, /common/classes и /common/classes/config
Второе правило — для любого изменения функционала — пиши плагин, ибо в плагине можно переопредилить классы движка, написать свои экшены, переопределить шаблоны и сделать почти все что угодно, кроме изменения двух системных классов (но оно вам и не понадобится)
Для более полной информации посмотрите вот это видео:
youtu.be/Kq35JnRI9hk?t=14m35s
Это доклад Вадима Шемарова (aVadim ) на конференции CMS Conference 2013 — очень полезное видео.
Отредактирован:
0
Раз уж leftbar-у задали 25%, может контенту дать 50% а правому сайдбару — 25%?
А то получается все в %, кроме правого сайдбара.
Как вариант, можно обоим сайдбарам дать фикс. ширину, а ширину контента в % вычислить js-ом…
+1
Я исходил из реалий шаблона Synio (который для меня лично не представляет никакого интереса), стараясь максимально сократить изменение авторского кода. Тут ведь процесс творческий… Делать можно всё что угодно.
В том скине, с которым я работаю сейчас, я примерно так и сделал (как Вы описали).
0
не помешало бы такое и на 1.1.5
0
Принцип тот же
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.