70 подписчиков

Готовый сайт "Ваш автоинструктор". Обзор панели управления. Часть I.

УСТАНОВКА САЙТА НА ХОСТИНГ

Готовый сайт загружается на хостинг точно так же как сам движок. Для загрузки нужно использовать FTP-клиентом FileZilla или любой другой, это не имеет значения. Процесс установки везде практически одинаковый.

После того, как FileZilla подключится к серверу, слева, в локальной панели находим и открываем папку с сайтом. Далее, справа, в серверной панели открываем папку в которую будет загружаться сайт.

Теперь, все содержимое локальной панели нужно выделить и на выделенной области кликнуть левой кнопкой мыши.

Откроется диалоговое окно, в котором выбираем Закачать на сервер. После завершения загрузки папок и файлов на сервер получим вот такой вид. Если требуется, выставите права доступа 777 папкам data и modules, а также всем вложенным папкам. Файлам в этих папках нужно выставить права 666.

Все сайт установлен. Переходим в панель управления сайтом.

ОБЗОР ПАНЕЛИ УПРАВЛЕНИЯ МИКРО-САЙТОМ

Чтобы войти в админку сайта нужно в адресной строке браузера к адресу дописать через наклонный слэш - /admin и открыть страницу авторизации.

Вводим пароль 123 и нажимаем кнопку Вход. Открывается главная страница панели управления сайтом.

Панель управления сайтом немного отличается от панели управления стандартным движком. Из панели управления убрано всё лишнее. Данный сайт не предусматривает создание страниц, поэтому в панели управления нет раздела "Управление страницами". Так же нет раздела "Управление расширениями", т.к. для решения задач поставленных перед этим сайтом вполне достаточно предустановленных по умолчанию модулей и расширений, т.е. нет необходимости устанавливать новые и удалять уже установленные. По этой же причине с главной страницы убраны иконки модулей и расширений. Ссылки на предустановленные модули добавлены в боковое меню панели управления, они всегда на виду, что дает возможность перейти в нужное расширение в один клик.

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

Рассмотри разделы панели управления сайтом в том порядке как они выведены в боковом меню.

НАСТРОЙКИ ШАБЛОНА

Это основной раздел управления сайтом. Именно в этом разделе проводится управление всем контентом сайта.

Вкладка "Общие настройки"

Заголовок сайта.
В поле вводится заголовок сайта. Текст заголовка выводится в шапке сайта при отключенном выводе логотипа. Так же заголовок выводится в подвале как копирайт.

Ссылка на изображение логотипа.
В поле вводится ссылка на изображение логотипа, которое будет выведено в шапке сайта.

Включить вывод логотипа.
Опция управляет выводом логотипа в шапке сайта. Если чекбокс убрать, то вывод логотипа будет отключен и будет выведен заголовок сайта, прописанный в настройках движка. Так же будет выведен слоган, если он прописан в настройках движках.

Ссылка на изображение для превью.
В поле "Ссылка на изображение для превью" вводится ссылка на изображение, которое будет выведено как превью при репосте страницы в социальных сетях. Эта ссылка выводится в мета теге

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

Favicon.
Favicon (фавиконка) — значок веб-сайта или веб-страницы. Выводится в сниппетах поисковой выдачи Яндекса и Гугла, отображается браузером во вкладке перед названием страницы, а также в адресной строке браузера.

Яндекс дает следующие рекомендации по формату и размеру фавиконки. Размер: 120×120, 32×32 или 16×16 пикселей. Формат: SVG (рекомендуемый), ICO, PNG.

Не смотря на рекомендации Яндекс, в микро-сайте основным расширением для фавиконки принято ICO и размер 16×16 пикселей. Это обще принятый формат, который будет выведен любым браузером.

По желанию можно загрузить и другие рекомендованные форматы. В коде страницы это выглядит так.

Если поле для ввода ссылки на файл фавиконки с рекомендованным расширением оставить пустым, то ссылка на фавиконку не будет выведена.

Год создания сайта.
В поле вводится год создания сайта, который выводится в подвале сайта. Если прописанный год не совпадает с текущим, то вывод будет примерно таким - © 2018 - 2022

Включить анимацию.
Опция управляет анимацией контента на сайте. Если чекбокс убрать, то анимация будет отключена.

Вкладка "Настройки меню"

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

