Не нравятся результаты поиска? Попробуйте другой поиск!
dle-faq.ru Блог Бесплатный шаблон BS3-TCSE для DLE 10.3

Бесплатный шаблон BS3-TCSE для DLE 10.3


 tcse    08.01.2015    Блог    7400    17

Бесплатный шаблон BS3-TCSE для DLE 10.3


Подарки под Елочку не обязательно класть прямо 31 декабря, очень даже к месту будет в течении новогодних каникул. В прошлом году, мы подарили Хак Mob_TPL и Модуль обратный звонок, а в этом базовый шаблон на основе bootstrap 3 для всех пользователей DataLife Engine.

Шаблон адаптивный, минимальный правки исходного кода Bootstrap 3.
- Оптимальное отображение на мобильных устройствах и настольных системах.
- Официальные CDN для CSS и JS библиотек.
- Иконки проекта fontawesome, лекое внедрение в любое мечто шаблона.
- Модальные окна bootstrap для вывода произвольной информации.
- Шаблон для DataLife Engine 10.3

Основное применение данного шаблона:
- Базовый адаптивный каркас для ваших проектов.
- Легкая верстка в дальнейшем (так как переставить блоки под ваши нужды в рамках сетки bootstrap не составляет проблем даже для начинающего верстальщика).
- Поддержка ВСЕХ возможностей фрейморка прямо в шаблоне.
- Дописав свои стили, вы легко сможете добавить индивидуальности своему проекту.

Шаблон бесплатный, распространяется на условиях "как есть".
Если у Вас возникли вопросы, оставляйте их в комментариях.

Адаптивная сетка bootstrap 3
В зависимости от ширины экрана браузера - отображает контент оптимальным способом.

Очень маленькие устройство Телефоны (<768px)
Бесплатный шаблон BS3-TCSE для DLE 10.3


Малые устройства Планшеты (≥768px)
Бесплатный шаблон BS3-TCSE для DLE 10.3


Средние устройства Настольные (≥992px)
Бесплатный шаблон BS3-TCSE для DLE 10.3


Большие устройства Настольные (≥1200px)
Бесплатный шаблон BS3-TCSE для DLE 10.3


Модальные окна
В качестве примера работы базовой версии bootsrap реализовали вывод формы добавления комментариев на сайт и панель авторизации через модальные окна.
Бесплатный шаблон BS3-TCSE для DLE 10.3


Бесплатный шаблон BS3-TCSE для DLE 10.3


Полезняшки
- Для меню сайта в шапке и подвале предусмотрены отдельные TPL файлы.
- Пагинация автоматически подстраивается под ширину страницы (удаляет лишние кнопки в случае маленькой ширины)
Бесплатный шаблон BS3-TCSE для DLE 10.3

Бесплатный шаблон BS3-TCSE для DLE 10.3


- Готовые блоки для отображения рекламы на сайте. Как внутри шаблона полной новости fullstory.tpl так и в боковой панели sidebar.tpl
Бесплатный шаблон BS3-TCSE для DLE 10.3



Исходники:
В основе фреймворк twitter bootstrap 3
Набор иконок fontawesome.
Хорошая русская документация по Bootstrap 3.
Генерация картинок-заглушек, проект img.base64-image.ru

Официальная страница поддержки tcse-cms.com

Скачать шаблон BS3-TCSE (utf-8) [160,57 Kb] (cкачиваний: 315)
Скачать шаблон BS3-TCSE (windows-1251) [155,52 Kb] (cкачиваний: 254)
Отредактировал 9-01-2015, 22:55 - ПафНутиЙ
Причина: Добавил архив с windows-1251

Комментарии пользователей (17)

Gameer
224

1118 | 394

Gameer - 8 января 2015 00:56 - Эксперт

Спасибо за подарок. Отличный вышел шаблон на основе бутс. Как раз то что надо : простой, красивый и оптимизированный!

Истина в противоречии.​

tcse
1

39 | 22

tcse - 9 января 2015 20:31 - Юзер

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

ПафНутиЙ
1064

3393 | 2433

ПафНутиЙ - 9 января 2015 22:56 - Админ

Добавил архив с 1251

Каков вопрос - таков и ответ. Просто помните об этом.

sadan
16

107 | 38

sadan - 9 января 2015 20:39 - Юзер

Думаю для bootstrap-а по русски здесь bootstrap 3

tcse
1

39 | 22

tcse - 9 января 2015 22:51 - Юзер

