Бұл мақала мәзір дизайнын — мәзірлер қалай жұмыс істейтінін және олардың қалай көрінетінін қамтиды. Егер сізге веб-сайт мәзірін жасауды, мәзірді барлық беттерге бірден қосуды немесе бет ішінде шарлауды қалай жасау керектігін түсіну қажет болса, осы мақаланы оқыңыз:

Ол қалай әрекет етеді:
Ол әрқашан беттің жоғарғы жағында болады, мазмұннан арылтпайды, қажет болған жағдайда қолданушы оған оңай сілтеме жасай алады, өйткені ол әдеттегі жерде орналасқан.

Как сделать:

Добавить на страницу блок ME301N и задать в настройках блока следующие параметры:

Основные настройки > Поведение позиционирования — С наложением на следующий блок, но без фиксирования
Фон меню > Непрозрачность фона меню — 0%

Ол қалай әрекет етеді:
Пайдаланушыға әрқашан көрінетін және беттің кез келген жерінен кіруге болатын мәзір. Бұл мәзірде әдетте беттің жоғарғы жағында (мұқаба бетінде) мөлдір фон болады, ол пайдаланушы айналдырған сайын мөлдір болып өзгереді.

Как сделать:

Добавить на страницу блок ME301N и задать в настройках блока следующие параметры:

Основные настройки → Поведение позиционирования → Фиксация при скролле
Фон меню → Цвет фона меню — на выбор
Фон меню → Непрозрачность фона меню — 0%
Фон меню → Непрозрачность фона меню после начала скролла — 80%

Ол қалай әрекет етеді:
Параметр алдыңғысына ұқсас, тек айналдырғанда ғана әр түрлі мазмұны бар мәзір пайда болады. Мысалы, беттің басында мәзірде логотип, элементтер (сайт бөлімдеріне сілтемелер) және әлеуметтік желілерге сілтемелер бар. Ал пайдаланушы бет арқылы айналдыра бастағанда, логотипі бар мәзір, әрекетке қоңырау шалу және қоңырау шалу түймешігі пайда болып, көрініп қалады.

Как сделать:

Добавить на страницу два блока ME301N и задать им следующие параметры:

Первое меню (остается на обложке)
Основные настройки > Поведение позиционирования — С наложением на следующий блок, но без фиксирования
Фон меню > Непрозрачность фона меню — 0%

Второе меню (появляется при скролле)
Основные настройки > Поведение позиционирования — Фиксация при скролле
Основные настройки > Появление меню при прокрутке через N пикселей — 600px
Фон меню > Цвет фона меню — на выбор
Фон меню > Непрозрачность фона меню — 70%

Ол қалай әрекет етеді:
Экранның бұрышындағы үш жолақ түріндегі мәзір, оны басқан кезде толық нұсқасын ашады.

Ол не үшін қолданылады:
Мазасыздықты азайту және пайдаланушының назарын тек мазмұнға аудару маңызды болған кезде, гамбургер мәзірі веб-сайттың мобильді нұсқаларында жиі пайдаланылады. Мәзірдің әртүрлі құрылғыларда қалай көрінетінін реттеуге болады.

Мысалы, кәдімгі мәзірді қосып, оның көрінуін "тек жұмыс үстелі" етіп орнатуға болады, содан кейін "гамбургер" мәзірін қосып, оның көрінуін "тек мобильді" етіп орнатуға болады.

Как сделать:

Добавить на страницу блок ME401/402/403/404/405, настроить поведение позиционирования, цвет иконки меню, цвет фона самого меню и цвет фона для пунктов меню.

В нашем примере параметры будут следующими:
Основные настройки → Поведение позиционирования — Фиксация при скролле
Иконка меню → Цвет — черный
Фон меню → Цвет фона закрытого меню — прозрачный
Фон меню→ Цвет фона открытого меню — белый

Ол қалай әрекет етеді:
Мәзір элементін басқанда, кірістірілген элементтердің ашылмалы тізімі пайда болады.

Ол не үшін қолданылады:
Күрделі құрылымы бар ірі учаскелерде.

Как сделать:


Добавить пункты подменю у основного блока или использовать сочетание меню ME301N (или любого другого с пунктами меню) и ME601.