Остальные пять пунктов соответствуют разделам сайта и выстроены в такой же последовательности, хотя названия пунктов могут отличаться от заголовков разделов из-за экономии места в меню. В настройках, под каждым полем выведены хештеги соответствующих разделов. Хештеги изменить нельзя.

Вкладка "Основной баннер"

Заголовок баннера.
Поле для ввода заголовка баннера.

Титр заголовка.
Поле для ввода текста, который будет выведен ниже заголовка.

Ссылка на изображение баннера.
Поле для ввода ссылки на файл с изображением баннера. Ниже выводится превью самого изображения.

Текст в кнопке.
Поле для ввода текста, который будет выведен в кнопке.

Ссылка в кнопке.
Поле для ввода ссылки, которая будет выведена в кнопке. По умолчанию прописан хештег section3, который соответствует разделу "Ваш персональный инструктор".

Заголовок формы обратного звонка.
Поле для ввода текста заголовка формы. Это позволяет настроить форму под любую тему сайта.

Текст в форме обратного звонка.
Поле для ввода пояснительного текста в форме.

Тема сообщения из формы обратного звонка.
Поле для ввода текста темы сообщения, которое будет прописано в полученном сообщении, которое было отправлено из формы обратного звонка на сайте.

Название поля ввода имени.
Поле для ввода текста названия поля ввода имени в форме.

Название поля ввода номера телефона.
Поле для ввода текста названия поля ввода номера телефона в форме.

Текст в кнопке формы обратного звонка.
Поле для ввода текста в кнопке отправки формы обратного звонка.

Вкладка "Основные разделы"

По умолчанию выведено пять кнопок для перехода во вкладки управления основными разделами сайта.

Раздел "Услуги автоинструктора"

Так выглядит основная вкладка раздела. В ней выводятся кнопки управления и список созданных превью.

Для перехода к настройкам раздела необходимо нажать на кнопку "Настройки".

Заголовок раздела на странице.
В поле вводится заголовок раздела. Он будет выведен на страницу сайта, а так же в панели управления шаблоном.

Текст титра заголовка.
Титр заголовка раздела выводится внизу под заголовком, если поле оставить пустым, то вывод титра будет отключен.

Текст в кнопке.
Текст в кнопке превью, по умолчанию прописано "Записаться".

Для добавления нового превью необходимо нажать на кнопку "Добавить превью". Откроется форма для добавления первью.

Заголовок.
В поле вводится заголовок превью.

Ссылка на фото превью.
Поле для ввода ссылки на файл с изображением фото превью.

Текст превью.
Поле для ввода текста привью. Поле выведено в виде текстового редактора, который позволяет форматировать вводимый текст.

Настройки при редактировании превью аналогичны настройкам добавления нового превью.

Раздел "Ваш персональный инструктор"

Настройки основного блока раздела.

Ссылка на фото.
Поле для ввода ссылки на файл с фото для раздела. Ниже выводится превью самого фото.

Содержание.
Поле для ввода содержания раздела. Поле выведено в виде текстового редактора, который позволяет форматировать вводимый текст.

Для перехода к настройкам раздела необходимо нажать на кнопку "Настройки".

Ссылка на файл с изображением фона.
В поле вводится ссылка на изображение, которое будет выведено как фон раздела.

Далее идут настройки, которые управляют выводом фона раздела.

Повторение фона:

Повторять по горизонтали;
Повторять по вертикали;
Повторять по горизонтали и по вертикали;
Не повторять.

Масштабирование фона:

Исходный размер;
Масштабирование с сохранением пропорции;
Масштабирование без сохранения пропорции.

Позиционирование фона:

По верхнему краю слева;
По верхнему краю справа;
По нижнему краю слева;
По нижнему краю справа;
По центру;
По центру и верхнему краю;
По центру и нижнему краю;
По центру и левому краю;
По центру и правому краю.

На этом нужно остановится более подробно. Для наглядности загрузили вот такую картинку.

По умолчанию установлены следующие опции этих настроек:

Повторение фона - Не повторять;
Масштабирование фона - Исходный размер;
Позиционирование фона - По центру и нижнему краю.

Результат вывода фона.

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

Если выбрать опцию Повторение фона - Повторять по вертикале, то получим такой результат.

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

Сочетая различные опции можно получить разнообразные варианты вывода фона раздела. Теперь немного о масштабировании фона. Например, есть такое сочетание настроек:

