Битрикс. Создание сайта услуг от А до Я. Часть 20. Верстка. Делаем меню сайта

Автор Andrei Golubev
Битрикс. Создание сайта услуг от А до Я. Часть 20. Верстка. Делаем меню сайта

Всем привет мы продолжаем.

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

Давайте Согласно дизайну, что у нас.

Какие страницы страницы главное уже есть страниц у нас давайте так и будет так имя папки ананас. Давайте напишем всё-таки по-английски about us создать пункт. Меню у нас — это будет топ. Верхнее меню мотор. Да просто лишний потом моментов берём заголовок тоже будет у нас и пускай пока будет обычный текст содержать не более того. Так возвращаемся на уровень выше и снова создаем следующую папку. Так, что у нас там продукция давайте так напишу продукцию так по-русски 2 продувка так тоже на созданием верхнюю так. Верхнее меню и заголовок к слову постоянно сохраним возвращаемся на уровне выше. Иначе мы будем создавать уже под уровнем. Добавить папку. Так, что у нас там услуги по-английски сервисы создать. Верхнее меню и так, что нам ещё потребуется сам блок блок такой оставил. Верхнее меню блок и у нас в дизайне. Есть страница поиск. А вот — это иконка будет на неё вести поэтому предлагаю сразу её и создать поиск по-английски всё так и создать пункт меню на. Мне нужен страница поиска пока будет пускай пустая. Давайте остановимся сейчас мы пока тут не увидим поэтому предлагаю его создать мы сейчас создадим изменим страницу в ней как бы создадим наш компонент меню выберем его находится он служебные Navigation Menu мы можем либо щелкнуть два раза. Иван автоматом переведется откроется. Либо мы можем просто выбрать и перенести его усмотрение так два раза щелкаем. Открой меню меня для меня есть мой специализированный шаблон он уже в принципе подготовленный там надо просто поменять цветовое оформление поэтому он называется этот меню моего и выберем тип меню для первого уровня. Верхняя Давайте сразу постоянно автокеширование чтобы потом не вспоминать про — это уровень вложенности у нас в принципе будет одно меню, а тот шаблон который у меня рассчитан на минимум два уровня терпению для остальных будет левая подключать мы пока не будем нам этого будет достаточно сохраняем открываем режим совместный режим по вертикали или по крайней мере он так души нравится и находим уходим компонент который отвечает чисто за наше меню видите. Битрикс меню шаблон. Майкоп меню моего копируем нажимаем. Отмена Выйти с сохранением сошёл. Нам пока не потребуется только вместе. И мы его с копируем в наш блок отвечающий за меню, но предлагаю так же всё-таки чтобы у нас было больше возможностей мы нашли компонент повернем блок меню дип-пот так и давайте тоже лесенку. Ну, что ж первое, что нам потребуется header File мы закрыть и мы скачаем все остальные файлы которые у нас были потому, что мы с вами создали новый физический файлы. Как видите As Block продукция её нам надо на наш проект чтобы у нас не затерлась то, что мы сейчас добавили меню. Мы сначала Block heater загружаем на сайт, а потом всё остальное мы просто видите мы выбрали в 10 целиком кулинария правой кнопкой deployment скачать всё сайта сейчас быстренько всё скачает. Да всегда капец у нас появились пункты battleblock и так далее. Давайте попробуем у нас появилась на нас есть ряд внешних ненужных нам — это видеть компания новости услуги нас есть свои пункты поэтому редактировать пункты меню. Давайте уберём то, что она мне нужна она с продукт услуги блок. Давайте поставим главную страницу чтобы человек уснул быстренько на неё нажать на главной странице у нас будет ссылаться на свой, что есть на корень сайта так я добавил верхний перенёс. Давайте быстренько перенесём за счёт стрелочек. И мы с вами ещё на, что не сделаем мы не сделали страницу контакты, а у нас она есть. ВКонтакте Значит так пропишем так давай создадим верхнем этаже оставим пока. Помолчи давай созвонимся вот у нас все элементы готовы. Так у нас на, что всё ругается Gold. Давайте посмотрим компоненты Menu template нет. Так у нас он ссылается на. Остался 1 так танцевать на то, что у нас получился Words As CSS он не знает какой файл выбор. Так удаляем отсюда и. Давайте удалим сервер. Мы заходим через тус deployment браузер посмотреть удаленный хост. Битрикс ВМ — это наш сайт папка Local template корпус Services. Мы отсюда тоже можем убрать. Так нам больше не потребуется отсюда. Мы же убрали его оттуда ещё нет так. Давайте ещё раз Home. Битрикс в локал торгсервис удаляем daylight Take A Silent Voice My Work is less тоже уберём давайте давайте. И, что нажимаю на соответствующую кнопку, что ж. Давайте обновим и продолжаем так минимуму с вами добавили. Давайте его откроем сам шаблонные трогать не будем он уже в принципе подходящий. Просто я хочу показать, что мы можем поменять цветовое оформление за счёт вот этих переменных. Как видите цвет ссылки у меня красный цвет ссылки когда она не найдена белая цвет. Айфона красный то есть меня вот эти параметры мы можем поменять абсолютно любой цвет у меня все на.

0 комментариев
0

Читайте также