Powered by Invision Power Board
Здравствуйте Гость ( Вход | Регистрация ) Выслать повторно письмо для активации

Forum Rules Правила раздела

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

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

Создание тем в разделе: Ваша тема будет удалена, если она нарушает правила форума/раздела.

Страницы: (2) [1] 2   ( Перейти к первому непрочитанному сообщению ) Reply to this topicStart new topicStart Poll

> Пошаговая инструкция замены логотипа (часть 2), Продолжение темы
AweDer
Отправлено: Янв 21 2015, 00:41
Quote Post


Еntеr нажат, к чему теперь рыданья...
Group Icon

Группа: Пользователи
Сообщений: 701
Пользователь №: 3 536
Регистрация: 5-Марта 12
Из: Великобритания
Member Offline

Репутация: 16




Что такое логотип ?

Вот пример логотипа на форуме :

user posted image

Как заменить стандартный логотип , на свой ?

Сперва вам стоит рассказать немного о различных тонкостях в замене логотипа.
Если верить опросам на множествах сайтов, форумах, дневников и так далее... То у пользователей интернета, стоит такое разрешение монитора :
45 % 1024х768
30 % 1280*1024
15 % 1600х1200
10 % другое разрешение

Зачем я это говорю ? Все просто если вы сделаете логотип с разрешение в 1200х220 (например) то тогда у пользователей, у которых стоит разрешение 1024х768 ваше лого будет выглядеть вот так :


user posted image

Просто напросто ваше лого будет выезжать за пределы форума...Не очень хорошо, да ? Как это исправить ? Это я вам капельку попозже расскажу.


А теперь ещё одна тонкость замены логотипа, вам многие говорили поставить в код логотипа width="100%" ? Ну и как, помогло ? Помогло, конечно...но вы опять же. не думаете о первой тонкости замены логотипа, разрешение других пользователей !

Смотрим простой пример у админа сего форума стояло разрешение 1024х768 и он делал лого под своё разрешение...а у меня стоит разрешение 1280х1024 иногда 1600х1200...и смотрим, что становиться с логотипом если мы используем with="100%" :


user posted image

Так что на мой взгляд width="100%" лучше в логотипе не использовать.


Так вы наверное уже устали читать, теперь я расскажу вам пару способов замены логотипа.

1. И на мой взгляд самый правильный способ замены логотипа :

а) Первым делом нам стоит создать логотип. Тут я не стану рассказывать вам, как его делать, тема не об этом...но скажу вам, что фотошоп творит чудеса smile.gif
Для примера логотип возьму со своего портала.
Вот логотип :

user posted image

Тут тоже стоит задуматься над размером логотипа, но мой вам совет делать лого с разрешением 800х***.

б) Так теперь когда логотип у нас есть, что дальше ? Все очень просто теперь нам надо заходить в "админку" Путь :

Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> находим ваш скин и кликаем на ссылку "HTML" -> Теперь смотри в правый бок там есть надпись "Быстрый переход" "Редактировать шапку форума" кликае ОК

Теперь там находим вот это :


Код
<div id='logostrip'>
 <a href='{ibf.script_url}' title='Board Home'><img src='{ibf.vars.img_url}/logo4.gif' alt='Powered by Invision Power Board' border="0" /></a>
</div>


Теперь, это все можно удалять и вместо этого вставляем вот такой вот код :

Код
<div id='logostrip'>
 <a href='{ibf.script_url}' title='Название форума'><img src='Путь к логотипу' alt='Powered by Invision Power Board' border="0" /></a>
</div>


Но теперь другая проблема, лого мы поставили, но это не правильно отображаться (смотреть скриншот) точнее оно не растягивается, что делать ?

user posted image


в) А что бы это исправить нам надо будет использовать логострип. Опять вопросы, что такое логострип ? Сейчас все расскажу...

Но сперва, вам надо сделать картинку для логострипа, вам надо вырезать
из лого правый кусочек... Пример :

user posted image

Вот и все, так поехали дальше.

Сейчас нам надо опять в "админку".
Путь :

Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> находим ваш скин и кликаем на ссылку "CSS"

Там нам надо найти #logostrip, выглядит он примерно так :


Код
#logostrip { background-image: url(style_images/<#IMG_DIR#>/tile_back.gif); border: 1px solid #FFF; height: 68px; margin: 0; padding: 0; }


И теперь удаляем его и вместо него вставляем вот этот логострип :

Код
#logostrip { width: 100%;height: 100%;background-repeat: repeatxy;border: 1px solid #101010;background-image: url(адрес картинка для логострипа); }