Повторение фона - Не повторять;
Масштабирование фона - Исходный размер;
Позиционирование фона - По центру.

Результат вывода фона.

Фон выводится в исходном размере по центру раздела и не повторяется. Если выбрать опцию Масштабирование фона - Масштабирование с сохранением пропорции, то получим такой результат.

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

Если выбрать опцию Масштабирование фона - Масштабирование без сохранения пропорции, то получим такой результат.

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

У нас остались еще две настройки.

Заголовок подраздела.
В поле вводится заголовок подраздела, в котором буду создаваться дополнительные блоки.

Включить вывод дополнительных блоков.
Управление выводом подраздела. Если чекбокс поставлен, то подраздел буде выведен.

Так же, в меню вкладки управления разделом появится ссылка - Дополнительные блоки. Нажимаем на эту ссылку и переходим во вкладку управления дополнительными блоками.

По умолчанию создано два дополнительных блока, но таких блоков может быть любой количество. Для добавления нового блока нужно нажать на кнопку "Добавить блок", откроется форма для добавления блока.

Заголовок.
В поле вводится заголовок блока.

Ссылка на фото превью.
Поле для ввода ссылки на файл с изображением фото превью.

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

Текст блока.
Поле для ввода текста блока. Поле выведено в виде текстового редактора, который позволяет форматировать вводимый текст.

Во вкладке редактирования блока настройки аналогичны настройкам во вкладке добавления нового блока.

Раздел "Отзывы учеников"

В этом разделе администратор может загрузить отзывы клиентов, присланные по почте. для добавления нового отзыва необходимо нажать на кнопку "Добавить отзыв". Откроется форма для добавления отзыва.

Имя.
В поле вводится имя клиента.

Ссылка на аватар.
Поле для ввода ссылки на файл с изображением аватара.

Текст отзыва.
Поле для ввода текста отзыва. Поле выведено в виде текстового редактора, который позволяет форматировать вводимый текст.

Во вкладке редактирования отзыва настройки аналогичны настройкам во вкладке добавления нового отзыва.

Для перехода к настройкам раздела необходимо нажать на кнопку "Настройки".

Раздел "Контакты"

Адрес.
Поле для ввода адреса офиса, если он есть. Если адрес не нужен, то поле необходимо оставить пустым. В этом случае вывод строки с адресом в разделе "Контакты" будет полностью отключен.

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

Включить вывод адреса (подвал).
Опция управляет выводом адреса в подвале сайта. Если чекбокс убрать, то вывод заголовка на страницу будет отключен.

Номер телефона.
Поле для ввода номера телефона. Если поле оставить пустым, то вывод строки с номером телефона в разделе "Контакты" будет полностью отключен.

Включить вывод номера телефона (шапка).
Опция управляет выводом номером телефона в шапке сайта. Если чекбокс убрать, то вывод номера телефона на страницу будет отключен.

Включить вывод номера телефона (подвал).
Опция управляет выводом номером телефона в подвале сайта. Если чекбокс убрать, то вывод номера телефона на страницу будет отключен.

Номер WhatSapp.
Поле для ввода номера телефона. Если поле оставить пустым, то вывод строки с номером телефона в разделе "Контакты" будет полностью отключен.

Включить вывод номера WhatSapp (шапка).
Опция управляет выводом номером WhatSapp в шапке сайта. Если чекбокс убрать, то вывод номера WhatSapp на страницу будет отключен.

Включить вывод номера WhatSapp (подвал).
Опция управляет выводом номером WhatSapp в подвале сайта. Если чекбокс убрать, то вывод номера WhatSapp на страницу будет отключен.

Email.
Поле для ввода электронного почтового адреса. Если поле оставить пустым, то вывод строки с Email в разделе "Контакты" будет полностью отключен.

Включить вывод email (шапка).
Опция управляет выводом email в шапке сайта. Если чекбокс убрать, то вывод email на страницу будет отключен.

Включить вывод email (подвал).
Опция управляет выводом email в подвале сайта. Если чекбокс убрать, то вывод email на страницу будет отключен.

Карта API.
Поле для ввода кода карты API.

Включить вывод карты API.
Опция управляет выводом карты API. Если чекбокс убрать, то вывод карты на страницу будет отключен. В этом случае будет выведен только блок контактов.

