Стиль для vBulletin My Orange Grove

W

Wmboard

#1
Стиль для vBulletin My Orange Grove

А как вам форум в черно-оранжевых тонах? :)
В данной теме представлен стиль для vBulletin My Orange Grove. Стиль для линейки vBulletin 3.8.х. Данный стиль никогда не ставил. Лично мне такие стили не очень нравятся, но несомненно кому-то пригодится :)

Внешний вид стиля на картинке.
Сам стиль в атаче. В комплекте PSD файлы кнопочек.
 
V

Viuga

#2
Почему этот стиль у пользователей отображается не на всю ширину?
В настройках основная ширина таблицы - 95%
Я вижу на всю ширину страницы

И еще вопрос, два вопроса (во вложении):
- что с кнопкой изображения?
- что с кнопкой новые сообщения? я ее планирую убрать, но при наведении мыши слово "сообщения" появляется ниже.
 
W

Wmboard

#3
Viuga написал(а):
В настройках основная ширина таблицы - 95%
Нажмите для раскрытия...

Нужно поставить 100%

Viuga написал(а):
- что с кнопкой изображения?
Нажмите для раскрытия...
Она не в стиле навбара. У навбара стиль с подвывертом. Нужно зайти в нужный шаблон хака и прописать тот стиль, который прописан в навбаре.

Viuga написал(а):
- что с кнопкой новые сообщения? я ее планирую убрать, но при наведении мыши слово "сообщения" появляется ниже.
Нажмите для раскрытия...
Ширина фиксированная скорее всего, в навбар не влезает все что у тебя там есть. Уберешь, проблемы не будет :)
 
V

Viuga

#5
#9932CC url(images/orange_g/gradients/gradient_thead.gif) repeat-x top left

В стандартных атрибутах CSS фон, там эта строчка.
Очень яркий оранжевый режет глаза, я хочу другой цвет поставить.
Посмотрела путь на сервере, скачала картинку gif, там вот это


Скажите, пожалуйста, как это поменять?
 
W

Wmboard

#6
Сделать свою картинку gradient_thead.gif
В таком же разрешении, размеров, но своего цвета.
Заменить своей ту, что есть.
Цвет #9932CC заменить на нужный
 
V

Viuga

#7
Я больше всего боялась этого ответа :D
Думала до последнего, ну может есть способ проще, держала кулачки... Нет.
Ладно, сделаем. Покажу потом :)
 
V

Viuga

#8
Даже не знаю, какой бы кусочек показать, чтобы все стало ясно :)
Теперь у меня вот так, глаза не режет, все спокойно.
 
W

Wmboard

#9
Поправь навбар. Меню "Изображения", раскрывашка меню menu_open.gif уползла вверх и вправо.
 
V

Viuga

#11
Veter написал(а):
Поправь навбар. Меню "Изображения", раскрывашка меню menu_open.gif уползла вверх и вправо.
Нажмите для раскрытия...
И как поправить?

Добавлено через 5 минут
Кстати, сегодня подумала, что надо календарь убрать в навигацию и такого наваляла, что у меня аж 4 полосы навбара появилось, все кнопки перемешались, разорвалась сама полоса (черная). Ой. Перепугалась. Подумала, что уже не смогу исправить.
Исправила :)
Но с этой малявочкой-раскрывашкой не справиться.:pardon:
 
V

Viuga

#12
Вот это художество. Модератор в ужасе аж крин сделал, но здесь уже 2 полосы, а было 4:D
 
V

Viuga

#13
Еще вопрос. В этом стиле массивная черная шапка. Лого определенного размера встает только посередине, бока аки в морге :D
Чтобы заполнить черноту, нужно обращаться к кодерам? Это уже верстка?
 
W

Wmboard

#14
Заполнить черноту чем?
 
W

Wmboard

#16
Можешь выложить код хедера сюда глянуть...
Может быть что-нибудь решим... Может поможет кто.
 
V

Viuga

