• Современная, быстрая и удобная система управления сайтом
  • 4-е место в рейтинге бесплатных CMS для блогов + добавьте свой сайт!
  • Более 100 тысяч созданных сайтов
  • Постоянное развитие системы. Русскоязычная поддержка
  • Готовые программные решения (плагины, виджеты, модули и т.п.)
  • Открытый исходный код на GitHub
  • SEO-friendly — идеальна для поискового продвижения
  • Минимальная нагрузка. Работает на любом хостинге
  • Автоматическая установка и обновление системы
Возможности | Помощь | Архив | Отзывы | Помочь проекту

Создание шаблонов (версии 0.8x)

Шаблоны для новичков. Урок 17. Базовый шаблон MaxSite CMS. Адаптивный дизайн

Просмотров: 235Комментарии: 2
MaxSite CMSСоздание шаблонов (версии 0.8x)

Настала пора сделать что-то более практичное. Основную теорию мы уже рассмотрели, на её основе попробуем сделать какой-нибудь простенький шаблончик. В предыдущих уроках мы уже обсудили структуру каталогов, но чтобы у нас не было разночтений, я предлагаю скачать мой вариант: les02-00 88. Это что-то вроде «рыбы», которую вы можете взять за основу.

В шаблон я включил свой вариант helpers.less, поэтому делать верстку буду с его помощью. Некоторые миксы могут отличаться от default-шаблона.

Подключение LESS мы уже разобрали, поэтому кратко пройдемся по основным файлам.

  • Главный файл var_style.less. В нём мы только выполняем подключение других файлов.
  • Переменные («глобальные») хранятся в variables.less.
  • Хелперы в каталоге mixins. Пока у нас там только helpers.less.
  • Основные базовые настройки размещаем в base.less.
  • Основная разметка в layouts/layout01.less. Сейчас там пустая «рыба» под «типовой» шаблон MaxSite CMS.
  • Все меню подключаем в menu.less. Стили меню будут находиться в раздельных файлах каталога menus. Их может быть много. В menu.less и будем указывать какие именно файлы.
  • Адаптивный дизайн определяется в responsive.less. У него такая же схема подключения как и меню.

Почти все файлы пустые и не содержат рабочих стилей. Это означает, что на выходе мы должны получить пустой var_style.css.

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

Шаблоны для новичков. Урок 16. Основы вёрстки с помощью LESS

Просмотров: 241Комментарии: 2
MaxSite CMSСоздание шаблонов (версии 0.8x)

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

<div class="red">красный текст</div>
<div class="yellow">желтый цвет</div>

потому что в css-фреймворке уже определено, что

div.red {color: red;}
div.yellow {color: yellow;}

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

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

Шаблоны для новичков. Урок 15. Организация файлов и каталогов

Просмотров: 241Комментарии: 2
MaxSite CMSСоздание шаблонов (версии 0.8x)

Сегодня рассмотрим вопросы организации файлов в шаблоне. По предыдущим урокам в принципе уже понятно, что работать будем с отдельными файлами. Поэтому нужно продумать структуру каталогов, чтобы в неё не заблудиться.

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

Причем, особо отмечу, этот шаблон должен быть 146 100% рабочим. В некоторых случаях вообще можно начинать работу над новым шаблоном в рамках базового. Чуть позже я покажу как это сделать.

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

Шаблоны для новичков. Урок 14. Поблочная вёрстка

Просмотров: 251Комментарии: 7
MaxSite CMSСоздание шаблонов (версии 0.8x)

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

В новом свете есть смысл вернуться к 11 уроку, где я привожу прототип будущего сайта. Принципиальное отличие будет в том, что я всё-таки постараюсь давать поменьше готового кода, иначе мы просто в нём увязнем. Я постараюсь показать саму методику создания шаблонов.

Мы предполагаем, что вы уже можете разбираться в основах HTML, PHP, CSS и LESS. Всё это было в прошлых уроках или отдельных статьях на моём сайте.

Еще важный момент. Я всегда ориентируюсь на последнюю версию MaxSite CMS, которая отмечается как prelatest. Это самая последняя и свежая версия системы.

Впрочем, вернёмся к нашим баранам шаблонам.

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

О проекте

MaxSite CMS предназначена для создания сайтов любой сложности. Система отлично подходит обычным пользователям, вебмастерам, фрилансерам и вебстудиям.