Changing Colours

ejyheng · May 2016

Where to change colour for:

Menu List background colour (Link [Links visible only for registered users])
Call to action button and mouse over colour (Link [Links visible only for registered users]- In Franchising section - ENQUIRE NOW!)
Tab content (Background colour-active/inactive) Link [Links visible only for registered users]

Thanks.

Albert · May 2016

Hi,

1. Colors > Menu & Action Bar section.

2. This color can be changed with an extra css:

.call_to_action .call_center .button { color: #000 !important; background: #FFF !important; }
.call_to_action .call_center .button i { color: #000 !important; background: #FFF !important; }

3.

.tabs_vertical.ui-tabs .ui-tabs-nav li a { background: #000 !important; color: #FFF !important; }
.accordion .question .answer, .ui-tabs .ui-tabs-panel, .ui-tabs .ui-tabs-nav li.ui-state-active a, .ui-tabs .ui-tabs-nav li.ui-tabs-selected::after, .ui-tabs .ui-tabs-nav li.ui-state-active::after, .tabs_vertical.ui-tabs .ui-tabs-nav li.ui-state-active a { background: #000 !important; color: #FFF !important; }

ejyheng · May 2016

Thanks! Is there a tutorial that we can read on CSS coding for BeTheme?

More colour-related questions:

1. Menubar background: I changed the colour in suggested section but background colour didn't change. The menubar I am referring to is where "Home, About Us, Our Menu....." is, on top of the page (Underneath logo). Link [Links visible only for registered users]

2. Same "call to action button", what code to use to change font colour, size, formatting (bold/italic/underline)? Link [Links visible only for registered users]

3. On menu [Links visible only for registered users] (where Smoothies, Juices, Frozen Yogurt are), what code do we use to change:

- Background colour

- Mouse-Over colour (Background and font)

Albert · May 2016

Yes, you can find tutorial on http://themes.muffingroup.com/betheme/documentation/#theme-customizations

1. Yes, this background can be changed from that section. It's Top Bar Left option. We checked it already and it works of course.

2. For that use:

.call_to_action .call_left h3 { font-size: 30px !important; color: #000 !important; text-decoration: underline !important; }
.call_to_action .call_center .button { background: #000 !important; color: #FFF !important; font-size: 20px !important; }
.call_to_action .call_center .button i { background: #000 !important; color: #FFF !important; font-size: 20px !important; }
.call_to_action .call_right .desc { background: #000 !important; color: #FFF !important; font-size: 20px !important; }

3.

.widget_archive ul, .widget_nav_menu ul { background: #000 !important; }
.widget_archive ul li a:hover, .widget_nav_menu ul li a:hover { color: #FFF !important; }

ejyheng · August 2017

Hi, how do we change the bgcolor in side menu (Refer to attached screenshot [Links visible only for registered users], pointed by red arrows).

URL [Links visible only for registered users] here.

Thank you.

Bryan · August 2017

Here you go

.widget_archive ul, .widget_nav_menu ul {
	background: transparent !important;
}

ejyheng · August 2017

Thanks. Can you provide the code for #000 (white colour) background please.

Bryan · August 2017

Change the transparent to your color.

ejyheng · August 2017

Hi, thanks for the comment but color has changed. (Refer screenshot here [Links visible only for registered users])

Page URL [Links visible only for registered users]

Bryan · August 2017

And the menu is white, what exactly do you have in mind.
[Links visible only for registered users]

ejyheng · November 2017

How to change colour for the below items? We would like our page to look similar to the sample page (See below links):

Our Page [Links visible only for registered users]

Sample Page [Links visible only for registered users]

A) Accordion:

When tab is collapsed:

'+' and '-' bgcolor = green
'+' and '-' font colour = black and bolded
Tab title font colour = black, font size = bigger
Tab title bgcolor = white
Accordion border = none

Bryan · November 2017

Hi,
Sorry but we do not offer full theme customization, all the options about colors and menu can be found in theme options. We only give some custom css, for little things.

Choose the theme color in theme options>colors>content and do not use the skin color in theme options>colors>general.
thanks

ejyheng · November 2017

Hi, thanks for your response. I looked into betheme options however the below items are not changeable via betheme options. Can you advice if they are achievabled via CSS?

A) Accordion
C) Footer items (1 and 2, refer attached screenshot [Links visible only for registered users])

In addition:

Top menu:

How can we make area marked in red (Refer attached screenshot [Links visible only for registered users]) to solid color? (It was solid colour previously).
How do we eliminate the gap marked in yellow (Refer same screenshot above).

Thank you for your help.

Bryan · November 2017

Hi,
For items that are not changeable we will need links to the pages and explanations of what you want to change. We will provider custom css.

B. It looks like you have too much menu items and the do not fit. Try making the responsive breakpoint sooner to avoid those situations. Theme options>responsive>header under initial width.

ejyheng · November 2017

Thank you for solution for item B. Unfortunately it doesn't work and we decided to switch to "Magazine" header layout.

Kindly provide CSS for the below items:

A) Accordion (Page link [Links visible only for registered users])

When accordion tab is collapsed:

'+' and '-' background color = green
'+' and '-' font colour and font weight
Tab title font colour = black, font size = bigger
Tab title background colour
Accordion border = none

Footer items (Attached screenshot [Links visible only for registered users] and page link [Links visible only for registered users])

Background colour and font colour of muffin menu widget when hover, and not hover.

C) Menu header background color (Page link [Links visible only for registered users])

CSS for solid background colour please.

Thank you.

Bryan · November 2017

Dear ejyheng
Please understand that we do not offer theme customizations to our clients, we only help with simple css changes that may interfere with the functionality (like white links on white backgrounds)

ejyheng · November 2017

Ok no problem, didn't know this is now considered theme cuztomization as I was able to obtain support for similar request in the past. Thanks.

Changing Colours

Comments

This website uses cookies