#17
Код: 
<!-- logo -->
<a name="top"></a>	<table style="background-color: #FFFFFF;" cellpadding="0" height="200" cellspacing="0" border="0" width="$stylevar[outertablewidth]" align="center">
<tr>
<td width="35" height="200"><img src="images/orange_g/gradients/head_left.gif" border="0" /></td>	<td hegiht="200" style="background: url(images/orange_g/gradients/head_center.gif); repeat: repeat-x top left;" align="center"><a href="$vboptions[bburl]/$vboptions[forumhome].php$session[sessionurl_q]"><img src="$stylevar[titleimage]" border="0" alt="$vboptions[bbtitle]" /></a></td>	<td style="background: url(images/orange_g/gradients/head_center.gif); repeat: repeat-x top left;" align="$stylevar[right]" id="header_right_cell">	<if condition="$ad_location['ad_header_logo']">$ad_location[ad_header_logo]<else /> </if>	</td>
<td width="35" height="200"><img src="images/orange_g/gradients/head_right.gif" border="0" /></td>
</tr>
</table>
<!-- /logo -->
<table class="navbar_y" style="background-image: url(images/orange_g/gradients/navb_center.gif); repeat: repeat-x;" border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td width="41" height="45"><img src="images/orange_g/gradients/navb_left.png" border="0" /></td>
<if condition="$show['member']">	<td class="navbar_button"><a href="usercp.php$session[sessionurl_q]">$vbphrase[user_cp]</a></td>	</if>	<if condition="$show['registerbutton']">	<td class="navbar_button"><a href="register.php$session[sessionurl_q]" rel="nofollow">$vbphrase[register]</a></td>	</if>
<td class="navbar_button"><a href="$vboptions[bburl]/livestream.php$session[sessionurl_q]" <if condition="THIS_SCRIPT == 'livestream'">onclick="checkNew(); return false;"</if>>$vbphrase[live_stream_title]</a></td>
<td class="navbar_button"><a id="vbbloglinks" href="blog.php$session[sessionurl_q]">$vbphrase[blogs]</a><script type="text/javascript">vbmenu_register("vbbloglinks");</script></td>
$template_hook[navbar_buttons_left]	<td class="navbar_button"><a rel="help" href="faq.php$session[sessionurl_q]" accesskey="5">$vbphrase[faq]</a></td>	<if condition="$show['communitylink'] AND $show['popups']">	<td class="navbar_button" align="left"><a id="community" href="$show[nojs_link]#community" rel="nofollow" accesskey="6">$vbphrase[community]</a> <script type="text/javascript"> vbmenu_register("community"); </script></td>	<else />	<if condition="$show['memberslist']">	<td class="navbar_button"><a href="memberlist.php$session[sessionurl_q]">$vbphrase[members_list]</a></td>	</if>	<if condition="$show['quick_links_groups']">	<td class="navbar_button"><a href="group.php?$session[sessionurl]">$vbphrase[social_groups]</a></td>	</if>	</if>
<td class="navbar_button"><a href="calendar.php$session[sessionurl_q]">$vbphrase[calendar]</a></td>	<if condition="$show['popups']">
<if condition="$show['searchbuttons']">	<td class="navbar_button"><a id="navbar_search" href="search.php$session[sessionurl_q]" accesskey="4" rel="nofollow">$vbphrase[search]</a> <if condition="$show['quicksearch']"><script type="text/javascript"> vbmenu_register("navbar_search"); </script></if></td>	</if>	<if condition="$show['member']">	<td class="navbar_button"><a id="usercptools" href="$show[nojs_link]#usercptools" accesskey="3">$vbphrase[quick_links]</a> <script type="text/javascript"> vbmenu_register("usercptools"); </script></td>	</if>	<else />	<if condition="$show['searchbuttons']">	<td class="navbar_button"><a href="search.php$session[sessionurl_q]" accesskey="4">$vbphrase[search]</a></td>	<if condition="$show['member']">	<td class="navbar_button"><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></td>	<else />	<td class="navbar_button"><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></td>	</if>	</if>	<td class="navbar_button"><a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a></td>	<if condition="$show['member']">	<td class="navbar_button"><a href="#" onclick="window.open('misc.php?$session[sessionurl]do=buddylist&focus=1','buddylist','statusbar=no,menubar=no,toolbar=no,scrollbars=yes,resizable=yes,width=250,height=300'); return false;">$vbphrase[open_contacts]</a></td>	</if>	</if>	$template_hook[navbar_buttons_right]	<if condition="$show['member']">	<td class="navbar_button"><a href="login.php?$session[sessionurl]do=logout&logouthash=$bbuserinfo[logouthash]" onclick="return log_out('$vbphrase[sure_you_want_to_log_out]')">$vbphrase[log_out]</a></td></if>
<td width="41" height="45"><img src="images/orange_g/gradients/navb_right.png" border="0" /></td>
</tr></table>
<!-- content table -->
$spacer_open
$_phpinclude_output
$ad_location[ad_header_end]
 
W

Wmboard

