Как растянуть по высоте Яндекс.Карты в шаблоне Bootstrap ?

Здравствуйте. Помогите, не могу растянуть Яндекс Карты по высоте колонки блока, что только не пробовал… Естественно height:100% не работает. В интернете ничего дельного не нашел, может у вас есть догадки?

Шаблон "North"

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

Шаблон, в отличие от предыдущих, максимально простой, в нем нет разнообразия лент топиков, кучи настроек и не требуются какие-либо дополнительные плагины. Одна простая лента топиков списком, простая цветовая схема, пара дополнительных мини-тем задающих фон сайту, адаптивность и, пожалуй, все.

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

Читать дальше →

Адаптивные видео в шаблонах с Bootstrap (Решено)

В Bootstrap-е есть замечательная возможность сделать встраиваемые видео адаптивными. Для этого нужно для iframe (или object) видео присвоить класс embed-responsive-item, а затем обернуть в блок с классом embed-responsive embed-responsive-16by9 (source).
<div class="embed-responsive embed-responsive-16by9">
    <iframe class="embed-responsive-item" src="..."></iframe>
</div>

Естественно, это будет работать только на bootstrap-based скинах. Благо, таковых много, в основном благодаря vOFFka , за что ему огромное спасибо!

Задумался, как реализовать это в Livestreet:
Все работает, если подкорректировать замену тега video, добавив указанную выше конструкцию в Text.class.php.

Однако подобные изменения коснутся любого скина. У нас же фича скин-специфичная.

Вопрос:
Как реализовать подобную обертку, чтобы она работала только для определенного скина? М.б. js?

UPD: Решение при помощи js:
В файл template.js в шаблоне добавляем две строки:
$("iframe").addClass('embed-responsive-item');
$("iframe").wrap('<div class="embed-responsive embed-responsive-16by9"/>');

Помогите сформировать и правильно написать одно условие (PHP)?

Здравствуйте.
Есть форум (плагин LS Board — Форум) с двумя основными категориями и множеством подкатегорий. Все это выводится на одну страницу. И получается большая простыня.
Вот изначальный код вывода категорий и подкатегорий:
{foreach from=$aForums item=oForum}
      {if $oForum->getAllowShow()}
        {assign var='aSubForums' value=$oForum->getChildren()}
        <section class="forums-list category-block toggle-section" id="category-{$oForum->getId()}">
          <header class="forums-header well well-sm">
            <i class="js-forum-cat-toggler"></i>
            <h2><a href="{$oForum->getUrlFull()}" title="{$oForum->getTitle()}"><i class="fa fa-folder fa-lg"></i> {$oForum->getTitle()}</a></h2>
          </header>
          <div class="forums-content well">
            {include file="$sTemplatePathForum/forums_list.tpl" aForums=$aSubForums}
          </div>
          <div class="forums-note clearfix" style="display:none;">
            <div class="fl-r">
              <strong>{$oForum->getCountTopic()|number_format:0:'.':$oConfig->Get('plugin.forum.number_format')}</strong> {$oForum->getCountTopic()|declension:$aLang.plugin.forum.topics_declension:'russian'|lower}
              <span>|</span>
              <strong>{$oForum->getCountPost()|number_format:0:'.':$oConfig->Get('plugin.forum.number_format')}</strong> {$oForum->getCountPost()|declension:$aLang.plugin.forum.posts_declension:'russian'|lower}
            </div>
          </div>
        </section>
      {/if}
    {/foreach}


Решил внести изменения в отображения с помощью вкладок, Tabs из Bootstrap (getbootstrap.com/javascript/#tabs). Что две основные категории с подкатегориями разбивались на две вкладки.

<ul class="nav nav-tabs" id="cat-tab">
      <li class="active"><a href="#category-13" data-toggle="tab">форум_1</a></li>
      <li class=""><a href="#category-11" data-toggle="tab">-форум_2</a></li>
</ul>

 <div class="tab-content">
         {foreach from=$aForums item=oForum}
                   {if $oForum->getAllowShow()}
                             {assign var='aSubForums' value=$oForum->getChildren()}
                       <div class="tab-pane forums-list toggle-section" id="category-{$oForum->getId()}">
                               <header class="forums-header well well-sm">
                                                  <i class="js-forum-cat-toggler"></i>
                                                  <h2><a href="{$oForum->getUrlFull()}" title="{$oForum->getTitle()}"><i class="fa fa-folder fa-lg"></i> {$oForum->getTitle()}</a></h2>
                                        </header>
                                       <div class="forums-content well">
                                                {include file="$sTemplatePathForum/forums_list.tpl" aForums=$aSubForums}
                                       </div>
                                       <div class="forums-note clearfix" style="display:none;">
                                                <div class="fl-r">
                                                         <strong>{$oForum->getCountTopic()|number_format:0:'.':$oConfig->Get('plugin.forum.number_format')}</strong> {$oForum->getCountTopic()|declension:$aLang.plugin.forum.topics_declension:'russian'|lower}
                                                         <span>|</span>
                                                         <strong>{$oForum->getCountPost()|number_format:0:'.':$oConfig->Get('plugin.forum.number_format')}</strong> {$oForum->getCountPost()|declension:$aLang.plugin.forum.posts_declension:'russian'|lower}
                                               </div>
                                       </div>
                     </div>
                  {/if}
            {/foreach}
</div>


Проблема в том, что по умолчанию одна из вкладок сразу должна обладать классом active. Если сразу присвоить, здесь:

<div class="tab-pane forums-list toggle-section active" id="category-{$oForum->getId()}">


То все вкладки активны, все показываются, а должна одна.
В связи с этим прошу помощи в написании условия которое присваивало бы класс active нужной вкладке в нужный момент?

Orion flat-шаблон для Livestreet

9 фото
image
Наконец-то мы выкладываем наш шаблон в каталог! Спустя 5 месяцев работы, мы объявляем начало продаж. Сделано очень много работы, за основу взят bootstrap 3, стилизованный под flat.



На момент релиза реализовано:
  • Bootstrap 3 со всеми его прелестями(Включая модальные окна)
  • Легкий и ненавязчивый flat дизайн c возможностью смены основного цвета.
  • Текстовые иконки
  • Настройка ленты топиков(На момент выхода шаблона в каталог 4 стиля)
  • Фоновая картинка в шапке, а также большое превью для топиков.
  • Стилизированный плагин mainpreview, теперь он более интерактивный.
  • Появились вкладки в профиле и при создании топика-фотосета.
  • Стену и активность вынесли на главную в профиле.
  • Ajax загрузка топиков на главной странице
  • Новый стиль редактора текста
И не считанное количество мелочей....

Цена:
Цена — 800р. Деньги пойдут на 2 версию шаблона(над которой мы уже работаем).

Домо находится тут — mapleart.ru/demo/
Удачного просмотра, надеемся что вы будите нашими покупателями!


Из-за незнания, что ls берет большую комиссию цена на следующую версию поднимется до 1000р. Успеваем купить!!

Skillville 2.0

Обновили сайт skillville. Раньше был Fortune, теперь самописный на основе developer-kit (тот что с bootstrap), все делалось под себя, постарались сделать достаточно современным. Кроме того, на сайте появился платный сервис для публикации на продажу материалов/товаров/услуг.

-

На прошлой неделе все только запустили, так что функционал будет продолжать наращиваться, а баги и косяки отлавливаться ))

