Создаем сайт на MotoCMS
Наверняка в жизни каждого из нас время от времени появляются знакомые, знакомые-знакомых, приятели и просто случайные встречные с примерно одни и тем же вопросом: «Слушай, а ты не мог бы мне сделать небольшой сайт». Без разницы торгуют ли они мебелью или хотят завести персональный блог, хотят сделать корпоративный сайт или сайт-портфолио — всегда проблемы одни и те же. Как правило мы отказываемся от таких заказов, поскольку не можем предоставить полный спектр услуг и задизайнить и сверстать и запрограммировать. А если соглашаемся, то потом это все выливается в многочисленные переделки, допиливания и мелкие бесплатные правки. Так было раньше, но сегодня в нашей жизни появилась MotoCMS.
Оговорюсь сразу, я всегда очень сомнительно относился ко всякого рода доморощенным CMS-системам справедливо, как мне тогда казалось, полагая, что для нормальной работы сайта хватит обычных Вордпрессов, Джумл и ДЛЕ. А уж тем более, как можно в серьез воспринимать CMSку, которая привязана к флеш сайту.
Хватит! Хватит жить в миру своих собственных стереотипов. Я вам клянусь, это просто круто! Функционально! Юзабильно! Бесподобно! Но где-то, видимо, должен быть спрятан подвох. Его нет! Не верите смотрите сами.
Десять простых шагов и я получаю готовый сайт для клиента.
1. Идем в магазин шаблонов сайтов. Выбираем шаблон под наши цели. Например, нам нужен аккуратный и стильный корпоративный сайт. Средняя цена шаблона с встроенной Панелью управления — около $230 (я в начале даже не поверил, пытаясь найти скрытые платежи — нету)
2. Тестируем функционал. Если нам нужно несколько текстовых страниц, фото, видео и возможность обратной связи с помощью контакт формы — это то, что нам нужно
3. Проходим регистрацию чтобы получить полноценный шаблон с возможностью редактирования и сохранения изменений.
4. На почту, указанную при регистрации, нам приходит письмо и мы, по ссылке, переходим прямиком в нашу панель управления. Сразу русифицируем ее, чтоб можно было лучше понимать о чем идет речь в том или ином пункте меню.
5. Первым делом меняем фон. Для этого нужно просто дважды кликнуть на нем кнопкой мыши. Открывается медиатека, через которую с помощью кнопки «Добавить медиа» вы загружаете изображение фона и добавляете его. Одним нажатием, сразу на все страницы сайта.
6. Мы делаем корпоративный сайт ночного клуба, поэтому фон должен быть соответствующим. Далее, редактируем пункты меню и добавляем новые. Кстати, все пункты меню собраны в один объект — его можно тягать по всей рабочей поверхности и ставить туда, куда вам захочется, при этом поворачивая вокруг своей оси...Даже вот так:
Кликаем дважды на области меню и переходим в редактор страниц. В нем можно изменить все надписи уже существующие на кнопках.
Редактируя тексты на кнопках можем форматировать их практически как угодно, для этого появляется удобный встроенные редактор.
Как только существующие названия страниц будут отредактированы мы поймем, что нам катастрофически не хватает еще пары. Например, в пункте меню «О клубе», помимо диджеев и танцовшиц, мы хотим добавить еще пару слов о администрации клуба и сделать отдельный пункт меню «Для поставщиков», что получить самые хорошие цены на фрукты и водочку.
Нет ничего проще, выходим в основной режим Панели управления и жмем кнопку «Создать»
После того, как страницы созданы их нужно добавить в меню. Возвращаемся в блок редактирования меню и нажимаем кнопку «Добавить элементы меню»
Справа поля, которые мы редактируем. Добавляя при этом страницы либо отдельным пунктом меню, либо в подменю.
7. Начинаем редактировать расположение блоков на странице и контент. Тут я обнаружил небольшой глюк или просто еще до конца не понял как тут все устроено, но для того, чтоб блоки выглядели вот так:
В админке мне пришлось подвинуть меню, хрен пойми куда:
Ну, то такое — главное работает:)
8. Содержимое страниц. Меняется очень легко. Выбираете в верхней строке меню какую именно страницу хотите редактировать
Дальше, дважды кликаете на заголовок или текстовое поле и редактируете его. Это делается очень просто - как текст в ворде. При этом вам доступны все стандартные опции форматирования текста и добавление эффектов
Кроме текста вы можете добавлять на любую страницу фото, видео, флеш, различные фигуры, слоты и модули. Я не удержался и вставил на страницу «О клубе» видео.
При этом, вы можете вставлять, с помощью этого виджета, как видео файлы так и ролики с Ютуба. Для этого дважды кликаем на изображении видеоплеера и выбираем нужные нам опции.
Три щелчка и видео уже у нас на сайте
Таким же образом редактируем остальные страницы добавляя или убирая нужный нам функционал. Например, сразу указываем все вакансии в разделе «Работа», которые будут открываться в отдельных всплывающих окнах (я мог выбрать открытие по внешней ссылке или открытие новой страницы).
Также используем доступный функционал и даем возможность пользователям бронировать столики прямо с сайта.
9.Все готово! Блин, чуть не забыли самое главное — логотип. Пусть наш клуб будет называться «Пена». Мне повезло и даже название тут редактируется двумя нажатиями клавиш.
10. Наслаждаемс своим твореньем или срочно сохраняем и бежим показывать заказчику. Вот тут очень сладкие два момента.
Как я понял, демо-версия действует 30 дней. Можно вносить любые правки и сохранять их, при этом еще не заплатив за шаблон ни копейки
То есть, получается, сайт сделали, с заказчика деньги получили, а только потом оплатили шаблон и перенесли его на нормальный хостинг.
Второй приятный момент. Панель управления очень, я бы даже сказал, интуитивно понятна. Все изменения, которые вы видели заняли у меня примерно 3-4 часа. Значит клиенту можно сдать сайт и пусть себе дальше сам в нем копается не отвлекая нас по пустякам.
А мы тем временем найдем себе еще парочку заказов:).
_gaq.push(['_setAccount', 'UA-21136901-1']);
_gaq.push(['_trackPageview']);
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();