Мәзір элементтері бар бетке кез келген мәзір блогын қосыңыз.

Мазмұнды блоктау → Мәзір элементтерінің тізімі → «Екінші деңгейдегі элементтерді қосу» түймесін басыңыз – мәзір элементтерінің жанында плюс пішінді белгішелер пайда болады.

Екінші деңгейлі элемент қосқыңыз келетін элементтің жанындағы қосу белгішесін басыңыз. Элементтің аты мен сілтемесі үшін пайда болатын өрістерді толтырыңыз.

Жаңа ішкі мәзір элементін қосу үшін қосу белгішесін қайтадан басыңыз.

Мәзірдің ішкі элементтері меңзерді апарғанда ашылмалы мәзір ретінде пайда болады. Мобильді нұсқаларда мәзір түрту арқылы ашылады.

Маңызды : Негізгі мәзір элементінің өзі басылмайтын болады. Оның сілтемесі болуын қаласаңыз, ашылмалы мәзірдегі элементтің көшірмесін жасаңыз.

Добавить на страницу блок ME301N, настроить меню, как в примерах выше и добавить блок ME601 (Меню: второй уровень).

Блок ME601 позволяет добавить подразделы к пунктам основного меню. Они будут показываться при наведении в формате выпадающего меню. В мобильных версиях меню будет открываться по тапу.

Как это работает:
1) В блоке ME601: пропишите ссылку вида #submenu:more
2) В основном меню: в поле ссылка, напротив пункта, к которому вы хотите сделать подразделы, укажите #submenu:more.

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

Примечание: "#submenu:more" может быть любым словом, например: #submenu:portfolio или #submenu:aboutus

Ол қалай әрекет етеді:
Әрбір сілтеме белгілі бір қойынды белсенді болғанда (пайдаланушы басқан кезде) көрсетілетін мазмұнға сәйкес келеді.

Ол не үшін қолданылады:
Портфолио жұмысы сияқты санатталған ұқсас мазмұнды көрсету үшін.

Как сделать:

Добавить на страницу блок ME602A/ME602B. Блок позволяет создавать на странице вкладки и показывать разный контент по клику на соответствующую вкладку в рамках одной страницы. Затем ниже последовательно расположить все блоки, которые будут меняться при клике на вкладку.

Как работает:
1) Напишите название вкладок в меню «Контент» блока ME602A/ME602B.
2) Укажите ID блоков, которые должны быть видны при клике на эту вкладку (через запятую и без пробела).

Важно: ID блока можно посмотреть в меню настройках блока или в списке контекстного меню.

Егер қосылған мәзір элементтерінің барлығы бір жолға сыймаса, айналдыру жолағы пайда болады. Параметрлерде айналдыру түрін таңдай аласыз: қолмен немесе шеңбермен.

Ол қалай әрекет етеді:
Мәзірдегі нүктені басқанда беттегі белгілі бір блокқа өтіңіз

Ол не үшін қолданылады:
Мазмұны көп беттегі белгілі бір бөлімге қайта бағыттау

Как сделать:

Добавить на страницу блок ME604 из категории Меню. С помощью этого блока можно сделать вертикальную навигацию внутри страницы между разделами.

Примечание: данный блок предназначен только для больших экранов (от 960px).

Как работает:

1) Перед каждым разделом добавьте блок с якорной ссылкой (находится в категории "Другое"). Их удобно называть по смыслу, например: about, team, gallery
2) В списке пунктов меню для каждого из разделов введите названия и якорные ссылки с символом "#". Пример якорной ссылки: #about

Ол қалай әрекет етеді:
Мәзір элементін басу сізді белгілі бір бөлімге немесе ішкі бетке апарады.

Ол не үшін қолданылады:
Нан үгіндісі мәзірін басты беттен ағымдағы бетке дейінгі жолды көрсету үшін пайдалануға болады.

Как сделать:

Добавить на страницу блок ME605 из категории Меню. В контенте блока в поле Текст 1, Текст 2, Текст 3 указать навигационную цепочку страниц сайта, начиная от главной страницы и заканчивая текущей страницей, на которой находится пользователь. Ниже в поле Ссылка 1, Ссылка 2, Ссылка 3 указать ссылку на страницу для пункта меню.

