Гайд Делаем красивый header

                                    

Administrator

Shopsn.SU
Команда форума
Администратор
Регистрация
27/5/18
Сообщения
47
Симпатии
8
#1
Для примера был взят шаблон LqShop
Делаем из
такой


Для начала нам нужно посмотреть какой class отвечает за header(а именно текст в нем)
1) Смотрим через код элемента class

1528188422950.png

.navbar-nav>li>a {
padding-top: 15px;
padding-bottom: 15px;
}

Нам и нужно
Далее добавляем в него свои стили, например хотим сделать как в начале темы

.navbar-nav>li>a {
padding-top: 15px;
padding-bottom: 15px;
color: #00ff44;
text-shadow: 0 0 4px #00ff53;
background: url([URL]https://i.imgur.com/LZCg5Q7.gif[/URL]);
}

Для смены цвета текста 00ff44 меняем на свой цвет, если не хотим использовать блестки на фоне , убираем background: url(https://i.imgur.com/LZCg5Q7.gif); полностью, где https://i.imgur.com/LZCg5Q7.gif - это ссылка на фоновые блестки, В интернете можно найти разных цветов блестки, в нашем случае они зеленые , если хотите например красные, поменяйте ссылку на http://i.imgur.com/darLNdO.gif
Далее переходим в Админ панель, вкладка Блоки&Прочее, там поле HTML Скрипты, туда вставляем:
<style>
.navbar-nav>li>a {
padding-top: 15px;
padding-bottom: 15px;
color: #00ff44;
text-shadow: 0 0 4px #00ff53;
background: url(
https://i.imgur.com/LZCg5Q7.gif);
}

</style>
Сохраняем, и получаем наш красивый header.
Таким методом можно в любом шаблоне изменить цвет теста, добавить фон на текст...
 
Последнее редактирование:

KyDe7nik.

New member
Регистрация
26/4/20
Сообщения
1
Симпатии
0
#2
где найти такие блёстки, не могу найти...
 

CaptainPanic

New member
Регистрация
7/1/21
Сообщения
13
Симпатии
0
#3
Спасибо!
Вот так они выглядят IMG_20210109_033327.jpg