Закрыть ... [X]

Как сделать себе шапку для форума

После долгих поисков в интернете и тестовых проверок того, что там советуют, выкладываю для всех подробную инструкцию замены стандартной шапки форума на свой рисунок.
Обращаю Ваше внимание на то, что речь идёт не о замене логотипа, а именно о полной замене шапки (хедера).
То есть, делаем из этого:
17-10-2012 16-26-04.jpg

что-нибудь вроде вот этого:

17-10-2012 16-28-06.jpg

На данный момент я предлагаю Вам зафиксировать ширину своего форума, чтобы не гадать, как сделать так, чтобы ваш рисунок удлинялся или укорачивался вместе с форумом. Если вы используете мод портала, то рекомендуемая минимальная ширина - 1280 пикселей. Больше - можно. Меньше - нельзя (модули портала съедут в сторону и будет, мягко говоря, некрасиво)

Ширина вашего рисунка расчитывается просто: От ширины форума отнимайте 40 пикселей (20 справа и 20 слева). То есть, если вы выбрали ширину в 1400 пикс., то ширина вашего рисунка должна быть 1360 пикс. Но я буду использовать пример с шириной форума в 1280 пикс.

17-10-2012 16-40-04.jpg

Итак.
1) Идём в Админку и задаём все необходимые значения: фиксируем ширину форума и отключаем отображение названия и описания сайта (чтобы они не накладывались на наш рисунок).

17-10-2012 16-41-37.jpg

2) Подготавливаем свой рисунок с учётом его ширины (высоту рисунка определяйте сами на свой вкус).
Формат рисунка - любой распространённый (но чем меньше будет "весить" ваш рисунок, тем быстрее он будет загружаться при открытии вашего форума.
Если рисунок полноцветный (как в моём примере), то предпочтительнее (на мой взгляд) использовать формат.jpg Название рисунка - на ваш вкус.
Допустим, что мы назвали его myheader.jpg И размеры нашего рисунка - 1240 на 200 пикс.

3) Загружаем готовый рисунок на сервер в папку styles/prosilver/theme/images/

4) Потом идём в папку styles/prosilver/theme/ и открываем в ней файл common.css
Ищем в нём

Code: Select all.headerbar {
   background: #ebebeb none repeat-x 0 шапку 0;
   color: #FFFFFF;
   padding: 0 5px;
И после этого фрагмента добавляем height: 200px; (в соответствии с высотой используемого в нашем примере рисунка - 200px).

Должно получиться:

Code: Select all.headerbar {
   background: #ebebeb none repeat-x 0 0;
   color: #FFFFFF;
   padding: 0 5px;
   height: 200px; Сохраняем и закрываем файл.

5) В этой же папке открываем файлик colours.css
В нём ищем фрагмент:

Code: Select all.headerbar {
   background-color: #092a5d;
   background-image: url("{T_THEME_PATH}/images/bg_header.gif");
   color: #FFFFFF; Меняем в этом фрагменте название рисунка шапки bg_header.gif на название нашего рисунка - myheader.jpg.
Соответственно, должно получиться:
Code: Select all.headerbar {
   background-color: #092a5d;
   background-image: url("{T_THEME_PATH}/images/myheader.jpg");
   color: #FFFFFF; Сохраняем и закрываем файл.

6) Обновляем шаблоны, темы и чистим хэш.

7) Идём в Админку и отключаем изображение стандартного логотипа:

17-10-2012 17-19-51.jpg

17-10-2012 17-21-20.jpg

17-10-2012 17-22-15.jpg

17-10-2012 17-23-10.jpg

17-10-2012 17-23-55.jpg

17-10-2012 17-24-41.jpg

В принципе, это можно сделать и сразу после первого шага (пока вы не вышли из Админки) :smile:

Вот, собственно, и всё. Теперь у вашего форума новая шапка, сделанная согласно вашему высокому вкусу! :cyclop::cyclop::cyclop:

Ну, или согласно моему низкому вкусу:

Так выглядит страница портала

17-10-2012 16-16-28.jpg

Страница галереи

17-10-2012 17-43-44.jpg

Страница форума

17-10-2012 17-44-31.jpg

Как видим, всё везде точно подогнано и нигде ничего не вылезает. :)

В течение какого-то времени можете посмотреть на это "живьём" по адресу www.joteruso.ru
Сразу предупреждаю, что это моя тестовая площадка и там постоянно происходят какие-то изменения!


Поделись с друзьями



Рекомендуем посмотреть ещё:



Как сделать шапку для форума самп Видео на Запорожском портале Как можно лечить геморрой при домашних условиях

Как сделать себе шапку для форума Как сделать себе шапку для форума Как сделать себе шапку для форума Как сделать себе шапку для форума Как сделать себе шапку для форума Как сделать себе шапку для форума Как сделать себе шапку для форума

ШОКИРУЮЩИЕ НОВОСТИ