Есть ещё маленькое примечание, некоторые пользователе говорили, что с данным логострипом у них медленно загружался форум...лично у меня таких проблем небыло, да и у моих пользователей тоже. Но если у вас тоже из-за данного логострипа будет медленно грузиться форум, попробуйте использовать след. логострип...он стоит на форуме тех. поддержки. (сам его у себя на форуме не ставил, небыло необходимости.)

Код
#logostrip {
border:1px solid #345487;
background-color: #3860BB;
background-image:url(адрес картинки для логострипа);
height: размер картинки логострипа px;
padding:0px;
margin:0px; }



2. Способ номер два, не такой уж и хороший...но все же я смотрю, многие им пользуются, вот и решил его тоже написать. Тут все очень просто.

а) Первым делом нам стоит создать логотип. Тут я не стану рассказывать вам, как его делать, тема не об этом...но скажу вам, что фотошоп творит чудеса smile.gif
Для примера логотип возьму со своего портала.
Вот логотип :

user posted image

Тут тоже стоит задуматься над размером логотипа, но мой вам совет делать лого с разрешением 800х***.

б) Так теперь когда логотип у нас есть, что дальше ? Все очень просто теперь нам надо заходить в "админку" Путь :

Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> находим ваш скин и кликаем на ссылку "HTML" -> Теперь смотри в правый бок там есть надпись "Быстрый переход" "Редактировать шапку форума" кликае ОК

Теперь там находим вот это :


Код
<div id='logostrip'>
 <a href='{ibf.script_url}' title='Board Home'><img src='{ibf.vars.img_url}/logo4.gif' alt='Powered by Invision Power Board' border="0" /></a>
</div>


Теперь, это все можно удалять и вместо этого вставляем вот такой вот код :

Код
<div id='logostrip'>
 <a href='{ibf.script_url}' title='название вашего форума'><img src='путь картинки для логотипа' alt='название форума' border="0" width="100%" /></a>
</div>


Если использовать данный способ замены логотипо, то лого растягивается и у пользователей у которых стоит большое разрешение (например 1600х1200) оно будет не очень то красиво отображаться.

Автор темы http://ipboard.net/index.php?&act=Profile&CODE=03&MID=518 , с первой частью темы можно ознакомиться тут http://ipboard.net/index.php?showtopic=1312&st=0


--------------------
Top
reversxc10
Отправлено: Янв 21 2015, 13:33
Quote Post


Новичок
Group Icon

Группа: Пользователи
Сообщений: 16
Пользователь №: 5 200
Регистрация: 20-Января 15
Member Offline

Репутация: нет




"Исходник делаем 970px × 180px (в масштабе 1,198px × 222px)я на свой форум так фотошопил, напомню еще одно внимательно читаем всю тему и решение найдется например вариант установки логотипа тут описан очень доступно: http://ipboard.net/index.php?showtopic=...t&p=13429"

Почему то логострип не "работает"? Я так понимаю он должен вставлять подготовленное изображения(изображения логострипа-правого края логотипа) и тянуть его при необходимости в ширину окна, т.е. заполнять пустоту в правой части шапки.
Может не работать логострип из за того, что я указал высоту и ширину логотипа(в коде указал адрес логотипа (размером 1600х441) и в код добавил желаемый размер в 4 раза меньше 110х400)?

Это сообщение отредактировал reversxc10 - Янв 21 2015, 13:34
Top
AweDer
Отправлено: Янв 31 2015, 04:11
Quote Post


Еntеr нажат, к чему теперь рыданья...
Group Icon

Группа: Пользователи
Сообщений: 701
Пользователь №: 3 536
Регистрация: 5-Марта 12
Из: Великобритания
Member Offline

Репутация: 16




reversxc10,зачем указывать в коде размер логотипа? вам нужно сама картинка лого таких размеров, в коде ничего указывать не нужно.


--------------------
Top
reversxc10
Отправлено: Фев 2 2015, 20:21
Quote Post


Новичок
Group Icon

Группа: Пользователи
Сообщений: 16
Пользователь №: 5 200
Регистрация: 20-Января 15
Member Offline

Репутация: нет




т.е. предлагаете, каждый раз когда захочется изменить ну скажем высоту шапки логотипа, делать свое изображение логотипа?
Решение так и не найдено.
Top
militarizm
Отправлено: Фев 27 2015, 21:38
Quote Post


Новичок
Group Icon

Группа: Пользователи
Сообщений: 14
Пользователь №: 4 542
Регистрация: 25-Июня 14
Из: Рига
Member Offline

Репутация: нет