Как работает:
1) Установите адрес для страницы в Настройках страницы > Главное
2) Укажите ссылку на отдельную страницу для пункта меню в поле Ссылка

Ол қалай әрекет етеді:
Бөлімдер мен кіші бөлімдерді қамтитын кеңейтілген бүйірлік мәзір. Мәзірде беттің кез келген жеріне кіруге мүмкіндік беретін бекітілген позиция бар.

Ол не үшін қолданылады:
Сайттың ішкі бөлімдері мен кіші бөлімдері арқылы егжей-тегжейлі шарлауды жасауға, сондай-ақ бет іздеуді қосуға мүмкіндік береді.

Как сделать:

Добавить на страницу блок ME901, настроить стили отображения меню с помощью настроек блока.

Блок ME901 позволяет добавить подразделы к пунктам основного меню. Указывать ссылки на подразделы необходимо в контенте блока > список пунктов меню.

В качестве ссылки нужно указать либо полный адрес страницы, включая http://, либо относительный адрес — только название страницы (например /page7890.html или /about).

Бет ішінде шарлау жасау үшін анкерлік сілтемелерді (мысалы, #контактілер) пайдалануға болады. Бетке якорь қосу үшін Басқа санаттағы T173 блогын пайдаланыңыз.

Егер экран ені 1500 пиксельден үлкен болса, мәзір ашық қалады.

Ол қалай әрекет етеді:
Арбадағы элементтерді көрсетеді, таңдаулыларға бөлек қойып, шарлау бөлімінің жанындағы мәзірдегі сайтты іздейді.


Ол не үшін қолданылады:
Мәзір қолданатын пайдаланушылар үшін ыңғайлы болады КідіртуӨнім атлогыарба, сайт іздеу және таңдаулыларды ықшамдап көрсету үшін.

Как сделать:

Добавьте блок меню ME401 на страницу → Контент → Корзина, поиск и избранное → поставьте галочки, чтобы отобразить нужные иконки в меню.

Поставьте галочку «Не показывать отдельные кнопки виджетов», чтобы иконки отображались только в меню.

Содан кейін арбаға арналған ST100, іздеу үшін T985 және бетке таңдаулылар үшін ST110 блоктарын қосып, бетті жариялаңыз.

Дайын.

Барлық мәзір блоктары үшін ME4XX нөмірлерімен жұмыс істейді.

Варианты отображения:

Если требуется показывать в меню и иконки, и кнопку виджета Избранное, то снимите галочку «Не показывать отдельные кнопки виджетов» в Контенте блока ME401.

Виджет белгішесін тек ST100 сауда арбасы мен T985 іздеуі үшін ажыратыңыз — екі блоктың параметрлері қойындысындағы «Кеңейтілген параметрлер» қойыншасында «Ашық виджет батырмасын көрсетпеу» құсбелгісін қойыңыз. Бетті жариялау.

Дайын! Мәзірде үш белгіше көрсетілген және таңдаулыларға арналған жеке виджет бар. Осыған ұқсас түрде арба виджетінің көрінуін конфигурациялауға немесе іздеуге болады.

Нөлдік блокта өз мәзірін элементтерді қалағаныңызша реттеу арқылы жасауға болады, содан кейін осы блокты құлыптай аласыз.

Міндеттемені конфигурациялау үшін Нөлдік блок → параметрлері → орны және Толып кету бөліміне өтіп, блокты жасау үшін Бекітілген параметріне орнатыңыз.

Блокты беттің үстіңгі немесе астыңғы жағына бекітуге болады және X пиксельден кейін пайда болатындай етіп конфигурациялауға болады (Көрсетілген ығысу). Бұл жағдайда өшетін анимация қолжетімді болады. Бұл, мысалы, сайт тақырыбының бірден емес, бірнеше айналдырудан кейін пайда болуын қаласаңыз, пайдалы болуы мүмкін.

Біз мәзірлердің негізгі түрлерін қарап шықтық. Егер басқа жолмен келсеңіз және оны ортақ пайдалануды қаласаңыз, веб-сайтыңызға сілтемені «Мәзір дизайны» деп белгіленген team@tilda.cc жіберіңіз. Рахмет.

Тәжірибелеріңіз құтты болсын!