Шапка сайта

  • 26 Ответов
  • 5170 Просмотров

0 Пользователей и 1 Гость просматривают эту тему.

*

Оффлайн Dr.SergeyP

Шапка сайта
« : 23.02.2015, 15:56:13 »
Добрый день. ;)
Нужна помощь по созданию шапки сайта. Много "гуглил" (пользовался поиском Яндекса), но ничего путного не нашёл, всё как-то поверхностно...
Объясните как можно подробнее! !
Каких размеров картинка, на какие кнопки нажимать, как да что...
Joomla! 3.3.6, Шаблон - стандартный Protostar.
Сейчас шапки как таковой нету вообще...

*

Оффлайн ShfVD

Re: Шапка сайта
« Ответ #1 : 23.02.2015, 16:54:00 »
Цитировать
Каких размеров картинка, на какие кнопки нажимать, как да что...
Размеры картинки устанавливаете сами (а какая Вам нужна?), если на картинке будет лого и название сайта оба они будут кликабельными.
Устанавливается лого
Менеджер шаблонов: Изменить стиль - Дополнительные параметры - Логотип.
Бэкграунд можете прописать в классах header или header-inner.

*

Оффлайн Dr.SergeyP

Re: Шапка сайта
« Ответ #2 : 23.02.2015, 17:08:55 »
Размеры картинки устанавливаете сами (а какая Вам нужна?)
- что бы на всю страницу по длине.
Бэкграунд можете прописать в классах header или header-inner.
- тут вообще ничего не понятно!

*

Оффлайн ShfVD

Re: Шапка сайта
« Ответ #3 : 23.02.2015, 17:11:24 »
- что бы на всю страницу по длине. - тут вообще ничего не понятно!
Я так понимаю, с CSS, HTML Вы, мягко говоря не дружите?
Тогда только литература.

*

Оффлайн Dr.SergeyP

Re: Шапка сайта
« Ответ #4 : 23.02.2015, 17:19:00 »
Я так понимаю, с CSS, HTML Вы, мягко говоря не дружите?
Тогда только литература.
очень-и-очень поверхностно!
Ладно, спасибо за помощь!

*

Оффлайн stendapuss

Re: Шапка сайта
« Ответ #5 : 24.02.2015, 12:14:20 »
Ставите картинку на логотип. Ширина около 1000 рх. Попробуете поймете. Можно на логотип большую поставить. Размер попробуйте и подберете. Можно шапку поставить в CSS файле шаблона. Размер шаблона фиксированный или резиновый ставиться в настройках шаблона. Там же где и логотип. В CSS файле куда ставить покажет FireBug. Установите и попробуйте. Там все просто. Посмотрите где родная картинка прописана.

В CSS файле шаблона править. Если там картинку ставить.
Где то 6013 строка. У меня так. У вас другая может быть. Поиском по файлу найдете body.site.
body.site и body.site.fluid. Одна строка для фиксированного, вторая для резинового. Попробуйте, не помню .

Посмотрите какой шаблон. В этих строчках так же можно фон сайта задать. И поставить картинку на фон.

