Как получить адаптивный шаблон для будущего сайта, а с ним интуитивно понятную и шуструю CMS в придачу

14 Декабрь, 2015

Здравствуйте, уважаемые читатели блога KtoNaNovenkogo.ru. Основная проблема многих бесплатных (и даже платных) CMS состоит в том, что у них довольно высокий порог вхождение. Например, лет семь назад, когда я впервые столкнулся с Joomla, то у меня на изменение цвета ссылки в меню ушло полдня (причем это уже после изучение курса по этому движку). Многих это отпугивает (хотя лично я тащился от этих ребусов) и они либо идут в студию, либо находят конструктор, где все для «младенцев», но итоговый код и скорость работы оставляют желать лучшего.

Но ставить крест на CMS новичкам все же не стоит, ибо есть очень приличные компромиссные решения, когда все вроде бы с ходу понятно, и одновременно, с точки зрения технической оптимизации (скорость, чистота кода), придраться не к чему. Например, Сергей Сосновский приводит скриншот (в самом конце статьи) с отличной оценкой Гуглом сайта, созданного на движке MotoCMS 3. А ведь это движок из разряда Drag&Drop, когда все элементы сайта таскаются мышью.

Шаблоны от TemplateMonster с MotoCMS 3 внутри

Собственно, из статьи Сергея я и узнал, что сейчас в TemplateMonster (крупный, если не крупнейший производитель профшаблонов для разных движков) идет акция именно на шаблоны для MotoCMS 3 (40%, как я понял, но только до конца сегодняшнего дня). В состав шаблона входит и сама CMS (это фактически надстройка над шаблоном, позволяющая его перелопачивать под свои хотелки с помощью мышки и раскладывать контент по страницам). Ну, как тут устоять и не купить, а потом не написать под это дело пост.

MotoCMS 3 и шаблоны для нее (с ней) в TemplateMonster


ЦМСка в купе с шаблонами от Монстров заточена сугубо для самостоятельной работы над сайтом неопытного (или сильно обленившегося) юзера. Она окажется очень кстати например для начинающих бизнесменов, которые не хотят зависеть от веб-студий внося правки по сайту, ведь все можно делать самостоятельно (таская все мышкой) без погружения в дебри.

Можно с успехом создать за относительно короткое время сайт-представительство с профессиональным, современным и адаптивным ко всем видам устройств просмотра дизайном (это очень важно для успешного продвижения). Если вы вебмастер, то можно подкинуть «умный шаблон» своим знакомым, которые уже плешь проели по поводу: «когда ты нам сайт сделаешь». Вариантов много, а скидка заканчивается...

Сама по себе MotoCMS ориентирована в основном на создание сайтов-визиток (хотя у нее и имеются виджеты корзины и другие возможности создания простеньких и очаровательных интернет-магазинов). На конференции TemplateMonster было хорошее выступление представителя MotoCMS, которое называлось «Сайты-визитки спасут мир»:

Еще раз хочу акцентировать ваше внимание на необычность ситуации с покупкой шаблона. Наверное все вы привыкли, что шаблон представляет собой расширение, которое устанавливается в размещенный на вашем сайте движок (ЦМС).

В случае же с MotoCMS все практически наоборот. Вы покупаете шаблон и вместе с ним идет в комплекте панель управления сайтом (движок, то бишь админка) и набор виджетов, имеющихся в данном шаблоне (похоже на пакеты «быстрый старт» при покупке платных шаблонов для Joomla).

Шаблон включает движок MotoCMS

При этом сам движок MotoCMS можно будет обновлять бесплатно по мере выхода новых версий прямо из админки, и там же можно будет делать бекапы сайта. Но вот на другом сайте (с другим доменным именем) эту ЦМС и купленный шаблон уже использовать придется заново активировав (перенос можно делать не более 10 раз).

После покупки шаблона вам нужно будет найти подходящий по параметрам хостинг (с PHP версией 5.3 или 5.4, включенным Zend Guard Loader и с поддержкой баз данных MySQL), загрузить туда по ФТП полученные файлы с ЦМС и шаблоном, после чего подключить домен к сайту путем прописывания адресов ДНС серверов у регистратора доменных имен.

В общем все как всегда, а если последняя пара предложений показались вам галиматьей, то непременно ознакомьтесь с моей публикацией на тему выбора хостинга, доменного имени и связи ip адреса и доменного имени посредством ДНС серверов (вам понравится).

