vb.org Archive - Forum Display Enhancements

Page 3 of 9

Last »

Show 40 post(s) from this thread on one page

vb.org Archive (https://vborg.vbsupport.ru/index.php)

- vBulletin 4.x Template Modifications (https://vborg.vbsupport.ru/forumdisplay.php?f=246)

- - Forum Display Enhancements - Fluid 3 part header (https://vborg.vbsupport.ru/showthread.php?t=228319)

Big-Pete

11-25-2009 02:13 PM

Quote:

Originally Posted by syrus.xl (Post 1919767)

There is 5 serious errors in that coding, certain tags not closed, a div tag used within an 'a' tag.

It should be strict xHTML to comply with vBulletin 4.0, otherwise you are just breaking the correct coding. Google would probably penalize you, if that was in every page of your site's header code.

If it was done correctly it would require CSS to be defined and use all div's, not tables. Probably about 4-5 CSS rules is all that it requires, nothing major.

Syrus, Would you be able to do this for us in css? This is exacty what i'd like to use when we change over the main site to vb4..

hoof	11-25-2009 05:06 PM

To do this just add some lines to your CSS and then call it out in the template you want it to display.

Example: for a 3 part image in the CSS add

Code:

#headerFill{

background-image: url(your/path/to image/here.gif);

background-repeat: repeat-x;

height: 120px;

width: 100%;

margin-right: auto;

margin-left: auto;

}

#headerL{

background-image: url(your/path/to image/here.gif);

height: 120px;

background-repeat: no-repeat;

width: 468px;

float: left;

margin-left: -20px;

}

#headerR {

background-image: url(your/path/to image/here.gif);

background-repeat: no-repeat;

height: 120px;

width: 175px;

float: right;

margin-right: -20px;

}

You can name it however you like, I used headerFill, headerR, and headerL. Be sure to put the correct image height and width in. THe margin-right and left is to align the edges to your forum width...you may need to adjust it or remove it.

Then in your header template add the following:

Code:

<div id="headerFill"><div id="headerL"></div><div id="headerR"></div></div>

You should now have a fluid banner :)

Big-Pete

11-26-2009 09:07 AM

@ Hoof, Thankyou for that, Much appreciated!

VonDoom

11-27-2009 12:08 PM

Quote:

Originally Posted by hoof (Post 1920797)

To do this just add some lines to your CSS and then call it out in the template you want it to display.
You should now have a fluid banner :)

sorry for the newb question but v4 has me bent over a barrel witch CSS and where?

TheSupportForum

11-27-2009 12:39 PM

Quote:

Originally Posted by hoof (Post 1920797)

To do this just add some lines to your CSS and then call it out in the template you want it to display.

Example: for a 3 part image in the CSS add

Code:

#headerFill{

background-image: url(your/path/to image/here.gif);

background-repeat: repeat-x;

height: 120px;

width: 100%;

margin-right: auto;

margin-left: auto;

}

#headerL{

background-image: url(your/path/to image/here.gif);

height: 120px;

background-repeat: no-repeat;

width: 468px;

float: left;

margin-left: -20px;

}

#headerR {

background-image: url(your/path/to image/here.gif);

background-repeat: no-repeat;

height: 120px;

width: 175px;

float: right;

margin-right: -20px;

}

Code:

<div id="headerFill"><div id="headerL"></div><div id="headerR"></div></div>

You should now have a fluid banner :)

vb4 no longer using CSS it uses StyleVars

hoof	11-27-2009 12:51 PM

Quote:

Originally Posted by simonhind (Post 1921600)

vb4 no longer using CSS it uses StyleVars

vB4 no longer uses the "Additional CSS Definitions" section, it does use several CSS's in your template list. I use this in the "vbulletin.css" and it works great.

TheSupportForum

11-27-2009 01:40 PM

1 Attachment(s)

Quote:

Originally Posted by hoof (Post 1921604)

vB4 no longer uses the "Additional CSS Definitions" section, it does use several CSS's in your template list. I use this in the "vbulletin.css" and it works great.

i have attached a screenshot of the admincp with main css showing
as you may be aware it mentions

"This CSS file is obsolete and is available here for reference purposes only."

Charlie98902

11-27-2009 02:16 PM

Admin panel>> Styles and Templates>>>>>Edit Templates>>>>>>>vbulletin.css Go there I believe.

mr3oobqatar

11-28-2009 10:37 AM

thanks

oddmud

12-04-2009 01:24 AM

Quote:

Originally Posted by simonhind (Post 1921621)

i have attached a screenshot of the admincp with main css showing
as you may be aware it mentions

"This CSS file is obsolete and is available here for reference purposes only."

That's because you're looking at main.css not vbulletin.css.. i think.

All times are GMT. The time now is 12:04 AM.

Page 3 of 9

Last »

Show 40 post(s) from this thread on one page

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01207 seconds Memory Usage 1,745KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (4)bbcode_code_printable (6)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (4)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (10)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: