Forum size

[Danloona]

Hi again.

I'd like to ask where I can increase size of my forum ? as now it's a bit small.

Thanks

[Mark.B]

Do you mean width, or font size, or something else?

[Danloona]

Width, font size, icon size. I want to make forum bigger a bit, now everything is smaller.

[Wayne Luke]

Width and Font Sizes are controlled by CSS

Forum Width - wrapper_max_width
Font Size - body_font (5.4.4), global_text_font (5.4.5)

Be careful about using percentages with font sizes. Currently the font size percentage will be relative to its parent elements. So if you have an parent that sets the font to 12 pixels and then use a 10% percentage in the child, the font size in the child will be 1.2 pixels (barely visible and not legible on most devices).

Most of the Icons are controlled with the sprite_icons_general.svg template in the style. These can also be resized with CSS but it takes more knowledge. There is information here: https://css-tricks.com/scale-svg/. You can control the colors of the images by editing the icon_* style variables.

You can see all the sprites on the CSS Examples page built into your software. Login is an Admine and add /special/css-examples to your vbulletin site's homepage URL to see the page.

[Danloona]

Thanks again Wayne, I found it out to change forum width. I got a problem when I increased font size of footer, everything is fine, apart from footer copyright which becomes bigger. How can I make so footer font to be smaller as standard?

So you saying that it's a problem if I will increase font size of my forum?

[Wayne Luke]

You can control the footer copyright by applying custom CSS to the .footer_copyright class. For example:

.footer_copyright {font-size: 10px;}

Didn't say anything about problems with increasing font size. However increasing the font size can cause wrapping and some text to disappear off screen. Depends on where the text is and the amount of space provided for it. As with all customizations, you'll have to experiment and adjust the sizes until you get the results you want.

[Danloona]

You can control the footer copyright by applying custom CSS to the .footer_copyright class. For example:

.footer_copyright {font-size: 10px;}

Didn't say anything about problems with increasing font size. However increasing the font size can cause wrapping and some text to disappear off screen. Depends on where the text is and the amount of space provided for it. As with all customizations, you'll have to experiment and adjust the sizes until you get the results you want.

Thanks for code.

It could affect font size on devices as well? such Tablets and phones ?

[Wayne Luke]

yes. CSS will affect font sizes on all devices... phones, tables, laptops, computers, televisions. Anything with a web browser.

[Danloona]

Ok. Thanks a lot Wayne. I will leave as how it is then.

[Danloona]

You can control the footer copyright by applying custom CSS to the .footer_copyright class. For example:

.footer_copyright {font-size: 10px;}

Didn't say anything about problems with increasing font size. However increasing the font size can cause wrapping and some text to disappear off screen. Depends on where the text is and the amount of space provided for it. As with all customizations, you'll have to experiment and adjust the sizes until you get the results you want.

didn't made any changes on devices, is there any other options ? Thanks

[Wayne Luke]

You'll have to use your browser's developer tools and inspect the elements you want to change. From there you can write your custom CSS and customize the site.

https://developers.google.com/web/tools/chrome-devtools/inspect-styles/edit-styles