В принципе, долго и витиевато описывать возможности данной ЦМС будет излишним, ибо имеется возможность вам протестировать работу с ее админкой что называется в живую. Для этого нужно всего лишь взять на время (попользоваться) один из пары сотен имеющихся на TemplateMonster шаблонов для MotoCMS 3 .

Шаблоны для MotoCMS 3 в TemplateMonster

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

Справа расположены фильтры, позволяющие быстренько подобрать то, что лучше всего может подойти под решение наших задач. Чтобы выбрать категорию и искать только среди шаблонов, предназначенных для MotoCMS 3, удобно использовать расположенный чуть ниже инструмент для фильтрации подходящих «шкурок»:

Поиск шаблонов

Под каждой превьюшкой шаблона есть кнопочка «Демо», которая вас перебросит на новую вкладку браузера, где (о чудо!) вы узреете данный шаблон в действии (натянутым на сайт). Можно будет познакомиться с его возможностями, что называется в динамике.

Как будет выглядеть сайта на Мотоцмс на экране гаджета

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

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

Как бесплатно взять шаблон(ы) «на попользоваться»?

На бесплатный тест каждого из них дается две недели . За этом время можно уже буквально создать полностью весь сайт, и если результат вас поразит, то и не грех будет его активировать купив лицензию (все созданное непосильным трудом, естественно, сохранится в целости и сохранности). Однако напомню, что до конца 14 декабря действует 40% скидка на все эти пару сотен шаблонов. Если успеете себе что-то подобрать, то сможете существенно сэкономить (чуть ли не в половину цены снижены).

Взять шаблон на бесплатный тест можно, кликнув по его картинке (превьюшке, расположенной на странице просмотра шаблонов для MotoCMS 3). Откроется «карточка товара», где наравне с кнопкой «Купить» вы сможете наблюдать и кнопку «Бесплатно тестировать шаблон в течении 14 дней»:

Бесплатный тест шаблона на TemplateMonster

Обратите внимание на скидку (я обратил настолько, что купил). Но мы о тестовом доступе говорили. Если находясь в шоке от увиденного (надеюсь, в хорошем смысле этого слова) вы чуток помедлите, то взять шаблон на бесплатный тест вам предложат чуть ли не силой (появится всплывающее окно, которое также появилось бы, нажми вы оранжевую кнопку соглашаясь на бесплатное тестирование):

Бесплатно тестировать шаблон MotoCMS 3 от TemplateMonster

Вам придется подтвердить свой номер телефона (кодом из СМСки) и указанный Емайл, после чего на него (на Емайл) вам придет письмо с логином и паролем для доступа в ваш личный кабинет, где уже будет лежать выбранный вами для тестового доступа шаблон с указанием оставшегося бесплатного периода (у всех остальных шаблонов MotoCMS 3, взятых вами на TemplateMonster для тестирования, будут в этой же админке указаны свои сроки, что довольно удобно):

Личный кабинет MotoCMS 3

Шаблон автоматом ставится на хостинг МотоЦМС, где его можно начать редактировать и создавать по сути на нем сайт (создавать структуру, наполнять контентом, тестировать и т.п.). Если в итого все устроит, то после покупки (имеется соответствующая кнопочка на приведенном выше скриншоте) все внесенные вами изменения и настройки перекочуют в файлы шаблона (и движка), которые вы получите в личное пользование (для установки на хостинг). Такая вот замечательная политика максимальной лояльности к клиенту. Похвально...

Установка MotoCMS с шаблоном от TemplateMonster


«Моя» решилась на покупку, процесс которой протекал довольно-таки просто. Потребовалось лишь заполнить формуляр и провести оплату через ПейПал, Вебмани, Скрилл или через обмен в Робокассе (мне кроме основной скидки еще и промо-код получилось использовать). После оплаты мне сообщили номер заказа и посоветовали поискать в своем почтовом ящике письмо от TemplateMonster с ссылкой на страницу, где можно будет скачать купленный шаблон:

Покупка шаблона в TemplateMonster

Правда у меня это письмо в спамм упало, так что если вам письмо от Монстров долго приходить не будет, то ищите именно там. Шаблон без проблем скачался и распаковался.

