Пользователь
0,0
рейтинг
14 октября 2012 в 02:22

Разработка → Подборка полезного для любителей Twitter Bootstrap

В подборке сервисы, плагины, темы и другие полезности, облегчающие работу с Twitter Bootstrap.

Стилизация


BootSwatchr — быстрая стилизация Twitter Bootstrap.



StyleBootstrap.info — похожий сервис. Еще один аналог — Bootstrap Generator.



Beautiful Buttons for Twitter Bootstrappers — генератор красивых кнопок.



Twitter Bootstrap Button Generator — аналогичный сервис.



Lavish — создание цветовой схемы для Twitter Bootstrap на основе любого изображения.



Jetstrap — онлайн создатель интерфейса на Bootstrap (добавил MechanisM).

Темы


Bootswatch — бесплатные темы, также есть Wrapbootstrap с премиум темами.



Wordpress Bootstrap — бесплатная тема для WP. Еще несколько: BootstrapWP, Roots, Bootstrap, Bootstrap for Wordpress, StrapPress, Alien Ship.



jQuery Mobile Boostrap — мобильная тема.



Плюшки


Twitter Bootstrap Photoshop Template PSD — UI для Фотошопа.



Bootstrap PSD — аналог предыдущего.



Font Awesome — специальный иконочный шрифт.



FB Bootstrap — Twitter Bootstrap в стиле Фейсбука. Также есть в стиле Kickstarter, Google и Windows 8.



Дополнения


Colorpicker и Datepicker для Twitter Bootstrap.



Date Range Picker — выбор даты как в Google Analytics (добавил Никита Шулипа).

jQuery File Upload — файловый загрузчик (добавил Никита Шулипа).

Bootstrap Image Gallery — фотогалерея.



WYSIWYG редактор для Twitter Bootstrap.



BootBox.js — небольшая js-библиотека для создания красивых всплывающих окон.



Notifications — аккуратные и простые уведомления (добавил MechanisM).

Bootstrap toggle buttons — классные кнопки-переключатели (добавил MechanisM).

Bootstrap Carousel Animate — js-фолбэк карусельной анимации для браузеров, не поддерживающих CSS3-переходы (добавил tigerforce).

Editable — быстрое редактирование контента на странице.

BootstrapX — плагин, расширяющий функционал встроенного popover (добавил alphard).

Twitter bootstrap UI как модуль для Drupal.

MooTools для Twitter Bootstrap.

Bootbox для удобного подключения Rails 3 (добавил Bonch)

Разное


Перевод официального сайта на русский язык (добавил tigerforce).

Сниппеты для Twitter Bootstrap, обсуждение на хабре.

Built With Bootstrap — галерея сайтов на Twitter Bootstrap.

Yii Bootstrap — удобная связка Yii фреймворка и Twitter Bootstrap.

PS Если вы знаете еще какие-то полезности для Twitter Bootstrap — пишите в комментариях или в ЛС, добавлю в пост.
@grokru
карма
405,0
рейтинг 0,0
Реклама помогает поддерживать и развивать наши сервисы

Подробнее
Реклама

Самое читаемое Разработка

Комментарии (58)

  • +6
    Восторг просто. Спасибо за работу
    • 0
      +1. Огромное спасибо. Надеюсь с выходном подобных сервисов пост будет обновляться
    • –1
      и я там тоже!
  • +2
    Если на то пошло, то Yii Booster тоже стоит упомянуть, как по мне, то он лучше обычного bootstrap для Yii.
  • +2
    Дайте-ка я вас обниму, любезный!
  • +5
    • +1
      Огромное спасибо за ссылку, отличная штуковина =)
    • +1
      Это есть на WrapBootstrap: Unicorn Admin ($18).
      • 0
        Unicorn Admin можно использовать бесплатно для open source проектов?
        Если я сделаю web-движок с использованием Unicorn Admin, я должен купить 1 лицензию, или лицензию должны покупать все пользователи кто будет использовать мой web-движок?
  • +1
    github.com/tanraya/bootbox-rails — bootbox для удобного подключения к Rails 3
    • 0
      для удобного подключения к rails 3 лучше использовать вот это: github.com/seyhunak/twitter-bootstrap-rails
      • 0
        Не спорю, но я говорю про bootbox
  • +1
    Прямо пост добра какой то, жгуче охота плюсануть и автора и топик.
  • –3
    Сам twitter bootstrap: twitter.github.com/bootstrap/index.html :)
  • +3
    Мне понравился BootMetro — интерфейс сделанный на основе Twitter Bootstrap под Win8 Metro.
    Еще есть под Google+ — Plusstrap.
    Уведомления bootstrap-notify.
    Еще какие-то встречал но ща не упомню их.
    • 0
      Опа, спасибо. BootMetro как раз то, что искал.
      • +3
        Оно достаточно кривое, и не очень пригодно для практического использования. :(
    • 0
  • +10
    Не знаю писали об этом на хабре или нет, но ребята кто делал Twitter Bootstrap — Mark Otto & Jacob Thornton сказали что уходят из твиттера и создают свою организацию вокруг Twitter Bootstrap.
    • +5
      Все правильно делают.
  • +1
    Имею вопрос. Мне одному бутстраповские JS-модули показались недоделанными и неоттестированными? Судя по багтрекеру с тем же Modal у всех одинаковые проблемы (включая меня), и они не решаются годами.
    • НЛО прилетело и опубликовало эту надпись здесь
      • +2
        Ошибся, 11 месяцев багу.
        Время течет медленнее, чем мне казалось.

        Баг пометили «Closed. Feature
    • 0
      А в чём проблема?

      Сам вызов прост:

          <!-- Button to trigger modal -->
          <a href="#myModal" role="button" class="btn" data-toggle="modal">Do something</a>
       
          <!-- Modal -->
          <div class="modal hide" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
              <h3 id="myModalLabel">Modal header</h3>
            </div>
            <div class="modal-body">
              <p>One fine body…</p>
            </div>
            <div class="modal-footer">
              <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
              <button class="btn btn-primary">Save changes</button>
            </div>
          </div>


      Проверено на Drupal7
      • 0
        А как вы задаете ширину попап-блоку? :) Допустим, 900px.
        • 0
          Тоже нет ничего сложного: переопределите стиль в своей теме:
          .modal {
            width: 900px;
          }
    • +1
      Блин… я делаю что-то похожее на Jetstrap… Видимо бросать надо
      • +2
        Ни в коем случае. Вдруг у вас получится лучше?
        • +1
          Планирую-то лучше ) но и они вряд ли сидят без дела, так что… не знаю, надо подумать
          • +1
            Я лично так и не смог в этом JetStrap'е ничего сделать… Уже все браузеры перепробовал — все равно ерунда получается… В IE9 вообще видимо никем не проверялась :-)
            • 0
              FireFox относительно работает…
      • 0
        Хех. И я тоже делаю. Мне вот jesttrap неудобен совсем.
  • 0
  • 0
    А есть ли примеры tree и grid на Bootstrap?
  • +3
    Bootstrap нравится мне всё больше и больше. :)

    До знакомства с Django, написание серверного кода требовало таких затрат времени и сил, что на фоне этого сложности с ковырянием в HTML/CSS (и проблемы с сопровождением получившего в результате говнокода) не особенно выделялись. Но уже почти год сервер-сайд пишется легко и просто, и отсутствие столь же мощных средств для быстрого создания UI стало реально напрягать.

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

    Как видно из моих комментариев к нему, особого энтузиазма насчет такого решения у меня не было, но первый же проект с использованием Bootstrap изменил моё мнение сразу и безоговорочно. :) Спасибо, igoravr.
    • 0
      Думаю, список можно пополнить маленькой полезностью для bootstrap-форм на Django: django-bootstrap. В наборе BootstrapMixin, BootstrapModelForm, BootstrapForm. В сочетании с django-widget-tweaks очень помогло оперативно исправить запоротый дизайн для одного проекта.
  • 0
    Простите, а есть что-то похожее на Editable, только не привязанное к bootstrap?
  • +1
    На Themeforest'е довольно много тем для бутстрапа качеством заметно выше, чем на wrapbootstrap. Как раз сейчас там проходит конкурс шаблонов, использующих фреймворк.
    На Codecanyon'е есть некоторое количество плагинов.

    http://bootstrap.veliovgroup.com/ — перевод официального сайта на русский.
    Bootstrap Carousel Animate — js-фолбэк карусельной анимации для браузеров, не поддерживающих CSS3-переходы.
  • +2
    Половина ссылок в этом посте и комментариях фиолетовые, т.к. неоднократно уже обсуждались на хабре. За вторую половину спасибо.
  • 0
  • НЛО прилетело и опубликовало эту надпись здесь
  • 0
    для Yii недавно вышел YiiBooster, который включает в себя лучшие расширения (в т.ч. yii-bootstrap) а также задает костяк проекта.
    • 0
      Я выше там подметил)
  • +1
    Мои благодарности автору!
  • 0
    Вот ещё ссылочка
  • 0
    Огромное спасибо автору и участникам обсуждения.
  • 0
    Вот ещё форк бутстрапа с некоторыми интересными плюшками.
    • +1
      Я тут уже указывал его.
  • 0
    Сниппеты bootsnipp.com.
  • 0
    Думаю теперь к посту можно добавить maxmertkit
  • 0
    Недавно появился еще сайт по бутстрапу на русском, в основном там качественный перевод полезных анлийских статей — в помощь русскоговорящим разрабам любящим Bootstrap — bootstrap-ninja.ru
  • 0
  • 0
    Bootstrap.php библиотека помощник построение компонентов Twitter Bootstrap с помощью php

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