body.site {
   border-top: 3px solid #606060;
   padding: 20px;
   background: url("/images/88.jpg");      Можно, нужно прописать по всем правилам, так тоже работает. картинку надо положить в папку images, в корне сайта. А не шаблона. Либо адрес другой прописать.
У меня вот так,;      
}
img {
    border: 6px double #00111b;
}
body.site.fluid {
   background-color: #ffffff;   
На резиновом шаблоне, на фон еще эта строка, у меня 6080.
.body .container {
   background-color: #fff;
   -moz-border-radius: 4px;
   -webkit-border-radius: 4px;
   border-radius: 4px;
   padding: 0px;
   border: 1px solid rgba(0,0,0,0.15);
   -moz-box-shadow: 0px 0px 6px rgba(0,0,0,0.05);
   -webkit-box-shadow: 0px 0px 6px rgba(0,0,0,0.05);
   box-shadow: 0px 0px 6px rgba(0,0,0,0.05);   
   background-position: 0px 0px;
   background: url("/images/2222.jpg");

Можно просто положить картинку (стоит на шапке) с таким же именем. Удалив родную. И она будет отображаться на шапке. Самый простой вариант.
Не поймете потом допишу.
Можно создать модуль, код. Задать ему позицию, и прописать туда шапку. Вставить картинку, размер подобрать.
Можно по разному шапку сделать. Посмотрите, что вам подойдет.

P.S проще кино сделать чем на пальцах объяснять. Там все просто.

Вот есть уже оказывается. Посмотрел. http://www.mani-mani-net.ru/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-%D0%BE%D0%BD%D0%BB%D0%B0%D0%B9%D0%BD-%D1%83%D1%87%D0%B5%D0%B1%D0%BD%D0%BE%D0%B5?start=20
« Последнее редактирование: 24.02.2015, 13:59:01 от stendapuss »

*

Оффлайн Dr.SergeyP

Re: Шапка сайта
« Ответ #6 : 24.02.2015, 12:52:55 »
В том-то и дело, что родной картинки не стоит. Установил логотип большой, как вы говорили - да, можно и таким способом. Но хочется что бы и логотип был и какая-то картинка на заднем фоне.

*

Оффлайн stendapuss

Re: Шапка сайта
« Ответ #7 : 24.02.2015, 13:09:36 »
В том-то и дело, что родной картинки не стоит. Установил логотип большой, как вы говорили - да, можно и таким способом. Но хочется что бы и логотип был и какая-то картинка на заднем фоне.
Ее нет просто в папке или удалили из файлов ее расположение.
Можно добавить  background: url("/images/88.jpg");   

*

Оффлайн stendapuss

Re: Шапка сайта
« Ответ #8 : 24.02.2015, 13:10:09 »
Сейчас в админку зайду посмотрю. Как там, что.

*

Оффлайн Dr.SergeyP

Re: Шапка сайта
« Ответ #9 : 24.02.2015, 13:35:43 »
В корне сайта есть картинки. Они есть также в шаблоне beez3, а вот в шаблоне protostar их нету.
Когда устанавливаю шаблон beez3, то стандартная картинка на шапке устанавливается (под горизонтальным меню), а если изменяю шаблон сайта на protostar, то картинка шапки исчезает.
Может я что-то не включил...

*

Оффлайн stendapuss

Re: Шапка сайта
« Ответ #10 : 24.02.2015, 13:41:47 »
В корне сайта есть картинки. Они есть также в шаблоне beez3, а вот в шаблоне protostar их нету.
Когда устанавливаю шаблон beez3, то стандартная картинка на шапке устанавливается (под горизонтальным меню), а если изменяю шаблон сайта на protostar, то картинка шапки исчезает.
Может я что-то не включил...
Сейчас попробовал с демо данными поставил . Картинка есть. Поставьте и смотрите, проще учится будет.
Картинка лежит:
в корне images/headers формат Рисунок JPEG (.jpg). попробуйте положите, может будет (сомневаюсь).
« Последнее редактирование: 24.02.2015, 14:14:01 от stendapuss »

*

Оффлайн stendapuss

Re: Шапка сайта
« Ответ #11 : 24.02.2015, 13:59:36 »
Попробуйте модулем поставьте шапку.

*

Оффлайн stendapuss

Re: Шапка сайта
« Ответ #12 : 24.02.2015, 14:43:30 »
body.site.fluid {
    background:   url("/images/12_2.jpg") no-repeat;
   background-color: #ffffff;
Вот так работает. Можно шапку модулем поставить, а так фон за ней. Можно прописать две картинки. Одна на шапку, вторая на фон если надо. Можно просто шапка.Сами смотрите, как надо.

Только надо у наших профи спросить как правильно задать, чтоб не уезжала в сторону. Когда уменьшаешь сильно ctrl-

Я лично задавал и центр и по пикселю на сторону. Все равно уезжает.
Надо сделать, так как на этом форуме шапка.
Я не знаю, что прописать.
Если что не понятно написал, пишите. Просто все шаблоны в голове перепутались.

*

Оффлайн Dr.SergeyP

Re: Шапка сайта
« Ответ #13 : 24.02.2015, 14:54:01 »
в корне images/headers формат Рисунок JPEG (.jpg). попробуйте положите, может будет (сомневаюсь).
- здесь есть картинки.
А как шапку модулем поставить? Что за модуль?

*

Оффлайн stendapuss

Re: Шапка сайта
« Ответ #14 : 24.02.2015, 15:05:41 »
Создаете модуль HTML код. Делаете шапку. Ложите картинку в папку. В модуле показываете эту картинку. Задаете позицию. Публикуете модуль. Лучше пропишите в в CSS файле шаблона типа:
body.site {
   background:   url("/images/12_2.jpg") no-repeat;
Можно  background:   url("/images/12_2.jpg") no-repeat; и еще картинку прописать большего размера. будет фон. получиться так: background:   url("/images/12_2.jpg") no-repeat,url("/images/12_2.jpg") no-repeat; Только в начале прописать надо фон, потом шапку. Можно 4 картинки так прописать за один раз.
Только бытует мнение, что надо для каждой картинки прописывать отдельно все надо. Но так работает и нормально. Кто говорит надо, кто нет. Пускай спецы наши скажут.
  
Можно на демо шаблоне поискать как картинка на шапку ставиться. Найти по названию картинки в файлах. И так же сделать.
Вариантов море.
« Последнее редактирование: 24.02.2015, 15:17:37 от stendapuss »

*

Оффлайн Dr.SergeyP

Re: Шапка сайта
« Ответ #15 : 24.02.2015, 15:34:16 »
УРА ! СПАСИБО !
Сделал по последнему варианту, так всё работает! Осталось по высоте подобрать!
Чтоб не уезжала в сторону - спрошу у спецов!
P.S. А как таким же способом поставить картинку на низ (футер) сайта?

*

Оффлайн stendapuss

Re: Шапка сайта
« Ответ #16 : 24.02.2015, 16:27:01 »
УРА ! СПАСИБО !
Сделал по последнему варианту, так всё работает! Осталось по высоте подобрать!
Чтоб не уезжала в сторону - спрошу у спецов!
P.S. А как таким же способом поставить картинку на низ (футер) сайта?
что спецы скажут отпишите. Мне тоже надо.
Вот
background: url("/images/fon/20_1.jpg") repeat-x,url("/images/fon/20.jpg") repeat-y,url("/images/fon/20_.jpg") repeat-y right 1px,url("/images/fon/Joomla!_video.png ") no-repeat;
Это как по ссылке на странице. По бокам три рамки и шапка.
Разберетесь. Вникните. пригодиться.
Если что позже пишите. дела сейчас образовались.

*

Оффлайн Dr.SergeyP

Re: Шапка сайта
« Ответ #17 : 24.02.2015, 16:44:29 »
Напишите, когда сможете!
А можно футер изменить так же как и шапку? Типа:
body.site {
   background:   url("/images/12_2.jpg") no-repeat;

А то мне не совсем понятно!
Вот создал новую тему про картинку: http://joomlaforum.ru/index.php?topic=309025.new;topicseen#new
буду держать вас в курсе!

*

Оффлайн stendapuss

Re: Шапка сайта
« Ответ #18 : 24.02.2015, 19:59:44 »
background:   url("/images/12_2.jpg") no-repeat center bottom; Это не по правилам. Надо полностью прописывать. В низ ложиться. На всех браузерах не пробовал.
Вставил сюда: background: url("/images/fon/20_1.jpg") repeat-x,url("/images/fon/20.jpg") repeat-y,url("/images/fon/20_.jpg") repeat-y right 1px,url("/images/fon/99_2.png") no-repeat center bottom;
Так тоже, как и в верхнем примере, только сжимает. И по бокам остается пространство.

Про футер https://www.google.ru/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#newwindow=1&safe=off&q=%D1%81%D0%B4%D0%B5%D0%BB%D0%B0%D1%82%D1%8C+%D1%84%D1%83%D1%82%D0%B5%D1%80

Про  CSS и другое http://htmlbook.ru/ много.

*

Оффлайн Dr.SergeyP

Re: Шапка сайта
« Ответ #19 : 24.02.2015, 21:30:32 »
Да, спасибо! Я читаю книги, но пока времени не так много и знания минимальны!

*

Оффлайн johant

Re: Шапка сайта
« Ответ #20 : 08.12.2016, 16:13:10 »
Здравствуйте. Не нашёл подходящую тему для вопроса. Есть три сайта на Joomla! 3.6.2 Stable. Один - сайт основного магазина, два других - сайты филиалов. В шапке названия городов, при клике на которые открывается сайт каждого города.
При нажатии, например, на ТАМБОВ всё нормально. А вот ВОРОНЕЖ закидывает на страницу Белгородского сайта с информацией о Воронежском филиале. Как исправить, чтобы при клике на ВОРОНЕЖ открывалась главная страница воронежского сайта?

*

Оффлайн arma

Re: Шапка сайта
« Ответ #21 : 08.12.2016, 16:20:04 »
Воронеж - он, гад, такой!
Почитайте правила форума (на будущее). Создайте свою новую тему. ОБНОВИТЕСЬ! Дайте ссылку на сайт хотя бы.

*

Оффлайн johant

Re: Шапка сайта
« Ответ #22 : 08.12.2016, 16:53:43 »
Воронеж - он, гад, такой!
Почитайте правила форума (на будущее). Создайте свою новую тему. ОБНОВИТЕСЬ! Дайте ссылку на сайт хотя бы.
Создал новую тему

*

Оффлайн Edward_m

Re: Шапка сайта
« Ответ #23 : 22.07.2017, 11:27:01 »
народ как раз про шапку сайта.
В шаблон обязательно вставлять новое положение чтобы текст добавить ?
или можно просто текст прописать?

*

Оффлайн stendapuss

Re: Шапка сайта
« Ответ #24 : 22.07.2017, 13:46:50 »
какой текст? куда добавить? КАКОЙ ШАБЛОН
« Последнее редактирование: 22.07.2017, 16:09:20 от stendapuss »

*

Оффлайн Edward_m

Re: Шапка сайта
« Ответ #25 : 24.07.2017, 11:44:34 »
какой текст? куда добавить? КАКОЙ ШАБЛОН
шаблон protostar.
в шапке сайта сделать текст по середине между поисковой строкой и логотипом.

*

Оффлайн stendapuss

Re: Шапка сайта
« Ответ #26 : 24.07.2017, 12:39:58 »
шаблон protostar.
в шапке сайта сделать текст по середине между поисковой строкой и логотипом.

В обще не понятно что хотите. Текст как добавляете? Если в настройках шаблона не надо добавлять позицию. Можете проста дописать на картинке что надо. Как добавляете картинку? Если в настройках шаблона картинка может уезжать от центра в разных разрешениях. Лучше поставьте картинку
body.site{border-top:4px solid: #000000;padding:20px;box-shadow: 4px 4px 9px #000000;background: url("/images/fon/2.png") no-repeat, url("/images/fon/-1.png") repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
}
Напишите на ней что надо. Имейте в виду на мобиле текст плохо видно (пишите крупней) либо для мобилы свои картинки. так и не понял что хотите, пишите подробней.