Как правило, я работаю над новыми сайтами или над внесением изменений в уже существующие (включая этот блог) не на реальном хостинге, а не его заменителе, работающем прямо у меня на компьютере. Раньше мне в этом помогал Денвер, но последнее время я перешел на ОпенСервер. К сожалению, MotoCMS 3 требуется расширение Zend Guard Loader, которого в ОпенСервере нет.

Проблема в MotoCMS 3 на Open Server

Поэтому пришлось изменить принципам и начать работу над сайтом на реальном хостинге, благо, что имеется возможность добавить новый сайт на уже имеющиеся мультитарифы. Но не суть... Процесс установки шаблона от TemplateMonster (а точнее ЦМСки MotoCMS 3, в которой уже будет зашит купленный шаблон, ибо так будет правильнее) проходит достаточно традиционно.

Как обычно, нужно будет заранее позаботиться о создании на хостинге новой базы данных MySQL, например, с помощью PhpMyAdmin, т.к. Мото 3 уже работает с базами. Когда с этим справитесь, заливаете в корень сайта по ФТП файлы полученные от Монстров и открываете сайт в браузере (введя его временное или окончательное доменное имя — я пока обошелся созданием тестового поддомена).

Мастер установки MotoCMS 3 предлагает выбрать язык интерфейса, после чего идет проверка требования к серверу, которую ОпенСервер не прошел. Обычный хостинг с этим справился:

Проверка сервера на требования для установки MotoCMS 3

Далее вас попросят ввести данные той самой базы MySQL, которую мы чуток выше по тексту создали. В поле хост обычно пишут localhost, но у моего хостера есть специфика. В остальном все традиционно (префикс базы можно не указывать — он вводится обычно для повышения безопасности).

Установка MotoCMS 3

Далее создаем пользователя с правами администратора (просто от балды придумываем имя и пароль, но желательно посложнее пароль задавать и хранить его понадежнее) для доступа к админке сайта. Все, после этого начнется непосредственно установка MotoCMS 3 на наш хостинг. Подождем (внизу отображается индикатор процесса).

Возможности MotoCMS 3


Собственно, самое трудное позади. По сравнению с предыдущими версиями MotoCMS 3 сделал еще шаг вперед. Отличительной чертой является то, что админка по сути является надстройкой над шаблоном и ее пункты расположены вокруг него. Можно прямо на шаблоне выбирать места, которые требуется подредактировать, убрать, заменить, добавить и т.п. (тот самый визивиг — когда содержимое отображается в процессе редактирования).

Админка MotoCMS 3

На сайте TemplateMonster имеется довольно подробный хелп по работе с админкой МотоЦМС со множеством скриншотов, где вы можете ознакомиться с азами конструления (в данной статье невозможно все это охватить, поэтому просто отделаюсь ссылочками на эти материалы). На данный момент там освещены такие базовые вопросы:

  1. В первом уроке (по работе с админкой) говорится о:
    1. Редадактирование и создание меню сайта любой сложности уровня вложенности
    2. Создание новых страниц на сайте, работа над их дизайном и фоном
    3. Работа с медиафайлами необходимыми для сайта (картинками, видео, пдфками, архивами, флешем и т.п.)
  2. Во втором уроке говорится в основном о дизайне, цветовой палитре, шрифтах и стилях текста, кнопках, фоне и т.п. вещах в аспекте всего сайта. Тут закладываются как бы базовые настройки дизайна, если используемые в шаблоне вас чем-то не устраивают.
  3. В третьем же уроке говорится как вставить на сайт под управлением MotoCMS 3 видеоролик, карту от Гугла, социальные кнопки, а также подробно рассказывается про назначение виджетов «Контейнер» и «Ряд».

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

Уместно еще раз упомянуть принцип Drag&Drop (потащил, зажав левую кнопку мыши, что-то и отпустил в нужном месте), ибо именно это является основной фишкой админки данного движка. Перемещать блоки на вебстранице мышью при ее создании — это самый естественный способ для любого человека, а уж для не подготовленного, так вообще единственно возможный. Перетаскивайте объекты, меняйте их расположение, редактируйте, удаляйте прямо на живую...

Конечно же, многое осталось за кадром этого хелпа. Например, на свой сайт можно с легкостью установить счетчик Гугл Аналитикса или же подтвердить права в Гугл Вебмастере на управление данным сайтом.

Аналитика в MotoCMS 3

