Бесплатный шаблон "Developer-Kit" v.0.3

Продолжаю разработку шаблона «Developer-Kit» и с радостью сообщаю о выходе третьей его версии.

Что изменилось по сравнению с предыдущей версией
  • Сделал все что мог для того, чтобы шаблон можно было максимально изменять через страницу кастомизации Бутстрапа. Т.е. теперь можно пройти по указанному адресу, задать необходимые Вам параметры, скачать Бутстрап, перезалить его в шаблоне и получить изменненный шаблон. Правда, останется еще изменить цвета голосований и некоторые фоны руками.
  • К шаблону прикручен иконочный шрифт Font Awesome. А это значит, что теперь цвет и размер иконок можно менять простым css. Плюсы и минусы можно почитать, например, в этой статье.
  • Шаблон обзавелся тремя простенькими темами: дефолтная — с чистым css файлом, тема с отступами у основных областей (это если надо, к примеру, задать фон сайта) и тема без отступов (если фон сайта однородный). На самостоятельные темы не тянут, но примером послужить могут.
  • Поправлены баги, замеченные в процессе работы с шаблоном, и оставленные к прошлой версии, нерешенным осталось, по-моему, только предложение по плавающему модальному окну.
  • Прочие мелочи, которые можно отследить на гитхабе...

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

Лицензия
Шаблон распространяется по лицензии Attribution-ShareAlike 3.0 Unported (CC BY-SA 3.0) по которой вы можете свободно:
  • делиться — копировать, распространять и передавать другим лицам данное произведение
  • изменять (создавать производные произведения) — чтобы приспособить это произведение к своим задачам
  • использовать произведение в коммерческих целях

При обязательном соблюдении следующих условий:
  • Вы должны атрибутировать произведение (указывать автора и источник) в порядке, предусмотренном автором (активная ссылка на мой профиль, которая уже прописана в копирайтах).

Снять мой копирайт можно за донейт от 10уе.

Демо пока доступно здесь.

GitHub:
v.0.1: github.com/vj-team/developer-kit
v.0.2: github.com/vj-team/developer-kit/tree/0.2
v.0.3: github.com/vj-team/developer-kit/tree/0.3


Внимание! В данной версии шаблона не отображаются иконки при включенном в конфиге слиянии css файлов. Работаю над решением проблемы.

Внимание! Проблема с отображением иконок решена — внимательно читаем файл README.md и делаем все по инструкции.

72 комментария

avatar
Интересно, что это itmages.ru/image/view/1001467/d41d8cd9
avatar
это у вас шрифт не подгрузился, скогей всего из-за кэша, а может беда в другом.
avatar
Беда, я так понял, в странном определении иконок в css файлах… Насчёт кеша, я конечно сразу подумал, и попробовал почистить и в браузере, и на самом сайте…
avatar
какой браузер?
avatar
firefox 20 (Linux) и так-же пробовал в chromium 6.0.472.63
avatar
Ничего не могу подсказать, у себя проверил во всех доступных браузерах под виндой и андроидом — все норм.

Такое у Вас на своем сайте или на моей демке?
На сайте Font Awesome отображается нормально все?
avatar
Только на своём… Но уже решил траблу. Был небольшой косяк в конфигурации тестового виртуалхоста на nginx.
avatar
У меня аналогичная трабла, подскажите, как именно решили проблему?
avatar
Показывайте свой конфиг виртуалхоста для начала.
avatar
Дело в том, что я на хостинге обычном, соответственно к конфигу сервера не имею доступ… но если пойму куда копать, то достану саппорт, что-бы сделали, что необходимо…
avatar
Ну у меня вот не было доступа к файлу шрифта.
avatar
У меня тоже самое, к сожалению. Вернулся на предыдущую версию… Обычный хост, посему конфигами обделен. =(
avatar
Я, кажется, понял в чем причина: данная проблема возникает в том случае, если в конфиге включено слияние файлов css, т.е.

$config['compress']['css']['merge'] = true; // указывает на необходимость слияния файлов по указанным блокам.


Буду искать решение, в качестве временной меры можете отключить слияние.
avatar
Да, Я тоже попробовал — без слияния работает. Похоже в неправильном порядке слияние происходит. Ждем фикса, сам шаблон — отличный! Хочу на его основе кое что сделать, но все руки не доходят…
P.S. системные названия тем можно? default ...???
avatar
Проблема решена — см. топик.

P.S. системные названия тем можно? default ...???

Так они в папке themes шаблона лежат: default, with-padding, without-padding.
avatar
А все, нашел, спасибо!
avatar
Проблема решена — см. топик.
avatar
Спасибо за шаблон, вчера сверстал небольшой дизайн, но вопрос: какая переменная отвечает за вывод элементов в мобильную версию этого шаблона?
avatar
Не понял Вашего вопроса.
Шаблон адаптивный, мобильной версии его нету, просто при изменении ширины экрана он «ужимается», но есть возможность указывать какие элементы шаблона отображать на тех или иных экранах (посмотрите как ведет себя поиск при изменении ширины экрана). Если речь про адаптивность, смотрите файл responsive.css.
avatar
Допустим у меня на сайте Текст, мне это не надо выводить в мобильной версии.
avatar
Читаем по ссылке twitter.github.io/bootstrap/scaffolding.html#responsive

В Вашем случае тексту необходимо добавить класс hidden-phone, т.е. сделать что-то типа:
<div class="hidden-phone">Ваш текст</div>
avatar
1) Шаблон на 150% не совместим с плагинами Галерея, и Бренд.
2) У меня почему то отсутствовали иконки лайк дизлайк и стрелочки перемотки экрана.
3) Больше багов не отловил. В целом очень хороший шаблон и без изменений.
Спасибо!
avatar
1. Под плагины необходимо адаптировать.
2. В чем была причина? Как решили?
3. Спасибо.
avatar
Никак не решил. Удалил шаблон, и буду ждать более допиленных версий.
avatar
Может какие плагины конфликтовали? На моей демке у Вас все отображается?
avatar
Да, дело в том, что у меня сайт сейчас хостится на ISS. Видимо затуп в этом.
avatar
Проблема с иконками решена — см. топик.
avatar
увы. README.md не помог.
та же история отключаешь слияние — работает
включаешь — не работает
avatar
скачивали последнюю версию с гитхаба? кеш чистили?
avatar
Качал 04 с гитхаба. Кэш чистил.
avatar
А компрессия css у Вас выключена или включена?
avatar
Подозреваю, что у вас в настройках веб-сервера запрещено брать файлы из этого каталога. Для nginx надо поставить в конфиг, например, вот это:

location ^~/templates/font-awesome/ {
            auth_basic off;
            root /home/user/ls/www/;
        }

где заменить /home/user/ls/www/ на путь к корневой папке ЛС.
avatar
Перед этим лучше-бы глянуть, что отвечает nginx например при прямом обращении к файлу, глянуть что в его логах, а потом уже искать проблемы конфига.
avatar
Кто бы спорил :)
avatar
Отличный шаблон, а цветовая схема понравилась здесь webtown.by. Вопрос как шаблон работает на Alto? много ли нужно менять для него?
avatar
Спасибо. Без понятия, с Альто не работал.
avatar
Приятный шаблон. Семантика понравилась.

Хочу взять его за «болванку» для нового сайта.
Или может можешь подсказать шаблон, с отсутствующим дизайном. Главное чтоб структура была. Есть свой дизайн, нужно только «натянуть» его на шаблон ls :)
avatar
Спасибо.

Или может можешь подсказать шаблон, с отсутствующим дизайном.
А в этом шаблоне его практически и нету, пара мелочей только.
Ну или можешь этим шаблоном воспользоваться, большего ничего такого на глаза не попадалось, на сколько помню.
avatar
спасибо
avatar
Тоже установил шаблон и удивился — иконки не отображались. Просто перекачал папку с Font Awesome и сразу заработало. Качал отсюда — fontawesome.veliovgroup.com
avatar
кеш после установки шаблона чистили?
avatar
Со стандартного браузера (Galaxy Nexus) невозможно открыть спойлер профиля
avatar
а если попробовать открыть в самом бутспрапе twitter.github.io/bootstrap/components.html#navbar работает или нет? у меня, к сожалению, нет возможности проверить
avatar

Тут работает
avatar
хм, попробую разобраться
avatar
Отличный шаблон, а где нужно внести изменения чтобы меню корректно отображалось в altocms? Просто ссылки Коллективные, Персональные, Лента похоже что прописаны в шаблоне
avatar
Спасибо. С альто не работал, так что даже не представляю в чем там проблема.

А за вывод названных ссылок отвечает файл menu.blog.tpl и надо либо править его, либо отключать его вывод в шаблоне, либо менять на свою менюшку.
Например, для главной страницы меню подключается в файле actions/ActionIndex/index.tpl в первой строчке:

{include file='header.tpl' menu='blog' menu_content='blog'}


menu='blog' удаляем или меняем на свое (в случае, если желаете вывести какое-то свое меню).
avatar
У меня на Альто вообще выдает ошибку «Exception: Can not find the template „actions/ActionIndex/index.tpl“
See details in error.log» ((
avatar
А все))) Понял, это я затупил и распаковал папку в папку))
avatar
Поставил его на altocms и наблюдаю противную хрень: при открытии топика — он скролится к форме комментов. Почитал про плагин native, но его не стоит. Измучился, но так и не нашел как поправить. Может знает кто, оч был бы признателен.
avatar
Может другие какие плагины? На чистый двиг не пробовали ставить?
avatar
… шаблон можно было максимально изменять через страницу кастомизации Бутстрапа. Т.е. теперь можно пройти по указанному адресу, задать необходимые Вам параметры, скачать Бутстрап, перезалить его в шаблоне и получить изменненный шаблон
Подскажите, где почерпнуть об этом подробную информацию?
avatar
Так там все просто: переходите по указанному адресу и задаете необходимые Вам параметры.

