Как да се определи меню - лепкава - навигация, докато превъртате за WordPress

На съвременните сайтове от една страница с безкрайно дълго начална страница, лепкава хедър (заглавна лепкава) - това е частта, която помага на потребителите по всяко време, където и да е, за да се придвижват бързо до желания раздел на сайта.

За да създадете лепкава хедър, можете да използвате тема, като например авансово. в която ще похарчите само за няколко секунди, или да прибегне до помощта на WordPress плъгин.

Днес, в този пост ще разгледаме плюсовете и минусите на една лепкава лента за навигация на сайта си и да направя малко преглед на плъгините, с които можете да създадете лепкава хедър на вашия сайт. Нека да започнем!

Плюсове и минуси на Sticky Heder

Наскоро лепкави заглавията стават все по-популярни и това не е просто резултат от факта, че те се отразяват на хладно дизайн на сайта. Бърз достъп до навигация на сайта - много важно нещо, и то е невъзможно да не се вземат под внимание в нашето време, безкрайно превъртане.

Въпреки това, мнения за лепкавите заглавията са разделени, има достойни аргументи за и против тяхното използване.

Нека започнем с плюсовете

Въпреки това, навсякъде има и своите недостатъци

В нашия случай, най-очевидната е грешен дизайн на заглавната си част. Ти просто може да се изгуби в изпълнението и да направи заглавието е прекалено голям и натрапчиви, особено за мобилни устройства. Не е добра формула, така експеримент, резултати от изпитвания на реални устройства и емулатори, да използват различни инструменти и приставки, които могат да помогнат в тази ситуация.

Sticky заглавна трябва да съдържа елементи, които наистина са необходими на потребителя. Забележка сайта Medium. има лента за търсене, регистрация и навигация, която изчезва, когато потребителят превърта надолу на страницата, и веднага се появява на екрана, когато тя започва да се превърта нагоре. Това е една малка докосване, но от гледна точка на общата функционалност - това е страхотно.

Важно е да се спомене, че има риск да Bungle в кода. Можете да получите реална Frankenheder, че напълно ще се скрие съдържанието на уеб сайта или просто се обадете на досадни грешки. По-долу ви представяме плъгини, които ще ви помогнат да се избегнат подобни ситуации.

Но преди да започнем нашия преглед на нашата WordPress плъгин, нека да разгледаме няколко примера.

Примери за сайтове с лепкава навигация

Сайт Oasis - чудесен пример за фиксирана горната навигационна лента. По всяко време и от всяко устройство, вие ще имате достъп до Hedera сайт.

Настолната версия на сайта е на разположение, за да се завърши в менюто. При превключване на мобилно устройство, ще видите най-подходящите варианти и-бургер меню.

Гарет Емъри на място лепкава заглавна ще намалее, докато превъртате и става прозрачен.

Превключване към мобилната версия, и ще видите един забележителен пример за това как лепкава заглавна влияние върху брандинга: Сайтът ще виждате само логото и меню-бургер.

Сайт калмари Compression - пример за това как можете да използвате лепкавата страна заглавната си част.

Сега, когато имаме разгледа предимствата и недостатъците на лепкави заглавията, ние гледаме на някои реални примери, нека се заемем с инструменти за преглед.

Plugins да създават лепкави заглавията в WordPress

1. Sticky Header

Sticky Header от ThematoSoup - е прост плъгин, който осигурява всички необходими основни функции.

Повечето от настройките, които могат да направят чрез персонализиране, можете да промените цвета на фона, текста и да зададете максималната ширина на заглавната си част. Можете да настроите ширината на заглавната част, след като превъртите надолу и изберете специфични настройки за мобилни устройства.

2. Sticky Меню

Приставката Наименование разбира се много необичайно, но точно описва неговите възможности.

Приставката позволява да се направи "лепкава" място почти всеки елемент, но не забравяйте, че не трябва да се извършва твърде далеч. За да осъществи необходимия минимален HTML / CSS знания за правилното поставяне на селектора на дясната страница. Това е доста тривиално нещо, така че не се страхуват от това.

Има всички необходими основните настройки, можете да направите желаните настройки за показване на заглавието на мобилни устройства, освен това има настройка за обозначаване на Z-индекс на вашия лепкава елемент, за да сте сигурни, че винаги е видима. На разположение е и режим на отстраняване на грешки.

3. myStickymenu

Първоначално myStickymenu плъгин е специално проектиран за темата Двадесет Тринадесет, но тя трябва да работи добре с всички други модерни, отзивчиви теми.

Приставката е готов за локализация, отзивчив, включва лесни опции за добавяне на потребителски CSS.

4. WordPress на лентата за известия

WordPress на лентата за известия от SeedProd е перфектен за тази задача. Неговият лесен за инсталиране, са прости настройки за цвят, има съвместимост с многосайтово инсталации.

5. WPFront на лентата за известия

WPFront на лентата за известия, както и името може да предложи, е по-фокусирани върху известието, отколкото навигация.

настройка на параметрите малко по-напреднали от предишната версия. Можете да настроите височината, за да изберете къде точно да се постави на съобщението по време на превъртане, регулиране на цветовете и т.н.

Можете също да настроите датата за началото и края на заглавната част на дисплея, което ограничава появата му на конкретни позиции или страници.

Разработчиците са свършили добра работа по събиране на прости, но интересни идеи с примери на същата страница. По-подробни насоки също е на разположение.

6. Hero Меню

Hero Меню - единствената допълнителна такса щепсела в нашия списък (на разположение за $ 19).

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

Hero Меню плъгин е напълно съвместим с WooCommerce, е широко тествани с различни водещи премиум теми WordPress, като обгърне, Avada и Divi, заедно с всички най-нови версии на WordPress, тема, избрана по подразбиране от Twenty Eleven и да Двадесет петнадесета. Пълна информация за това как да изберете най-популярните теми, включени в управлението на добавка.

За да създадете лепкава хедър, имате нужда само с едно кликване. Има нужните настройки за цвят, прозрачност и лого. Пълна документация и поддръжка също е на разположение на интернет страницата на разработчика. Ако търсите за инструмент от серията "всичко-в-едно", а след това този плъгин е точно това, което ви трябва.

Добавянето лепкава навигация на сайта си

Няма значение дали искате просто да се определи конкретно съобщение на видно място, или да създадете лесна навигация, лепкава заглавието - това е чудесно решение, което ще бъде от полза както за посетителите и за неговия собственик.

Източник: wpmudev.org