Заглавката на уебсайта е първата информация, която посетителите виждат на вашия сайт. Тя ви позволява да подчертаете логото на вашата марка, да организирате страниците на сайта си и да предоставите други важни функции (търсене, вход и др.). Освен това, наличието на плаваща и прозрачна заглавка е от съществено значение, защото подобрява потребителското изживяване.
В тази статия ще ви покажем как да създадете заглавка и да я направите прозрачна с Elementor. Но първо, нека разгледаме какво представлява плаващата и прозрачна заглавка.
Какво е плаващ и прозрачен хедър?
Плаващата заглавка е лента за навигация, която винаги остава фиксирана дори когато посетителят превърта надолу по уеб страницата. Много е подходящ за сайтове, които имат страници с дълги статии, ревюта и едностранични сайтове. А неговият прозрачен аспект ви позволява да видите цвета на фона на страницата, както и нейното съдържание.
Защо да използвате плаващи и прозрачни заглавки
Съвременните уебсайтове все по-често използват плаващи и прозрачни заглавки, защото те имат визуално въздействие върху посетителите на сайта. Причините за приемането им са:
- Увеличете осведомеността за вашата марка,
- Увеличете потребителското изживяване,
- Подобрете навигацията
Открийте също Как да създадете двуцветно заглавие в Elementor
Закачете и направете заглавка прозрачна с Elementor
За да създадете прозрачен и плаващ заглавен файл, трябва да имате и двете версии на Elementor (Pro и Lite). В противен случай изтеглете (Elementor, Elementor Pro) преди да започнете.
След като го инсталирате, следвайте следващите стъпки.
Стъпка 1: създайте меню с Elementor
За да създадете меню, изпълнете следните стъпки:
- изберете последователно Външен вид >> Менюта
- Назовете менюто
- Посочете местоположението на менюто
- Валидирайте, като кликнете върху бутона меню за запазване
- Проверете страниците, статиите или публикациите в групата Добавете елементи от менюто
- Кликнете върху Добави в кошницата за да добавите маркираните елементи към менюто
- Накрая кликнете върху Запазване на менюто
Lire aussi Elementor: Как да се показва текст над изображение
Стъпка 2: Изберете шаблон за заглавка от библиотеката с шаблони на Elementor
Потребителите на Elementor Pro имат достъп до библиотека от готови шаблони, които са полезни за проектиране на различни секции на уебсайт. Ще намерите и разнообразие от шаблони за заглавки. За да направите това,
- Отидете последователно към Модели >> Добавяне
- Ще видите модален изскачащ прозорец
- Изберете удар с глава
- Накрая кликнете върху Създайте шаблон
От този момент нататък библиотеката се показва. По подразбиране показва заглавни блокове. Прегледайте предлаганите шаблони, след което вмъкнете шаблона, който ви интересува.
Шаблонът на заглавката ще се отвори в платното на Elementor.
Стъпка 3: Pin header с Elementor
За да закачите заглавката, изпълнете следните стъпки:
- Кликнете върху бутона Редактиране на заглавната секция
- След това изберете раздела напреднал
- след това Ефект на движение
- Изтеглете менюто надолу ПИН и изберете стойността На върха, това ще замрази заглавката на вашия сайт, докато посетителят превърта надолу по страниците.
- По подразбиране заглавката ще бъде фиксирана автоматично на медии като настолен компютър, таблет и мобилно устройство
Също така разглеждайте Elementor: Как да експортирате и импортирате шаблони
Стъпка 4: Направете заглавката прозрачна с Elementor
За да постигнете това, повторете метода по-долу:
- отидете стил >> фон >> избор на цвят
- След това променете непрозрачността на фона
Ако искате да направите заглавката напълно прозрачна, променете типа фон, като изберете типа класически. Поради това навигационните менюта ще бъдат невидими поради контраста на цвета на текста (бял).
За да коригирате тази ситуация, направете следното:
- Щракнете последователно върху Промяна на менюто на разглеждане >> стилове
- След това на средство за избиране на цвят
- Изберете желания цвят (в нашия случай нямаше нужда да го променяте).
След като направите това, можете да публикувате вашата уеб страница. Но преди това нека видим как да заменим навигационните менюта на нашия шаблон с тези, които създадохме. Не забравяйте, че името, присвоено на нашия е заглавно меню (вижте стъпка 1):
- Изберете раздела съдържание
- След това променете меню като изберете името на заглавката си
И ето го :).
Заключение
Прозрачните и плаващи заглавки могат да ви помогнат в няколко случая. Надяваме се, че тази статия е успяла да отговори на вашите нужди за създаване на прозрачни и плаващи заглавки с Elementor. Ако имате други притеснения по тази тема, уведомете ни в коментарите.
здравей,
Благодаря ви за статията ви.
Всъщност създадох прозрачен хедър, така че снимката на заден план да остане видима.
Тази снимка обаче е само на началната страница.
Бих искал да уточня, че този хедър е прозрачен само на началната страница, защото иначе в моите статии вече не го виждам!
Отчаяно търся решение... без успех!
Благодаря ти за помощта