Перейти к содержимому


Вставка Вверх Страницы Банера


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 16

#1 Иванов

Иванов

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 217 сообщений

Отправлено 16 Август 2015 - 22:04

Здравствуйте!

Подскажите, пож-та, как вставить банер в самый верх сайта.. (красная полоска + текст белого цвета + гиперссылка)... т.к. на скрине!

Заранее огромное спасибо!

Прикрепленные изображения

  • Без имени-2.jpg


#2 Ирина345

Ирина345

    Активный участник

  • Модераторы
  • 5 709 сообщений

Отправлено 17 Август 2015 - 14:22

Просмотр сообщенияИванов (16 Август 2015 - 22:04) писал:

Здравствуйте!

Подскажите, пож-та, как вставить банер в самый верх сайта.. (красная полоска + текст белого цвета + гиперссылка)... т.к. на скрине!

Заранее огромное спасибо!
Здравствуйте,
найдите в шаблоне HTML
<body onselectstart="return false" oncopy="return false">
<div class="group" id="wrapper"> 
после вставьте
<div class="bantop">Ваш текст</div>
далее в конец style.css добавьте

.bantop {
	background: #ff0000;
	color: #fff;
	padding: 7px 23px;
	font-size: 20px;
}


#3 Иванов

Иванов

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 217 сообщений

Отправлено 15 Сентябрь 2015 - 17:21

Просмотр сообщенияИрина345 (17 Август 2015 - 14:22) писал:

Здравствуйте,
найдите в шаблоне HTML
<body onselectstart="return false" oncopy="return false">
<div class="group" id="wrapper">
после вставьте
<div class="bantop">Ваш текст</div>
далее в конец style.css добавьте

.bantop {
background: #ff0000;
color: #fff;
padding: 7px 23px;
font-size: 20px;
}

как красную полосу вставить, т.к. на скрине?

#4 Danil

Danil

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 15 Сентябрь 2015 - 18:13

Просмотр сообщенияИванов (15 Сентябрь 2015 - 17:21) писал:

как красную полосу вставить, т.к. на скрине?
В шаблоне html, после код
<body onselectstart="return false" oncopy="return false">
вставьте
<body onselectstart="return false" oncopy="return false">
<span class="stroka">ТЕКСТ</span>
в конец main.css добавьте код
.stroka {
 color:#FFF;
 background-color:#F00;
 font-size:20px;
display: block;
}
изменяйте стили на свои

#5 Иванов

Иванов

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 217 сообщений

Отправлено 15 Сентябрь 2015 - 20:16

Просмотр сообщенияDanil (15 Сентябрь 2015 - 18:13) писал:

В шаблоне html, после код
<body onselectstart="return false" oncopy="return false">
вставьте
<body onselectstart="return false" oncopy="return false">
<span class="stroka">ТЕКСТ</span>
в конец main.css добавьте код
.stroka {
color:#FFF;
background-color:#F00;
font-size:20px;
display: block;
}
изменяйте стили на свои

1.  как изменить ширина строки и её цвет?

2. как сделать отступ от этой красной строки до верхней шапки?

Спасибо.

#6 Danil

Danil

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 15 Сентябрь 2015 - 20:27

Просмотр сообщенияИванов (15 Сентябрь 2015 - 20:16) писал:

1.  как изменить ширина строки и её цвет?

2. как сделать отступ от этой красной строки до верхней шапки?

Спасибо.
Код
.stroka {
	color: #FFF;
	background-color: #F00;
	font-size: 20px;
	display: block;
}
замените на
.stroka {
	color: #FFF;
	background-color: #F00;
	font-size: 20px;
	display: block;
	padding: 10px 5px 10px 5px;
	margin-bottom:10px;
}
- margin-bottom - отступ
- высоту регулируйте с помощью padding(изменяйте 1 и 3 значение)  
- цвет - color
- цвет фона - background-color

#7 Иванов

Иванов

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 217 сообщений

Отправлено 16 Сентябрь 2015 - 10:21

Просмотр сообщенияDanil (15 Сентябрь 2015 - 20:27) писал:

Код
.stroka {
color: #FFF;
background-color: #F00;
font-size: 20px;
display: block;
}
замените на
.stroka {
color: #FFF;
background-color: #F00;
font-size: 20px;
display: block;
padding: 10px 5px 10px 5px;
margin-bottom:10px;
}
- margin-bottom - отступ
- высоту регулируйте с помощью padding(изменяйте 1 и 3 значение)  
- цвет - color
- цвет фона - background-color

Спасибо!

Ещё один момент:  увеличиваем отступ и вместо фона (картинки) появляется просто белая полоса...  помогите исправить пож-та.

#8 Cupuyc

Cupuyc

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 747 сообщений

Отправлено 16 Сентябрь 2015 - 11:01

Просмотр сообщенияИванов (16 Сентябрь 2015 - 10:21) писал:

Спасибо!

Ещё один момент:  увеличиваем отступ и вместо фона (картинки) появляется просто белая полоса...  помогите исправить пож-та.

Здравствуйте, зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css найдите код:
.stroka {
		color: #FFF;
		background-color: #F00;
		font-size: 20px;
		display: block;
		padding: 15px 5px 15px 5px;
		margin-bottom: 20px;
}

Замените его на:

.stroka {
		color: #FFF;
		background-color: #F00;
		font-size: 20px;
		display: block;
		padding: 15px 5px 15px 5px;
		padding-bottom: 20px;
}


#9 Иванов

Иванов

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 217 сообщений

Отправлено 16 Сентябрь 2015 - 11:32

Просмотр сообщенияCupuyc (16 Сентябрь 2015 - 11:01) писал:

Здравствуйте, зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css найдите код:
.stroka {
color: #FFF;
background-color: #F00;
font-size: 20px;
display: block;
padding: 15px 5px 15px 5px;
margin-bottom: 20px;
}

Замените его на:

.stroka {
color: #FFF;
background-color: #F00;
font-size: 20px;
display: block;
padding: 15px 5px 15px 5px;
padding-bottom: 20px;
}

Белая строка пропала, но и отступ пропал от красной полосы у шапке.

#10 Иванов

Иванов

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 217 сообщений

Отправлено 18 Сентябрь 2015 - 09:19

Админы, ждем ответа  на предыдущее сообщение :unsure:

#11 Danil

Danil

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 18 Сентябрь 2015 - 09:40

Просмотр сообщенияИванов (18 Сентябрь 2015 - 09:19) писал:

Админы, ждем ответа  на предыдущее сообщение :unsure:
Здравствуйте.
В шаблоне html найдите
<span class="stroka"></span>
<div class="group" id="wrapper"> 
и замените на
<div class="group" id="wrapper">
<span class="stroka"></span>
После используйте инструкцию из сообщения 6.

#12 Иванов

Иванов

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 217 сообщений

Отправлено 18 Сентябрь 2015 - 09:43

Просмотр сообщенияDanil (18 Сентябрь 2015 - 09:40) писал:

Здравствуйте.
В шаблоне html найдите
<span class="stroka"></span>
<div class="group" id="wrapper"> 
и замените на
<div class="group" id="wrapper">
<span class="stroka"></span>
После используйте инструкцию из сообщения 6.

ничего не выходит. Отступа все равно нет.

#13 Danil

Danil

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 18 Сентябрь 2015 - 09:51

Просмотр сообщенияИванов (18 Сентябрь 2015 - 09:43) писал:

ничего не выходит. Отступа все равно нет.
Чтобы появился отступ, нужно произвести обратную инструкцию из сообщения 8 и изменять параметр margin-bottom.

#14 Иванов

Иванов

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 217 сообщений

Отправлено 18 Сентябрь 2015 - 10:05

Просмотр сообщенияDanil (18 Сентябрь 2015 - 09:51) писал:

Чтобы появился отступ, нужно произвести обратную инструкцию из сообщения 8 и изменять параметр margin-bottom.

Спасибо, с этим разобрались.

Последний момент:  изначально при удалении текста из этой верхней полосы (банера), блокировался его показ.  Как эту функции восстановить?

#15 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 19 Сентябрь 2015 - 06:10

Если вы хотите на время скрыть строку, то в main.css найдите:
.stroka {
color: #FFF;
background-color: #F00;
font-size: 20px;
display: block;
padding: 15px 5px 15px 5px;
padding-bottom: 20px;
}

замените на:
.stroka {
color: #FFF;
background-color: #F00;
font-size: 20px;
display: none;
padding: 15px 5px 15px 5px;
padding-bottom: 20px;
}

стиль display: none; скрывает элемент.

#16 Иванов

Иванов

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 217 сообщений

Отправлено 19 Сентябрь 2015 - 11:56

Просмотр сообщенияVaccina (19 Сентябрь 2015 - 06:10) писал:

Если вы хотите на время скрыть строку, то в main.css найдите:
.stroka {
color: #FFF;
background-color: #F00;
font-size: 20px;
display: block;
padding: 15px 5px 15px 5px;
padding-bottom: 20px;
}

замените на:
.stroka {
color: #FFF;
background-color: #F00;
font-size: 20px;
display: none;
padding: 15px 5px 15px 5px;
padding-bottom: 20px;
}

стиль display: none; скрывает элемент.

Только и отступ от верхней шапки в таком случает также скрывается...  :huh:

#17 Danil

Danil

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 19 Сентябрь 2015 - 12:41

Просмотр сообщенияИванов (19 Сентябрь 2015 - 11:56) писал:

Только и отступ от верхней шапки в таком случает также скрывается...  :huh:
В style.css найдите код
#wrapper {
	width: 100%;
}
и замените на

#wrapper {
	width: 100%;
	padding-top: 12px;
}
изменяйте значение 12px




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных