{* *}{strip} {putOtherMeta} {/putOtherMeta} {$title = 'Руководство пользователя' scope=global} {$keywords = '' scope=global} {$description = '' scope=global}
Благодарим за интерес к бесплатному шаблону {themeName}. Его начальная, коммерческая версия создана дизайнером Unvab и разработана nKdev. А бесплатную вариацию вебмастер Максим Пилавов адаптировал для потребителей современных движков и веб-технологий. Поэтому адаптация выполнялась под систему Impera CMS на основе ShortCodes - техника разметки алгоритма генерации контента с помощью простых тегов, расставленных в html-макете таких страниц.
Так как ShortCodes по сути является словарём абстрактных команд, то в каждом движке или шаблоне, использующем эту технологию, подразумевается собственная реализация таких абстракций в рамках внутренних особенностей системы.
В демонстрируемом здесь шаблоне использован билд v.{shortCodesVersion} программной реализации словаря ShortCodes под конкретную CMS, в данном случае Имперу. И этот билд поддерживает следующие команды словаря:
А сам билд представлен файлом helper.php
в шаблоне. Для обновления словаря, то есть поддержки новых команд, следует закачать вместо указанного только что файла новую версию ShortCodes Helper - так называется реализация словаря под имперский движок..
Данную адаптированную версию бесплатного шаблона Snow разрешено использовать на личном сайте. Если вы являетесь вебстудией, частным мастером, фрилансером и тому подобное, - шаблон разрешено использовать на сайте вашего клиента. При этом вы не имеете права:
Поддержка, консультация по бесплатным шаблонам отсутствует. Просьбы что-либо доработать в шаблоне не рассматриваются.
Прежде всего необходимо скачать с официального сайта Impera CMS скрипт установки - это файл imperacms.ru/impera_cms.zip
. Он представляет собой архив, который следует распаковать на свой компьютер. Тогда в папке компьютера, куда развернули этот архив, появятся следующие файлы:
install.php
- непосредственно скрипт установкиImperaCMS_sources.zip
- так называемое ядро движкаЭти два файла необходимо скопировать в корень своего сайта, например с помощью файлового менеджера в панели управления хостингом. Затем нужно открыть в браузере страницу http://ваш.сайт/install.php, после чего следовать инструкциям скрипта установки.
Установка состоит из 5 простых экранов. На одном из них от вас потребуются такие сведения:
Эти сведения вам должен был прислать хостинг-провайдер, когда регистрировали свой сайт.
Чтобы вам было понятно, как это выглядит, мы показали здесь скриншоты экранов установки в том порядке, как они появляются на экране. Вообще говоря, все эти современные движки приятны тем, что всякие технические процессы, считавшиеся ранее трудными и доступные для понимания только матёрым IT-ишникам, теперь сведены к удивительно простым действиям в один-два щелчка.
Когда движок сайта установлен, теперь можно перейти к загрузке шаблона. Сначала его надо скачать в виде архива - это файл imperacms.ru/files/media/Snow.zip
(кому интересно, файловое содержимое архива перечислено в следующей главе).
Далее перейдите в админпанели сайта на страницу дизайн » Дизайны сайта
. Там в правом верхнем углу есть ссылка загрузить, которая относится к блоку Дизайны клиентской стороны. Нажмите эту ссылку.
Откроется окно Загрузка шаблона, где вам надо выбрать тот самый скачанный файл. Нажмите кнопку Начать, и загруженный шаблон появится в списке установленных. Щёлкните по названию шаблона, чтобы сделать его дизайном по умолчанию.
Опять показали скриншот экрана установки, и снова всё выполняется парой простых действий.
Ниже показан листинг папки шаблона. Поскольку сам шаблон является бесплатным и адресован сайтам лишь выставочного профиля, то некоторые макеты торговых страниц, расположенные в подпапке html хотя и присутствуют в его файловой структуре, однако эти файлы исполнены как заглушки. Настоящие, работоспособные экземпляры таких файлов доступны только в коммерческой версии.
Условно шаблон поделен на 5 подпапок. В первой размещаются так называемые стилевые файлы.
{/strip}
css
combined.css{strip}
В следующей подпапке собраны все шрифты, которые используются в дизайне. Очень часто подобные ресурсы, чтобы не хранить их у себя на сайте и не заботиться обновлением, просто подключают с внешних хранилищ наподобие Google Web Fonts. Однако владельцам магазинов как правило не важно обновление шрифтов, а кроме того ценится независимость от сторонних хранилищ. Поэтому копии шрифтов размещают в шаблоне и грузят только со своего сайта.
{/strip}
fonts
fontawesome-webfont.eot
fontawesome-webfont.svg
fontawesome-webfont.ttf
fontawesome-webfont.woff
fontawesome-webfont.woff2
OpenSans-Bold.ttf
OpenSans-Regular.ttf
Pe-icon-7-stroke.eot
Pe-icon-7-stroke.svg
Pe-icon-7-stroke.ttf
Pe-icon-7-stroke.woff
Raleway-Bold.ttf
Raleway-Medium.ttf
Raleway-Regular.ttf{strip}
В следующей подпапке размещены макеты целых страниц или их частей, всяких больших и мелких модулей, емейл- и СМС-уведомлений. Вообще говоря, дробление макетов на серию мелких файликов, содержащих части страниц и отдельно модули, является лишь личным предпочтением верстальщика, который собирает конкретный шаблон. То есть это дело вкуса: одни любят лендинг-подобные схемы сборки "каждой странице - свой макет в шаблоне", другим нравится конструкторо-подобные схемы "один каркас и масса произвольно крепимых деталей".
{/strip}html
abstract
comments.htm «-- содержит заглушку discount.htm manual.htm «-- текст этого макета вы сейчас читаетеmodules
«-- всякие модулёчки body.htm check404.htm comments.htm demo-themes.htm feedback.htm filter.htm news.htm photos.htm product.htm search.htm seo.htm tags.htm use-variable.htmsms
callme-to-admin.htm callme-to-user.htm feedback-to-admin.htm feedback-to-user.htm login-to-admin.htm login-to-user.htm registration-to-admin.htm registration-to-user.htm account.htm «-- содержит заглушку article.htm articles.htm callme.htm «-- содержит заглушку cart.htm «-- содержит заглушку catalog.htm feedback.htm index.tpl «-- тот самый каркас (общий макет страницы) login.htm «-- содержит заглушку missing_template.htm navigation.htm news.htm news_item.htm order.htm «-- содержит заглушку password_remind.htm «-- содержит заглушку price.htm product.htm products.htm registration.htm «-- содержит заглушку search.htm sitemap.htm «-- содержит заглушку static_page.htm helper.php «-- упоминавшаяся реализация ShortCodes email_notifyme_confirm.htm email_order_payment_to_admin.htm email_order_payment_to_user.htm email_order_to_admin.htm email_order_to_user.htm email_password_remind.tpl sms_order_change_to_user.htm sms_order_payment_to_admin.htm sms_order_payment_to_user.htm sms_order_to_admin.htm sms_order_to_user.htm{strip}
Следующая подпапка содержит картинки, используемые в дизайне. В её подпапке demo собраны демонстрационные картинки товаров, брендов, новостей и статей. Такие картинки видны только на демо сайте (или в демо режиме). Они демонстрируются случайным образом при каждой загрузке страницы, чтобы вы могли в общих чертах понять, как выглядит сайт при некотором воображаемом наполнении графикой.
{/strip}images
demo
article-1.jpg ... article-4.jpg brand-1.jpg ... brand-16.jpg manual-module-1.jpg ... manual-module-3.jpg manual-setup-1.jpg ... manual-setup-6.jpg news-1.jpg ... news-4.jpg product-1.jpg ... product-30.jpg about-me-signature.png bg-feedback.jpg bg-home.jpg bg-menu.jpg bg-page404.jpg bg-pattern.jpg bg-search.jpg bg-static-page.jpg favicon.png logo.png logo-light.png map.jpg no-photo.png thumbnail.jpg{strip}
И в последней подпапке собраны браузерные скрипты, то есть та программная логика, которая начинает действовать, когда пользователь взаимодействует с загрузившейся страницей в своём браузере. Это всякие крутилочки, анимашки, баннеры, слайдеры, аккордеон-менюшки и прочие красивые вкусности, которые так нравятся современным пользователям сайта.
{/strip}
js
combined.js{strip}
Как уже говорилось выше, часть вебмастеров любит когда вёрстка шаблона сделана сплошным свитком в одном файле. Их не пугает обилие символов и цифр. Они легко вчитываются в листинг из сотен строчек кода. Они всегда помнят, что где-то тут, например на десятой прокрутке экрана должна быть запись такой-то формы ввода. Отлично ориентируются, даже несмотря на то, что такой листинг порой представляет собой злостный копипастинг - так называют вставку кода в режиме поджимающего времени.
Другие любят схему подобную SSI - широкой общественности известна как вставки на стороне сервера, - когда повторяющиеся блоки вынесены в отдельные файлики-модули и по мере надобности подключаются определённым тегом. Код часто сокращается до нескольких строк. Однако такой подход требует умения мыслить уже не строчками, а блоками.
Например, в шаблоне Snow идентичный по разметке текст вступительного описания выводится и на страницах разделов, и в списке публикаций блога, и в списке обзоров. Так вот там мы поставили тег {modBody}
, а повторяющийся кусок вынесли в файл html/modules/body.htm. Вот распечатка этого файла:
Распечатанный код представляет собой смесь обычных:
{body}
- показать текст, который менеджер ввёл в админпанели как полное описание этой страницыСерым цветом обозначены строки, которые в принципе могли быть удалены, так как играют документационную, оптимизационную роль или выполняют защиту "от дурака" - выключиться если модуль включили не туда.
{* *}
- в таких скобках пишут комментарий для личных целей{strip}
- минифицировать все строки ниже, то есть склеить в одну, удалив пустые строки, символы перевода, ведущие и замыкающие пробелы{modUseVariable}
- подключить в этом месте наш модуль html/modules/use-variable.htm, чтобы он разобрался, а есть ли вообще видимые нам сведения{ifHasBody}
- вывести этот фрагмент, если в доступных нам сведениях присутствует непустой текст описания страницыВообще при создании шаблона или его доработке под себя следует понимать, что система шаблонизации Impera CMS не ограничивает вас в том, из каких частей должен состоять шаблон, будет ли глубоко порезан на модули или монолитным куском, записан ли чистым HTML или смесью тегов.
Например модуль фильтра - это же обычный HTML, смотрите распечатку кода из файла html/modules/filter.htm:
Притом анимационная составляющая работы фильтра обеспечена чудесным плагином jQuery Isotope, а наполнение значениями свойств реализовано с помощью функции initFilter()
, которая помещена в тот же файл скриптов js/combined.js что и плагин Isotope. В сущности работа функции, инициализирующей фильтр, состоит:
Здесь следует сразу же показать, как устроен модуль мини карточки товара - это файл html/modules/product.htm в шаблоне. Вот распечатка этого файла:
Поясним значения тегов, вот эти выводят:
{name}
- название товара{itemCategory}
- категория товара{itemBrand}
- бренд товара{url}
- адрес страницы товара{cartUrl}
- ссылка для добавления товара в корзину{thumb}
- маленькая фотография товараЭти служат для вывода атрибутов, которые стилизуются под флажки:
{hit}
- выведет атрибут data-hit, если товар помечен менеджером как "хит продаж"{newest}
- выведет атрибут data-newest, если товар помечен как "новинка"{actional}
- выведет атрибут data-actional, если товар помечен как "акционный"А эти помогают вывести варианты товара:
{enumVariants}
- перечислить варианты товара{price}
- вывести цену (в текущей валюте){sign}
- знак текущей валютыmissing_template.htm
. Проверьте всё ли правильно, напишите там подходящие сведения. Сейчас она выглядит таким образом:Говорят, если продумать контент данной страницы и разместить там правильные ссылки, это дескать немного поднимает конверсионные качества сайта.
За картинки, фотографии и прочие графические материалы:
За шрифты, иконки и значки:
За средства разработки:
Замечание: Все изображения товаров, публикаций, брендов и прочее использованы в шаблоне только в демонстрационных целях. Они не являются частью поставки.
Авторы шаблона, а с ними и специалист по адаптации, и тестировщик, и райтер документации, стремились сделать свою часть работы так, чтобы финальное изделие было близко к идеалу. И хотя тестовые испытания показали хорошую оценку, авторы не дают гарантий, что получившийся шаблон соответствует вашим ожиданиям. Шаблон предоставляется в виде "как есть", без обязательств усовершенствовать или исправить любые типы ошибок, даже критические, если таковые обнаружатся позже.