sadan, документация не к bs3 а непосредственно к dle-шаблону.
Например, описание того как изменить оформление блоков краткой новости или описание болванки для произвольного модального окна.

ufh2
175 | 3

ufh2 - 11 января 2015 00:03 - Юзер

Спасибо. Кстати файлы registration.tpl , lostpassword.tpl пустые)

ufh2
175 | 3

ufh2 - 12 января 2015 00:53 - Юзер

Да и еще несколько пустых, это не страшно но всеже

tcse
1

39 | 22

tcse - 12 января 2015 18:59 - Юзер

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

Кроме того, пустые шаблоны будут описаны в примерах (документации).
Осталось найти врем на составления документации.

shmel1985
2

146 | 63

shmel1985 - 24 января 2015 17:58 - Юзер


После нажатия быстрое редактирование вот что получается, и окно не появляется в чём проблема?
Также при добавлении комментария при нажатии на смаил вот что получается

shmel1985
2

146 | 63

shmel1985 - 24 января 2015 20:21 - Юзер

Ребят помогите пожалуйста решить проблему.

kyvrsant
6

kyvrsant - 20 февраля 2015 15:35 - Юзер

подскажите пожалуйста как настроить вывод статических страниц в этом шаблоне.
У меня не хочет выводить. пишет что ошибка контент отсутствует или мало прав.

kyvrsant
6

kyvrsant - 22 февраля 2015 00:06 - Юзер

kyvrsant,
Нашел решение своей проблемы. В этой темы просто пустой static.tpl.
Я вставил static.tpl с стандартного ДЛЕ шаблона и заработало!

tcse
1

39 | 22

tcse - 23 февраля 2015 21:50 - Юзер

kyvrsant,

можно стандартные теги статической страницы обернуть тегами от bootstrap 3

что-то подобное


<div class="panel panel-default">
          <div class="panel-heading">
                <h1 class="panel-title">{description}</h1>
          </div>
    <div class="panel-body">
                        
        <div class="row">

            <div class="col-xs-12 col-sm-12 col-md-12">
                          <div class="full-content">{static}</div>
                          <div align="center">{pages}</div>
            </div>
        </div>
    </div>
</div>



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

shmel1985, правка в коде шаблона:
в main.tpl
найти и удалить

<!-- jQuery (necessary for Bootstrap's javascript plugins) -->
        <script src="https://ajax.googleapis.co
m/ajax/libs/jquery/1.11.1/jquery.min.js
"></script>


Ребята, вы хоть попробуйте открыть ссылки из описания к шаблону, я про русскую документацию по бутстрап 3.
Это не шаблон - это конструктор. Буквально 3 правка в шаблоне краткой ноовсти и у вас не плитка, а обычные списки новостей шириной на весь экран.

shoroh
5

shoroh - 20 ноября 2015 22:32 - Юзер

Подскажите, как сделать вывод кратких новостей на Больших устройствах Настольные (≥1200px), как на средних. То есть не каскадом.

tcse
1

39 | 22

tcse - 20 ноября 2015 22:49 - Юзер

внимательно смотрите на кусок кода:

в файле bs3-tcse /shortstory.tpl

ширина блока задается строкой:

<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4 short-news">


где, col-xs-12 это ширина блока с краткой новостью для сверхмалых эранов (для мобилок) (до 767 px)
col-sm-12 ширина для малых экранов (768px - 992 px)
col-md-12 ширина (993 - 1200 px )
col-lg-4 ширина более 1200 px


Стоит помнить что бутстрап делит ширину страницы на 12 колонок.
следовательно надпись col-lg-4 означает, что ширина блока будет 4 из 12 (если экран браузера более 1200 пикселей). 4 из 12 это треть блока, если кому не ясно. 3 из 12 соответственно четверть, а 6 из 12 половина доступной ширины.

следовательно в вашем случае

как сделать вывод кратких новостей на Больших устройствах Настольные (≥1200px), как на средних.


все что требуется это исправить col-lg-4 на col-lg-12

таким образом конечная запись будет такая:

<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 short-news">


Суть ясна?

shoroh
5

shoroh - 20 ноября 2015 22:58 - Юзер

Спасибо большое за разъяснения!

Djinn
2

79 | 4

Djinn - 17 декабря 2015 23:09 - Юзер

Как тут изменить фон страницы и поставить "бордер" для полной новости, что бы фон страницы отличался от фона самой новости?

Чтобы комментировать - войдите или зарегистрируйтесь на сайте