How do I remove widget border box?

[paulnicholson]

I want to remove the widget border box in vbulletin suite 4.0.8. I am inserting a facebook like box and I have to sacrifice information and make it thinner. The widget boxes make my site look amateur as well. Anyone know how to remove the border so users can only see the contents?

[Lynne]

I'm not sure exactly what you want (an image always helps), but the border is defined in ".cms_widget", so you can add this to additional.css to get rid of it:
.cms_widget {border:none;}

[paulnicholson]

Where is that located please? I'm pretty new.

[Lynne]

addiitional.css is a template. It's in the CSS Templates group.

[paulnicholson]

Can you give me a clue as to how to find that please?

[Lynne]

Style Manager > find style > Edit Templates > double-click on CSS Templates group and it's right there.

[oxide11]

Nice one can you give me a more functions info where i can manage widgets by addiitional.css.
For example how to remove the icon from widgets.. can i do it form additional.ccs ?

[Lynne]

You would have to edit the template for the widget to remove the image.

[wombycat]

I'm trying to get rid of the lines below from Version 4.1.6

http://reactgaming.net.au/images/misc/help.jpg

I tried this

I'm not sure exactly what you want (an image always helps), but the border is defined in ".cms_widget", so you can add this to additional.css to get rid of it:
.cms_widget {border:none;}


so that my additional.css template looked like this below


div.steamprofile{
float:right;
display:block;
z-index:300;
}
.cms_widget {border:none;}


Is that what you meant or was I being to literal?

[Lynne]

That looks correct. Did you try it?

[wombycat]

That looks correct. Did you try it?

Yep that is currently in the additional.css on this site (http://reactgaming.net.au/)

I'm not very skilled with vbulletin, giving myself a crash course. Is it possible that the style I am using is preventing me from removing them?

In the mean time I will test it on another style.

EDIT: Version 4.1.6

[Lynne]

No, I was referring to the article you were talking about that is about modifying the template. I seem to recall they then post the plugin code. My vB4 article has the same plugin code in it.

[wombycat]

What I did to remove the borders was create different template code for both vbcms_widget_static_page and vbcms_widget_execphp_page. These are the two template I created:

vbcms_widget_static_page_raw:
{vb:raw static_html}
and
vbcms_php_raw:
{vb:raw output}

so

vbcms_widget_static_page ---> vbcms_widget_static_page (in the static html widget)

vbcms_widget_execphp_page ---> vbcms_php_raw (in the PHP direct execution)

These will stripe the widgets down to just content as seen here (http://reactgaming.net.au/)

As for the navigation I could not work it out, so I just used an alternative navigation method :)

[DavoteK]

@wombycat: Legend, nice one. Worked perfectly.

[Mondi]

Outstanding post - just what I was looking for!

Quick one: Any suggestions how to make the 'Menu' borderless as well?

[Section Navigation- JS enhanced - 'vbcms_widget_sectionnavext_page' template?]

Thanks heaps in advance!