Facebook, Twitter, Instagram, Вконтакте, Одноклассники, Telegram
Поля для ввода ссылок на социальные сети. Если поле остается пустым, то вывод иконки социальной сети отключается.

Включить вывод блока соц. иконок (подвал).
Опция управляет выводом блока соц. иконок в подвале. Если чекбокс убрать, то вывод блока на страницу будет отключен.

Для перехода к настройкам раздела необходимо нажать на кнопку "Настройки".

Раздел "Запишитесь на занятия"

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

Тема сообщения из формы обратной связи.
Поле для ввода текста темы сообщения, которое будет прописано в полученном сообщении, которое было отправлено из формы обратного звонка на сайте.

Название поля ввода имени.
Поле для ввода текста названия поля ввода имени в форме.

Название поля ввода Email.
Поле для ввода текста названия поля ввода email в форме.

Название поля ввода номера телефона.
Поле для ввода текста названия поля ввода номера телефона в форме.

Название поля списка услуг.
Список услуг формируется автоматически из названия услуг созданных в разделе "Услуги автоинструктора". При добавлении новой услуги в этом разделе в списке услуг формы добавится название этой услуги.

Текст в кнопке формы обратной связи.
Поле для ввода текста в кнопке отправки формы обратной связи.

Для перехода к настройкам раздела необходимо нажать на кнопку "Настройки".

Далее идут настройки, которые управляют выводом фона раздела.

Повторение фона:

Повторять по горизонтали;
Повторять по вертикали;
Повторять по горизонтали и по вертикали;
Не повторять.

Масштабирование фона:

Исходный размер;
Масштабирование с сохранением пропорции;
Масштабирование без сохранения пропорции.

Позиционирование фона:

По верхнему краю слева;
По верхнему краю справа;
По нижнему краю слева;
По нижнему краю справа;
По центру;
По центру и верхнему краю;
По центру и нижнему краю;
По центру и левому краю;
По центру и правому краю.

Настройки для управления выводом фона разделам аналогичны настройкам в разделе "Ваш персональный инструктор".

Вкладка "Настройки SEO"

Во вкладке "Настройки SEO" заполняются все основные теги, необходимые для индексации сайта и его SEO-продвижения.

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

Ключевые слова.
Поле для заполнение мета тега keywords, в котором содержатся ключевые слова, описывающие содержание страницы.

Описание.
Поле для заполнение мета тега description. Содержимое этого мета тега является одним из источников, на основе которых формируются описания страниц сайта в результатах поиска.

Яндекс верификация.
Поле для заполнение мета тега yandex-verification. Данный мета тег используется для подтверждения прав собственности на сайт при добавлении его в сервис Яндекс.Вебмастер.

Google верификация.
Поле для заполнение мета тега google-site-verification. Данный мета тег используется для подтверждения прав собственности на сайт при добавлении его в Search Console сервиса Google.

Если поля "Яндекс верификация" и "Google верификация" оставить пустыми, то вывод соответствующих им мета тегов в код страницы будет отключен.

Вкладка "Дополнительные настройки"

Блок HTML в верху страницы.
Поле для ввода какого-либо html-кода. Это может быть дополнительная таблица css стилей или счётчик Яндекс.Метрика. Загруженный код будет выведен на страницу между тегами head.

Блок HTML внизу страницы.
Поле для ввода какого-либо html-кода. Это может быть скрипт какого-либо виджета. Загруженный код будет выведен в самом низу страницы перед закрывающим тегом body.

Вкладка "Политика конфиденциальности"

В соответствии с федеральным законом №152-ФЗ "О персональных данных" наличие на сайте формы для отправки сообщений считается обработкой персональных данных. В связи с этим владелец сайта обязан создать страницу с описанием политики администрации сайта в отношении обработки персональных данных, чтобы посетитель сайта мог с ней ознакомиться. Так же на сайте обязательно должна быть ссылка на такую страницу.

Во вкладке "Политика конфиденциальности" по умолчанию создан пример описания политики конфиденциальности, который можно подкорректировать под свои нужды и заменить своим текстом.

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

Работу панели управления сайтом "Ваш инструктор" можно посмотреть на демо. Пароль для входа - 123.

Ставьте лайки и подписывайтесь на канал. Дальше будет ещё интереснее.

#разработка веб-сайтов #создание сайтов #веб-дизайн #интернет #myengine