Вот с этого пункта можно поподробнее для конкретно меня, куда тыркать, я уже перетыркал все что мог.
Главная страница AЦ -> Скины и Шаблоны -> Настройка скинов -> находим ваш скин и кликаем на ссылку "HTML" -> Теперь смотри в правый бок там есть надпись "Быстрый переход" "Редактировать шапку форума" кликае ОК


Присоединённые изображения
Присоединённое изображение
Top
asm-a
Отправлено: Фев 27 2015, 21:42
Quote Post


<? echo"Кодер" ?>
Group Icon

Группа: Пользователи
Сообщений: 964
Пользователь №: 2 333
Регистрация: 29-Май 10
Member Offline

Репутация: 58




Все намного проще, чем вам кажется.

Выбираете Настройка скинов, перед тем скином, который вы бы хотели редактировать, нажимаете кнопку HTML.
Присоединённое изображение

После того, как вы нажали эту кнопку, будет справа быстрый переход на редактирование шапки. Скриншот так же ниже.
Присоединённое изображение


--------------------
Уважаемые посетители, используйте ПОИСК прежде чем что-то спросить.
--------------
За пределами форума технической поддержки помогаю только на ПЛАТНОЙ основе, независимо, есть ли у вас форум на нашем сервисе. Если есть вопросы или предложения, можете смело обратиться ко мне в ЛС
--------------
Мой сайт
--------------
xxx: Сегодня был у нашего админа, увидел на столе в горах хлама листок, весь исписанный фразой «Hello world». Оказалось, он так ручку расписывает.
Top
militarizm
Отправлено: Фев 27 2015, 21:56
Quote Post


Новичок
Group Icon

Группа: Пользователи
Сообщений: 14
Пользователь №: 4 542
Регистрация: 25-Июня 14
Из: Рига
Member Offline

Репутация: нет




Спасибо, через этот шаг прорвался smile.gif

Теперь возник очередной глупый вопрос - куда девать сам логотип или логострип - на сторонний сайт или где-то можно его на форуме хранить? Если да то куда его сохранить?

Это сообщение отредактировал militarizm - Фев 27 2015, 22:03
Top
asm-a
Отправлено: Фев 27 2015, 22:15
Quote Post


<? echo"Кодер" ?>
Group Icon

Группа: Пользователи
Сообщений: 964
Пользователь №: 2 333
Регистрация: 29-Май 10
Member Offline

Репутация: 58




Цитата (militarizm @ Сегодня, 21:56)
Теперь возник очередной глупый вопрос - куда девать сам логотип или логострип - на сторонний сайт или где-то можно его на форуме хранить? Если да то куда его сохранить?

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


--------------------
Уважаемые посетители, используйте ПОИСК прежде чем что-то спросить.
--------------
За пределами форума технической поддержки помогаю только на ПЛАТНОЙ основе, независимо, есть ли у вас форум на нашем сервисе. Если есть вопросы или предложения, можете смело обратиться ко мне в ЛС
--------------
Мой сайт
--------------
xxx: Сегодня был у нашего админа, увидел на столе в горах хлама листок, весь исписанный фразой «Hello world». Оказалось, он так ручку расписывает.
Top
militarizm
Отправлено: Фев 27 2015, 23:50
Quote Post


Новичок
Group Icon

Группа: Пользователи
Сообщений: 14
Пользователь №: 4 542
Регистрация: 25-Июня 14
Из: Рига
Member Offline

Репутация: нет




Нда, пока лажа получается... Там по ходу еще какие-то настройки нужны, чтобы надписи не налезали на лого. Ну или лого ужимать mad.gif
Присоединённое изображение


Пока вот так смог всунуть поставив ширину 250, но не айс получается.
Присоединённое изображение

Кусок кода:
<div id='logostrip'>
<a href='{ibf.script_url}' title='militarizm'><img src=' http://militarizm.ipb.su/index.php?act=Att...st&id=8748' alt=' http://militarizm.ipb.su/index.php?showtopic=260' border="0" width="250" align="center" /></a>
</div>

Эффекта от align="center" тоже не вижу huh.gif
Как бы оставить первый вариант лого с нормальным размером, но чтобы надписи нормально разместились?

Это сообщение отредактировал militarizm - Фев 28 2015, 01:25
Top
Mishanya
Отправлено: Фев 28 2015, 13:47
Quote Post


Новичок
Group Icon

Группа: Пользователи
Сообщений: 1
Пользователь №: 5 339
Регистрация: 28-Февраля 15
Member Offline

Репутация: нет




