И снова про "шапку" Тема решена

[WillySPb]

В ветке "Поддержка phpBB 3.3.x" темы про "шапку" нет, поэтому позвольте создам новую.
********
Версия PHP: 7.1.33
Версия phpBB: 3.3.5
Стиль "aero" 1.1.7 (уж очень он мне приглянулся и менять его не хочу)
Руки кривоваты, но желание научится и упертость компенсирует это недоразумение
(про руки - это в смысле новичек я в этой сфере, больше читаю и пробую, потом пишу)
********
Дальше суть...

Цель: 

Поставить вместо "родных" шапки (фона в заголовке) с логотипом phpBB,
1. Нафотошопленную картинку в 140 пикселей высотой, формата .png (файл 1280х140) в качестве фона
2. Круглый логотип 120 пикселей (нафотошопленный файл .png 120х120)
3. Сделать оба изображения кликабельными, ведущими на портал, который используется в качестве главной страницы

Что было сделано: 

1. Удалось поставить на место свой логотип, четко следуя инструкции Sheer, но где и как править фон шапки в phpBB 3.3,
чтобы совместить две цели, пока не нашел.
2. Найдено замечательное расширение Header banner, фон с логотипом встают приемлемо, но на мобильных устройствах фон уезжает.
3. Найдено замечательное расширение Site Logo, в котором отлично встает фон, хоть и промаргивает "родной" при перезагрузке страниц, но ни в какую не хочет ставится логотип. Мой логотип просто игнорируется. Включен - показывается родной phpBB, выключен - никакого.
4. Найдено не плохое расширение Custom Header Logo, но указывать к каждой страницы отдельную или ту же шапку - для меня неприемлемо.
5. Попытался покопать в сторону стилей (чуйка такая у меня, что туда надо копать), но понимания не пришло.
Хотя База знаний тут и тут, а Sheer тут, и Татьяна5 тут вроде в том числе мою тему раскрывают,
но собрать мысли в кучу и реализоваться так и не удалось.

Собственно пока все, копаю дальше, но понимаю, что это не быстро, учитывая "темность леса".
А за любую помощь буду крайне признателен.

p.s. 

Вы не представляете сколько было радости, когда хоть строго по инструкции, но удалось немного подкорректировать "копирайт"
или русифицировать нужное мне расширение самостоятельно.

[Татьяна5]

WillySPb, ссылку на форум, на котором экспериментируете, в студию

[er107]

но ни в какую не хочет ставится логотип. Мой логотип просто игнорируется.

Это элементарно решается заменой стандартного логотипа на ваш, но с тем же названием, что и стандартный. У меня так сделано, все показывает.

[WillySPb]

WillySPb, ссылку на форум, на котором экспериментируете, в студию

Ответил в личку

Отправлено спустя 2 минуты 50 секунд:

У меня так сделано, все показывает.

А у меня к сожалению нет

[Татьяна5]

1. Нафотошопленную картинку в 140 пикселей высотой, формата .png (файл 1280х140) в качестве фона

В том стиле уже есть фон шапки, доп. расширения для него не нужны
Проще изменить адрес существующего

изображение.png

2. Круглый логотип 120 пикселей (нафотошопленный файл .png 120х120)

Удалось поставить на место свой логотип, четко следуя инструкции Sheer

Инструкция подходит

3. Сделать оба изображения кликабельными, ведущими на портал, который используется в качестве главной страницы

Лого и так кликабельно, фон... примерно так

Код: Выделить всё

$(document).ready(function() {
    $('.headerbar').click(function() {
        window.location.href = 'http://www.yandex.ru';
    });
});

Вместо ссылки на яндекс - ваша на портал

Раз это нужно для одного стиля - в стиль и добавить. Скажем, в конец файла forum_fn.js

[WillySPb]

Сначала немного эмоций: 

672785676.gif

409185901.gif

149618556.gif

681451343.gif

238248915.gif

В том стиле уже есть фон шапки, доп. расширения для него не нужны
Проще изменить адрес существующего

Всего-то минут 40 и я это сделал.
Причем половина этого времени ушло для понимания какой файл надо править

Инструкция подходит

