Шапка с кнопками.

<<

Teerts

Аватара пользователя

Автор темы

Сообщения: 3

Зарегистрирован: 16 янв 2012, 01:16

Благодарил (а): 0 раз.
Поблагодарили: 2 раз.

Сообщение 16 янв 2012, 01:42

Шапка с кнопками.

День добрый.В html и css что то понимаю и разобраться в коде несложном могу,но что либо самому написать проблемно
А ситуация такая - хочу кнопку Rss и в дальнейшем какую-нибудь ещё,разместить на шапке.На фото ниже,красным отмечено расположение
Шапка с кнопками.

Шапка загружена через виджет заголовка.Так понимаю лучше её сделать через html самому как то таблицей?или..
<<

Teerts

Аватара пользователя

Автор темы

Сообщения: 3

Зарегистрирован: 16 янв 2012, 01:16

Благодарил (а): 0 раз.
Поблагодарили: 2 раз.

Сообщение 16 янв 2012, 14:44

Re: Шапка с кнопками.

Вот что то похожее,можно же применить?или это подойдет только для картинок?

  Код:
<style type="text/css">
  .temnyi { background-color: #666; height: 150px; width:500px; position: relative;}
  .svetlyi {background-color: #ccc; height: 50px; width: 250px; position: absolute; left: 125px; top: 50px;}
</style>

<div class="temnyi">
<div class="svetlyi"></div>
</div
Последний раз редактировалось Admin 26 янв 2012, 16:26, всего редактировалось 1 раз.
<<

sv9t

Аватара пользователя

Сообщения: 729

Зарегистрирован: 23 апр 2011, 01:14

Откуда: Киров

Благодарил (а): 8 раз.
Поблагодарили: 92 раз.

Сообщение 16 янв 2012, 17:50

Re: Шапка с кнопками.

просто в шаблоне выставьте картинку rss ссылкой
  Код:
<div id='rss'>
<a href='ссылка на ваш rss'><img src='ссылка на картинку rss' style='height:24px; width:24px;' /></a>
</div>

размеры сам выставишь по картинке. И в css параметры выставь так чтобы справа отображался.
Но если в будущем хочешь еще кнопки добавить, лучше сразу решить сколько, как они будут выглядеть, все полностью и соответственно сразу пробовать как они будут выглядеть в целом с rss(если рядом будут).
Путь сновидений - Hemi-sync, Астрал, ОС, Эзотерика, Йога
Sv9t.ru - CMS, Jquery, HTML5, CSS3, IT, PHP

"Делаю перелинковку на FAQ, телепат без отпуска, наивный оптимизатор, танцую с бубном"
<<

Teerts

Аватара пользователя

Автор темы

Сообщения: 3

Зарегистрирован: 16 янв 2012, 01:16

Благодарил (а): 0 раз.
Поблагодарили: 2 раз.

Сообщение 16 янв 2012, 18:57

Re: Шапка с кнопками.

Это просто добавила бы кнопку на страницу,под шапку,над шапкой или ещё что то,а мне нужно именно было разместить поверх шапки кнопку.Но уже разобрался.Мало ли кому пригодится -
Копируем этот код:
  Код:
<div id='header'>
<div class='logo1'>
  <a href='url желаемой страницы'>
<img border='0' height='высота вашей иконки' src='Изображение кнопки' width='ширина вашей иконки'/></a>
</div>
</div>


Ищем в "Изменить HTML" вот этот отрывок кода и вставляем сразу под ним верхний код:
  Код:
<a expr:href='data:blog.homepageUrl' style='display: block'>
          <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>


Сохраняем всё это дело и идём в Дизайнер шаблонов --> Дополнительно --> Добавить CSS

И там вставляем вот такой код:

  Код:
.logo1 {
position: absolute;
margin: -23px 0 0 857px; - первая цифра это высота по отношению к шапке(прописываем в значении -),последняя это расстояние от края до края(чем меньше цифра тем ближе к левой стороне,чем больше тем ближе к правой)
z-index: 100; - не изменяем
}

Жмём "Применить к блогу" и смотрим на результат.


У меня получилось вот так - Шапка с кнопками.
<<

sv9t

Аватара пользователя

Сообщения: 729

Зарегистрирован: 23 апр 2011, 01:14

Откуда: Киров

Благодарил (а): 8 раз.
Поблагодарили: 92 раз.

Сообщение 16 янв 2012, 19:57

Re: Шапка с кнопками.

:) так то это то же самое что и я написал
Путь сновидений - Hemi-sync, Астрал, ОС, Эзотерика, Йога
Sv9t.ru - CMS, Jquery, HTML5, CSS3, IT, PHP

"Делаю перелинковку на FAQ, телепат без отпуска, наивный оптимизатор, танцую с бубном"
<<

Tasha

Сообщения: 1

Зарегистрирован: 26 янв 2012, 20:15

Благодарил (а): 0 раз.
Поблагодарили: 0 раз.

Сообщение 13 фев 2012, 04:04

Re: Шапка с кнопками.

[quote="Teerts"]Это просто добавила бы кнопку на страницу,под шапку,над шапкой или ещё что то,а мне нужно именно было разместить поверх шапки кнопку.Но уже разобрался.[b]Мало ли кому пригодится [/b]-
Копируем этот код:
  Код:
<div id='header'>
<div class='logo1'>
  <a href='url желаемой страницы'>
<img border='0' height='высота вашей иконки' src='Изображение кнопки' width='ширина вашей иконки'/></a>
</div>
</div>


Ищем в "Изменить HTML" вот этот отрывок кода и вставляем сразу под ним верхний код:
  Код:
<a expr:href='data:blog.homepageUrl' style='display: block'>
          <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>


Сохраняем всё это дело и идём в Дизайнер шаблонов --> Дополнительно --> Добавить CSS

И там вставляем вот такой код:

  Код:
.logo1 {
position: absolute;
margin: -23px 0 0 857px; - первая цифра это высота по отношению к шапке(прописываем в значении -),последняя это расстояние от края до края(чем меньше цифра тем ближе к левой стороне,чем больше тем ближе к правой)
z-index: 100; - не изменяем
}

Жмём "Применить к блогу" и смотрим на результат.

Уважаемый Teerts!!! Огроменное Вам спасибо за такое ПОДРОБНОЕ описание. Неделю рыла инет и нашла ответ только у Вас. Ещё раз СПАСИБО!!!

Вернуться в Вопросы по шаблонам

Кто сейчас на конференции

Зарегистрированные пользователи: Bing [Bot]

Работает на phpBB © 2000, 2002, 2005, 2007 phpBB Group. Дизайн ST Software и Blogger Форум. Русская поддержка phpBB
ЧПУ ссылки от phpbb seo