Как заставить лого растягиваться на всю ширину в резиновых скинах, независимо от разрешения экрана
Масштабируемый (резиновый) логотип, все версии IPB
Пример: стиль Mystic Cafe Skin
Эффект станет понятен при изменении размера окна.
1. Папки форума на сервере */style_images/, */cache/ и */cache/skin_cache/ должны быть доступны для записи и изменения, CHMOD (права доступа) должен иметь значение 0777.
2. Подбираем картинку размером приблизительно 1000-1200 на 100-200 px и заменяем ею файл logo4.gif (или свое название и расширение, допустимо также jpg и png). Кириллические символы в имени файла недопустимы. Также следите за регистром. Если в имени файла есть ПРОПИСНЫЕ символы, то и в коде его название должно быть соответствующим. Иначе Unux сервера файл не узнают.
3. Открываем расширенный режим редактирования css
Находим id #logostrip
Где
height: 68px;
Заменяем на
height: auto;
4. Теперь открываем редактирование HTML шаблонов > skin global > global_board_header
Находим
img src=’style_images/<#IMG_DIR#>/logo4.gif’ style=’vertical-align:top’ alt=’IPB’ border=’0′
Заменяем на
img src=’style_images/<#IMG_DIR#>/logo4.gif’ style=’vertical-align:top’ alt=’IPB’ border=’0′ width=’100%’
И проверяем эффект на экране 
У меня rugray стоит-это с блогом под рекламу слева.
Не удалось поменять логотип резиновый! И обратно не вернуть)) Теперь Логотипа нет совсем, просто узкая полосочка стандартной шапки 3рх.
До настроек в css и html новый логотип был виден. разве, что криво стоял, но после уже вышеописано.
css)—-
#logostrip{
background: #fff url(style_images//tile_back.png);
border: 0; height: auto; margin: 0; padding: 0;
text-align: left;
html. <div id=\
На том скине все должно работать. Он простой.
Отмените все изменения в шаблоне, и пропишите код снова. Лучше вручную, потому что здесь почему-то портится код. Кавычки «» неправильными могут быть.
в принципе получилось спс.
но не полностью растягивается. Как выбрать правильное соотношение сторон(размеры) сейчас 1200х200
Только методом проб и ошибок. Попробуйте 1250px например. И растягиваться лого должно полностью не смотря ни на что, если правильно делали.
Новый логотип надо вручную залить на сервер, и ни в коем случае не пользоваться инструментом Быстрой смены логотипа, так как это отменит все изменения в skin_global_header. В нашем случае убьется параметр ширины 100% для растягивания.
1250*200 встало как родное. спасибо
скажите пожалуйста как на на сайтах укозы можно так сделать?
Думаю, что примерно также, если есть возможность редактировать css и html.
Иначе называется класс css и другой путь к картинке (вместо style_images/< #IMG_DIR#>/).
Тут ключевое: высота (height: auto;) в классе для шапки в css и ширина (width=»100%») в свойствах картинки логотипа в html.
Работать резиновая шапка будет на всех движках сайтов и форумов.
там CSS подругому както сделано)) там нет #logostrip
Ну и что, что нет. Все равно должен быть какой-то класс для шапки. Вы в исходном html коде браузером посмотрите, что вообще за шапку отвечает и как она устроена.
А еще можно спросить на юкозовском форуме поддержки.
Я не могу сделать 4-й пункт! там просто такого нет (у меня ipb 2.3.6)
Похожее… точнее связано с logo4 — style_images/ip.boardpr/logo4.gif’ alt=’IPB’ style=’vertical-align:top’ border=’0′
В скинах код может чуть отличаться. Инструкция писалась для стандартного.
Все сделал как написано. Растягивается только в Firefox. Пробую в других браузерах — опера, ие, хром — не растягивается ((( в чем косяк?
Синтаксис проверяйте.
Не копируйте отсюда код, а вручную прописывайте.
Скажите.. Все сделал по инструкции.. Все вроде супер (получилось)=) И спасибо за «Синтаксис»
Только шапка стала в два раза больше высотой…
Скажите с чем это может быть связано? И как исправить? Зарание спасибо !
Связано с пропорциями исходной картинки…
Ясно. А исправить то как? Просто, я никак не могу уменьшить высоту! Все значения перепробовал! Никак… Пожете подсказать?
Поставил как описано, но в Опере и IE не работало
В Мозиле проблем нет
Сделал такой код и все заработало
ipsclass->base_url}’><img src='style_images//logo4.gif’ style=’vertical-align:top’ alt=’IPB’ border=’0′ Width=’100%’ />
Может кому пригодиться
Код зарезало, вот новый
ipsclass->base_url}’><img src='style_images//logo4.gif’ style=’vertical-align:top’ alt=’IPB’ border=’0′ Width=’100%’ />
Теперь попробуйте этот код вставить…
Все кавычки надо вручную писать. Да и слеш двойной…
Как я делал !
заходим в defaultHeader
после logo дописываем:
['logo']}’ width=’100%’ height=’auto’/>
Ну и зачем было тут это показывать. Объясняла же. Код здесь бьется. То, что Вы сейчас запостили, не годится для использования без ручной правки.
а скажите пожалуйста, а как сделать, так, что б логотип не был ссылкой, перерыл все, но не могу найти где в хтмл нужно убрать ссылку с изображения… Просто я сделал логотип таким образом, что он залазит на шаблон, но тем самым я не могу нажимать на кнопки, так как лого — ссылка, и всегда попадаю на главную…. а так он будет просто картинкой… и я смогу нажимать на кнрпки …
СПАСИБО!!!
skin global > global_board_header
Убить ссылку