Editing 'Default' WHMCS Template

[mark4785]

I recently installed WHMCS and selected 'Default' as the template that I'd like to use in the General tab of the administrative area of WHMCS.

 

Since doing this I've been editing the CSS files named whmcs.css and bootstrap.css to change some of the colours, however, I'm not sure which file I'd need to edit to change the positioning and width of the menu that is included with the default template.

 

I'd be very grateful if anybody could give some pointers as I'm a little stuck.

 

 

Regards,

Mark.

 

- - - Updated - - -

 

I have come across a line in whmcs.css which displays the following:

 

"}

.navbar .navbar-inner {

height: 40px;"

 

But where is the width variable?

[DennisHermannsen]

Should be at around line 233.

.navbar .navbar-inner {

margin: 0 auto;

padding: 0 20px;

width: 960px;

height: 40px;

-moz-border-radius: 6px;

-webkit-border-radius: 6px;

-o-border-radius: 6px;

border-radius: 6px;

}

 

If you're using Google Chrome, right click and inspect element - that will show you all css attributes for the element.

[mark4785]

Should be at around line 233.

.navbar .navbar-inner {

margin: 0 auto;

padding: 0 20px;

width: 960px;

height: 40px;

-moz-border-radius: 6px;

-webkit-border-radius: 6px;

-o-border-radius: 6px;

border-radius: 6px;

}

 

If you're using Google Chrome, right click and inspect element - that will show you all css attributes for the element.

 

Hi there,

 

Yes I actually used the inspect element to find the names of each element and then tried to find the element names in the corresponding css file.

 

I've come across the .navbar .navbar-inner element and I've already reduced the width to 700px. After saving the css file and uploading it to the server, the menu width didn't change so I put it back to 960px.

 

Why would the width not change in response to, well... me changing the width in the whmcs.css? Could a fluid grid configuration be overriding it?

[sentq]

add the following at the end of whmcs.css file:

[font=Consolas].navbar .navbar-inner {
width: 800px; /* Add your Menu width here */
}
[/font][font=Consolas].navbar-fixed-top .container, .navbar-fixed-bottom .container {
width: auto;
}[/font]

[Infopro]

I recently installed WHMCS and selected 'Default' as the template that I'd like to use in the General tab of the administrative area of WHMCS.

 

...

 

In doing so, the next time you update WHMCS, and upload the new files, your custom changes will be overwritten.

 

A better idea would be to copy the entire directory, rename it to, MyDefault, for example, and then in your WHMCS admin settings, select that one for the one you'd like to use. Modify it however you like. Updates will not touch it.

 

But, you will need to compare your changes in the "MyDefault" to the "Default" after every upgrade, and update your custom style to have any new changes introduced in an future update.

[mark4785]

In doing so, the next time you update WHMCS, and upload the new files, your custom changes will be overwritten.

 

A better idea would be to copy the entire directory, rename it to, MyDefault, for example, and then in your WHMCS admin settings, select that one for the one you'd like to use. Modify it however you like. Updates will not touch it.

 

But, you will need to compare your changes in the "MyDefault" to the "Default" after every upgrade, and update your custom style to have any new changes introduced in an future update.

 

I've been doing this already but didn't mention it as I didn't think anybody would need to know. Many thanks for mentioning it as other viewers of the thread may employing the method that you have pointed out.

[dev_sarks]

Did you clear the cache after updating the CSS and template file ?