Шаблон Orion

Всем привет ;) Хочу рассказать про наш шаблон — Orion. Идея bootstrap шаблона появилась давно, но все откладывалось в ожидании новой версии LS. Мы накапливали материалы, анализировали уже готовые шаблоны, проблемы дефолтного шаблона и «хотелки» участников сообщества. Работа шла не торопясь, с продумыванием мелочей и переделыванием элементов на 1000 раз. Сейчас, когда ведутся финальные работы, «шлифовка» мелочей и исправление ошибок, нам хотелось бы услышать ваше мнение о наших трудах.
Orion Template - Шаблон для Livestreet

Читать дальше →

Как изменить шапку в пагинации?(решено)

Добрый день.

Я задумал сделать большую такую шапку на главной (на манер bootstrap). Кроме шапки, ниже идет список топиков, затем элементы соц сетей, возможно еще что-то будет накинуто. Но, если пользователь задумает переключиться на след страничку пагинации под топиками, логично предположить что большая шапка, и вся остальная информация ниже списка топиков его совсем не интересует, соответственно ее надо убирать.

По логике я собрался реализовать это таким образом:

1. Для шапки на главную страницу создаю main_header.tpl,
2. В ActionIndex добавляю условие, которое считывает event экшена Index (в нашем случае это: page1, page2 и т.д.) и если эвент равен page, то main_header.tpl не подключается.
Таким образом для страницы мойсайт.ру я имею уникальную главную, а при пагинации, пользователь видит грубо говоря только список топиков.

{if $sAction != 'page%'}
    {include file='main_page.tpl'}
{/if}


Правильно ли я рассуждаю и корректен ли синтаксис?

Я совсем совсем новичок, и в лайвстрите и в вэбразработке, я постепенно осваиваю ее, поэтому если есть желание, то помогите советом!

Кнопка с меняющейся по клику иконкой (bootstrap)

Имеется кнопка подписки/отписки в профиле пользователя с иконкой:
<li class="follow">
    <a href="#" onclick="ls.user.followToggle(this, {$oUserProfile->getId()}); return false;" class="btn btn-xs btn-default">
        <i class="icon{if $oUserProfile->isFollow()} icon-minus{else} icon-plus{/if}></i>{if $oUserProfile->isFollow()} {$aLang.profile_user_unfollow}{else} {$aLang.profile_user_follow}{/if}
    </a>
</li>


Чуть выше прогружаютя текстовки:
<script>
    jQuery(function($){
        ls.lang.load({lang_load name="profile_user_unfollow,profile_user_follow"});
    });
</script>


Стоит задача, чтобы иконка менялась в соответствие с текущим статусом подписки.
Получается, но при подписке иконка исчезает и появляется только при перезагрузке страницы. Т.е. if-ы в классах иконки сразу не отрабатывают.

При подписке для li.follow a задется класс followed.
Это делает скрипт из user.js:
this.followToggle = function(obj, iUserId) {
    if ($(obj).hasClass('followed')) {
        ls.stream.unsubscribe(iUserId);
        $(obj).toggleClass('followed').text(ls.lang.get('profile_user_follow'));
    } else {
        ls.stream.subscribe(iUserId);
        $(obj).toggleClass('followed').text(ls.lang.get('profile_user_unfollow'));
    }
    return false;
};

Попробовал задать для li.follow a background-image с нужными координатами в спрайте, а для li.follow a.followed соответствующий background-position. Все работает как надо. Но «рушиться» bootstrap-овская кнопка и надо верстать вручную.

Вопрос: Что необходимо дописать в скрипт выше, чтобы иконке задавался соответствующий класс (icon-plus и icon-minus)?