У меня почему то вместо картинки вот такое пишет "Power by invision Power Board" почему?
Top
asm-a
Отправлено: Фев 28 2015, 13:51
Quote Post


<? echo"Кодер" ?>
Group Icon

Группа: Пользователи
Сообщений: 964
Пользователь №: 2 333
Регистрация: 29-Май 10
Member Offline

Репутация: 58




Цитата (Mishanya @ Сегодня, 13:47)
У меня почему то вместо картинки вот такое пишет "Power by invision Power Board" почему?

Потому что вы указали не верный адрес.


--------------------
Уважаемые посетители, используйте ПОИСК прежде чем что-то спросить.
--------------
За пределами форума технической поддержки помогаю только на ПЛАТНОЙ основе, независимо, есть ли у вас форум на нашем сервисе. Если есть вопросы или предложения, можете смело обратиться ко мне в ЛС
--------------
Мой сайт
--------------
xxx: Сегодня был у нашего админа, увидел на столе в горах хлама листок, весь исписанный фразой «Hello world». Оказалось, он так ручку расписывает.
Top
asm-a
Отправлено: Фев 28 2015, 14:07
Quote Post


<? echo"Кодер" ?>
Group Icon

Группа: Пользователи
Сообщений: 964
Пользователь №: 2 333
Регистрация: 29-Май 10
Member Offline

Репутация: 58




Цитата (militarizm @ Вчера, 23:50)
Как бы оставить первый вариант лого с нормальным размером, но чтобы надписи нормально разместились?

Попробуйте в логострипе добавить width: 100%;height: 100%


--------------------
Уважаемые посетители, используйте ПОИСК прежде чем что-то спросить.
--------------
За пределами форума технической поддержки помогаю только на ПЛАТНОЙ основе, независимо, есть ли у вас форум на нашем сервисе. Если есть вопросы или предложения, можете смело обратиться ко мне в ЛС
--------------
Мой сайт
--------------
xxx: Сегодня был у нашего админа, увидел на столе в горах хлама листок, весь исписанный фразой «Hello world». Оказалось, он так ручку расписывает.
Top
militarizm
Отправлено: Фев 28 2015, 15:22
Quote Post


Новичок
Group Icon

Группа: Пользователи
Сообщений: 14
Пользователь №: 4 542
Регистрация: 25-Июня 14
Из: Рига
Member Offline

Репутация: нет




Не помогает - все равно служебные надписи лезут на лого
Top
asm-a
Отправлено: Фев 28 2015, 16:26
Quote Post


<? echo"Кодер" ?>
Group Icon

Группа: Пользователи
Сообщений: 964
Пользователь №: 2 333
Регистрация: 29-Май 10
Member Offline

Репутация: 58




Цитата (militarizm @ Сегодня, 15:22)
Не помогает - все равно служебные надписи лезут на лого

Потому что у вас ссылка кривая. Она должна заканчивается, например, на .jpg. Попробуйте открыть картинку правой кнопкой мыши - открыть изображение. И ссылку вставить вместо вашей http://militarizm.ipb.su/index.php?act=Att...st&id=8748


--------------------
Уважаемые посетители, используйте ПОИСК прежде чем что-то спросить.
--------------
За пределами форума технической поддержки помогаю только на ПЛАТНОЙ основе, независимо, есть ли у вас форум на нашем сервисе. Если есть вопросы или предложения, можете смело обратиться ко мне в ЛС
--------------
Мой сайт
--------------
xxx: Сегодня был у нашего админа, увидел на столе в горах хлама листок, весь исписанный фразой «Hello world». Оказалось, он так ручку расписывает.
Top
militarizm
Отправлено: Фев 28 2015, 22:55
Quote Post


Новичок
Group Icon

Группа: Пользователи
Сообщений: 14
Пользователь №: 4 542
Регистрация: 25-Июня 14
Из: Рига
Member Offline

Репутация: нет




Ссылку с окончанием на JPG из своей темы я достать не смог - ни правой клавишей, ни левой.
Закачал на хостинг.

Теперь вот так выглядит код:
<a href='{ibf.script_url}' title='militarizm'><img src='http://s6.postimg.org/3r3eofhr5/helicopter_gu_014.jpg' alt=' http://militarizm.ipb.su/index.php?showtopic=260' border="0" width: 100%;height: 100% align="center" /></a>
</div>

Результат все тот же:
Присоединённое изображение

Это сообщение отредактировал militarizm - Фев 28 2015, 22:56
Top
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:

Topic Options Страницы: (2) [1] 2  Reply to this topicStart new topicStart Poll