Тоже сделано.
Только логотип как бы прижимался к нижней части шапки.
И, метод тыка показал, что буквально в соседнем блоке (или как он правильно называется) регулируется отступ логотипа от краев.
В итоге фон и логотип заняли свое почетное место.

фон... примерно так

Работает замечательно
Так мало слов, но они бесценны. Огромное вам спасибо.
p.s.
Родное название и описание конференции удалить, пользуясь Базой знаний, вообще как нефиг делать
.

Что хотелось бы довести до ума, конкретно в этой теме: 

1. Главное - локализация для мобильных устройств. С мобилки все очень печально выглядит. И фон, и логотип уехали влево, наглухо.
Инструкцию эту, если она подходит в моем случае, не понял совсем
2. Картинка моя 1280х140 и она немного смещена влево, хоть и заполняет шапку полностью. Но получается моя надпись на картинке не по центру.
3. Сложно ли сделать так, чтобы при наведении на кликабельную теперь шапку, менялся курсор так же, как при наведении на логотип ?

[Татьяна5]

https://webref.ru/css/background
https://webref.ru/css/background-size
https://webref.ru/css/background-position

Код: Выделить всё

.headerbar {
    background-position: center;
    background-size: cover;
    cursor: pointer;
}

По логике стилей класс править в common.css

[WillySPb]

По логике стилей класс править в common.css

На стационарном компе ВСЕ цели достигнуты, за что очередной раз выражаю вам огромную благодарность.
А на мобилке, после этой правки, шапка просто пропала, от слова совсем.
Завтра буду изучать приведенные вами ссылки.

А пока... 

Сделаю пользователям рассылку о том, что мобилки - зло, пользуйтесь ПК

[Татьяна5]

Не после той. Шапка схлопывается из-за скрытия логотипа. Это либо не скрывать логотип, либо задать минимальную высоту шапке

[WillySPb]

Не после той. Шапка схлопывается из-за скрытия логотипа. Это либо не скрывать логотип, либо задать минимальную высоту шапке

Не спорю (я же не враг себе ), но вынужден не согласиться, т.к. только что проверил четко и отдельно этот момент.
Если файл common.css содержит такую (родную) часть текста:

Код: Выделить всё

.headerbar {
	background: transparent none no-repeat top right;
	padding: 5px;
	min-height: 75px;

в мобилке шапка есть
Если в файл common.css вносится эта правка

.headerbar {
background-position: center;
background-size: cover;
cursor: pointer;

то шапка в мобилке схлопывается, как вы очень точно выразились.

[Татьяна5]

(родную) часть текста

Зачем её стёрли? В ней как раз min-height содержится

[WillySPb]

Зачем её стёрли? В ней как раз min-height содержится

упс...
Так нужно было добавить ?
А я-то сделал заменить

150150147.gif

ну я же предупреждал, что руки кривоваты, уж простите

Отправлено спустя 7 минут 38 секунд:

так 

Код: Выделить всё

.headerbar {
	background: transparent none no-repeat top right;
	padding: 5px;
	min-height: 75px;
}
.headerbar {
    background-position: center;
    background-size: cover;
    cursor: pointer;
}

Результат конечно лучше, но не достигнут.
В мобилке шапка и логотип есть, но они не адаптированы
(не масштабированы и наслаиваются друг на друга)

[Татьяна5]

WillySPb
http://htmlbook.ru/samhtml
http://htmlbook.ru/samcss
Пригодится. Чтобы понимали что делаете в стилях

[WillySPb]

Пригодится. Чтобы понимали что делаете в стилях

Пригодится точно, со временем, а пока это как чертежи космического корабля
Вот прямо уверен, что истина где-то рядом с этим постом,
но конкретно в моем случае мысли не сходятся.
Напоминает забаву найди 10 отличий в файле colours.css

p.s. 

Зато я до 3.3.6 обновился....САМ

Снимок.JPG

[WillySPb]

Вот прямо уверен, что истина где-то рядом с этим постом,
но конкретно в моем случае мысли не сходятся.

Найти решение так и не удалось.
Буду признателен, если дадите правильный ответ.
Заранее благодарен.

p.s. 

Зато я до 3.3.6 обновился....САМ

Убежал обратно на 3.3.5
Пожалуй на данном этапе соглашусь с чьей-то мыслью о том, что если все и так работает - нефиг туда лезть