Также прямо из админки можно будет вставить и любой произвольный код в футер или хедер всех страниц сайта (например, если вы захотите подключить Метрику или любой другой счетчик). Делается это на вкладке «Вставка кода» в настройках, показанных на предыдущем скриншоте. Опять же, не надо будет в коде копаться, чтобы искать файлы формирующие шапку и подвал вашего сайтика. Да, еще можно комментарии от Disqus подключить на самой нижней вкладке настроек.

Для каждой странички сайта можно задать СЕО настройки, то бишь прописать тайтл, дескрипш и кейвордс (последнее не обязательно), а также можно добавить в ее заголовок метатег robots со значениями ноиндекс или нофолоу, если пожелаете. Если нужно запретить формирование метатега canonical, то и сие возможно сделать прямо в окне редактирования страницы (в правом меню область «Настройки SEO»):

Настройки СЕО в MotoCMS 3

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

Многие необходимые на сайте вещи (галереи, слайдеры, карты, видео, кнопки, формы обратной связи т.п.) в MotoCMS 3 добавляются с помощью виджетов, которые найти и настроить под свои нужды вы сможете в разделе «Дизайн» верхнего меню:

Виджеты в МотоЦМС

Медиафайлы (видео и графика) живут в медиатеке (о ней есть отдельный урок на сайте TemplateMonster — см. выше) , где имеется свой редактор изображений (можно изменить яркость, контраст, повернуть, трансформировать или наложить эффект). Также имеется и менеджер шрифтов, что очень необычно для ЦМСок.

В сухом остатке по связке MotoCMS 3 и TemplateMonster

Шаблоны от Монстов, как водится, на высоте. Конечно же, у них есть конкуренты, и не сказать, что Монстры их на голову выше, но все же многие предпочитают именно эту контору (наверное, в том числе и из-за того, чо TemplateMonster готовы в полном объеме отвечать за свой продукт в виде пожизненной тех.поддержки нонстоп — 24/7). Ну, и сами по себе «шабы крутецкие»...

Скринов конкретно для MotoCMS 3 на их сайте имеется реально большое количество. Общее впечатление от дизайна в каталоге весьма на уровне — главное, что нравится лично мне: не перегружено (не теряется нить) и одновременно функционально (просмотр шабов в полный рост доступно простым подведением курсора к превьюшке).

Если говорить по движку MotoCMS 3, то он даже в сравнении с относительно простым в освоении WordPress именно простотой и блещет. Установка не сложнее Вордпресса, но зато знаний Html и CSS не требуется вовсе для создания полновесного проекта (все решается с помощью различных виджетов и настроек админки, сложные моменты в которой снабжены пояснениями, спрятанными под знаками вопроса). Человеку не сведущему в вебстеринге именно с таким движком будет работать проще, чем со ставшими классикой жанра Джумлой и WP.

Благодаря тому, что платите вы фактически только за профессионально отрисованный и напичканный под завязку функционалом шаблон, сам движок выходит вроде как бесплатным, ибо цена скринов для MotoCMS 3 сопостовима со скринами для бесплатных движков от тех же Монстров.

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

Это, например, будет весьма удачным приобретением для начинающих бизнесменов, которые не хотят зависеть от веб-студий внося правки по сайту, ведь все можно делать самостоятельно не прыгая выше головы. Данная ЦМСка позволяет получить профессионально сверстанный сайт с чумовым шаблоном. Наполнять же его новыми материалами или видоизменять сможет любой человек знакомый с навыками работы на компьютере. Не надо будет опять же обращаться потом в студию или к частному вебмастеру, чтобы добавить еще одну страницу, изменить текст или вставить картинки в слайд-шоу. ИМХО.

P.S. Так уж получилось, что о большой скидке на шаблоны я узнал довольно поздно, и пока писал статью, время отведенное для покупки почти истекло. Но «почти» не значит совсем (еще до вечера есть время). После того, как зайдете на страницу со скринами для MotoCMS 3, обратите внимание на баннер, появляющися в самом верху страницы — там будет показано, сколько времени еще осталось:

Скидка на шаблоны

Удачи вам! До скорых встреч на страницах блога KtoNaNovenkogo.ru

Подборки по теме:

Комментарии и отзывы

ТолькоSEO

Шабы у них красивые, этого не отнять

Алексей

Здравствуйте!

Как Вам шаблон?

Подписаться не комментируя