К примеру:
1. цвет ссылок вы хотите #ff0000 — в секции «3. Customize variables» в Links > @linkColor ставите желаемый цвет #ff0000
2. высоту навбара вам захотелось 50px — в секции Navbar > @navbarHeight ставите 50px
3. с остальными полями — по аналогии

Далее жмете большую кнопку «Customize and Download» и скаченными файлами перезаписываете аналогичные файлы в шаблоне и в итоге получаете немного измененный шаблон у которого цвет ссылок красный и высота навбара 50пикс.

В общем, поэкспериментируйте со значениями полей и посмотрите как изменяется шаблон.

Да, кстати, можно воспользоваться и готовыми темами с сайта bootswatch.com/ — просто скачать готовый bootstrap.min.css и перезаписать его в шаблоне.
avatar
Как я понял, тулбар все время прижат к правой границе окна браузера. Поэтому на определенных ширинах наезжает на сайдбар. Можно ли его прижать к правому краю сайдбара (как в synio)?
Там вроде это реализовано с помощью js…
avatar
Можно, надо смотреть как это сделано в synio — там правка js и css, так сразу не скажу, но здается мне, может быть заморочка с тулбаром в одном случае — когда уменьшается ширина окна и он въезжает под хедер…
avatar
Dropdown-иконка располагается справа, меню — слева:

При диагонали девайса ~ более 5" становится не совсем удобно — тыкаешь справа, выбираешь слева.
Хотел предложить переместить иконку тоже влево, имхо так будет удобнее.
Или это будет противоречить bootstrap?
avatar
выбирать слева необязательно — менюшка растягивается на всю ширину экрана
avatar
имхо, рука юзера все рано будет тянуть к тексту…
avatar
ну так уж сделали разработчики Бутстрапа — навбар это стандартный компонент Бутстрапа…
да и мой шаблон больше девелоперский — так что для себя Вы можете переделать его как душе угодно…
avatar
На определенных ширинах паддинг меню и того что ниже разный:


В других случаях — норм:
avatar
имхо, если это решить — решится и это:
может быть заморочка с тулбаром в одном случае — когда уменьшается ширина окна и он въезжает под хедер…
avatar
попробуйте…
avatar
это тоже на уровне Бутстрапа — при уменьшении окна до определенного размера меню сворачивается, а навбар растягивается на всю ширину окна и становиться плавающим, размер этот тоже можно на странице кастомизации изменить

Навбар можно и не использовать — переписать header_top.tpl и будут Вам одинаковые отступы, а можно и просто сворачивание навбара отключить… но в любом случае Вам надо будет что-то придумывать с меню…
avatar
Подскажите, а почему нельзя сделать так чтобы шрифт размещался непосредственно в папке шаблона?
avatar
Если в конфиге включено слияние файлов css, пропадают иконки, см. первые комменты.
avatar
vOFFka Можете пожалуйста адаптировать шаблон под altocms.ru? Так то шаблон работает, но в меню есть какие то лишние ссылки
avatar
Такой же шаблон на основе bootstrap есть и для alto, там разница небольшая.
avatar
В ближайшее время — нет, занят.
avatar
Куда и сколько слать донейт, чтобы снять копирайты?
avatar
Снять мой копирайт можно за донейт от 10уе.

Пока в каталоге нет доната, можно сюда: Z052553710779
avatar
Сделал все что мог для того, чтобы шаблон можно было максимально изменять через страницу кастомизации Бутстрапа. Т.е. теперь можно пройти по указанному адресу, задать необходимые Вам параметры, скачать Бутстрап, перезалить его в шаблоне и получить изменненный шаблон. Правда, останется еще изменить цвета голосований и некоторые фоны руками.
К шаблону прикручен иконочный шрифт Font Awesome. А это значит, что теперь цвет и размер иконок можно менять простым css. Плюсы и минусы можно почитать, например, в этой статье.
Шаблон обзавелся тремя простенькими темами: дефолтная — с чистым css файлом, тема с отступами у основных областей (это если надо, к примеру, задать фон сайта) и тема без отступов (если фон сайта однородный). На самостоятельные темы не тянут, но примером послужить могут.

Все это снижает ценность шаблона как девелоперского. Ценится максимальная простота, каркас с минимальным набором стилей. Установил 1.0. и понял, что это перебор, легче на базе девелопера верстать. А самая первая версия была неплоха.
avatar
Все версии доступны на гитхабе, ссылки на них есть на странице шаблона в каталоге да и здесь в топике.

А в чем, собственно, перебор?
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.