#18
Боковушка слева у тебя это: images/orange_g/gradients/head_left.gif
Бэкграунд после нее мостится вот этим элементом: images/orange_g/gradients/head_center.gif
Лого: images/orange_g/gradients/logo.png
Кусочек какой-то справа: images/orange_g/gradients/head_center.gif
И заканчивается вот этим: images/orange_g/gradients/head_right.gif

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

Код: 
 <table style="background-color: #FFFFFF;" cellpadding="0" height="200" cellspacing="0" border="0" width="$stylevar[outertablewidth]" align="center">
<tr>
<td width="35" height="200"><img src="images/orange_g/gradients/head_left.gif" border="0" /></td> <td hegiht="200" style="background: url(images/orange_g/gradients/head_center.gif); repeat: repeat-x top left;" align="center"><a href="$vboptions[bburl]/$vboptions[forumhome].php$session[sessionurl_q]"><img src="$stylevar[titleimage]" border="0" alt="$vboptions[bbtitle]" /></a></td> <td style="background: url(images/orange_g/gradients/head_center.gif); repeat: repeat-x top left;" align="$stylevar[right]" id="header_right_cell"> <if condition="$ad_location['ad_header_logo']">$ad_location[ad_header_logo]<else /> </if> </td>
<td width="35" height="200"><img src="images/orange_g/gradients/head_right.gif" border="0" /></td>
</tr>
</table>

И заменить его своим кодом, интегрировав в его нарисованную картинку.

Ну это я так, навскидку, сама понимаешь пробовать нужно :)
 
W

Wmboard

#20
Очень интересный вопрос :)
Нужно брать и делать. Я не кодер во-первых, и даже на свой последний форум при замене шапки, код мне прислал знакомый. Но если у тебя есть картинка, то можно попробовать "как". Если еще ничего нет, то разговор бессмысленный. Все это теория, которая описывается в разных книжках.
 
V

Viuga

#21
Veter написал(а):
Но если у тебя есть картинка, то можно попробовать "как".
Нажмите для раскрытия...
У меня есть части.
Разговор осмысленный, потому что я все равно это сделаю.
Не сейчас, так через неделю.
Если бы мне было интересно узнать "как" на уровне теории, я бы не спрашивала вообще.
 
W

Wmboard

#22
Если есть части, пришли на почту посмотреть. Может чего и придумаем.
Я не теоретик. Я практик.
 
W

Wmboard

#23
Посмотрел твои картинки.
В общем можно пойти двумя путями с шапкой.

Вариант 1.
Сформировать новую шапку из твоих картинок, согласно имеющимся элементам старой шапки. Все элементы в коде выше. Следовательно тебе нужно твои картинки привести в тот же формат, что и имеющиеся элементы. В этом случае лого остается на месте, фон как я понимаю остается прежний, следовательно нужно добавить зверя. Его нужно вырезать по размерам, и с помощью замены можно воткнуть в шапку. Возможно придется немного поправить код. Сложного там наверное ничего нет, просто нужна внимательность.

Вариант 2.
Я бы пошел этим путем.
Из тех элементов в PSD, что ты мне показала, я бы сформировал шапку в виде картинки png. Целиковой. У тебя там высота 200, ширина ну... возможно 1000 хватит. То есть собираешь шапку в единой картинке, размерами 200 на 1000, без логотипа.

Как будет готово, пиши.
 
V

Viuga

#24
Veter, начну с первого варианта. Попробую. Буду мучить тестовый форум:D
 
V

Viuga

#25
Я его еще осветлила.
Дело только за человеческой шапкой :)
 
V

Viuga

#26
Veter, по варианту 1 получилось что-то очень страшное, но получилось))
На денвере не работает система замены расширений :D а картинки в gif сильно теряют качество.
Попробовала на живом - :crazy:
[OFF]Хорошо, что на форуме никого не было:D[/OFF]
Veter написал(а):
фон как я понимаю остается прежний, следовательно нужно добавить зверя. Его нужно вырезать по размерам, и с помощью замены можно воткнуть в шапку.
Нажмите для раскрытия...
Фон - это и есть те картинки в коде, на денвере я их меняла много раз. Таким образом, шапку можно сделать любого цвета, но просто добавить зверя заменой не получится или получится вот это:



Другими методами не заменить.

Так что, только вариант 2, но целая картинка еще не готова.
 
W

Wmboard

#27
Думаю, что ты не ту картинку заменила. Зверя нужно добавлять к логотипу. То есть перерисовывать логотип.
А вообще вариант 2.
 
Get involved!

Here you can only see a limited number of comments. On СЕО Форум Вебмастеров you see all comments and all functions are available to you. To the thread