Changing Colours

edited May 2016 in Other
Where to change colour for:
  1. Menu List background colour (Link)
  2. Call to action button and mouse over colour (Link- In Franchising section - ENQUIRE NOW!)
  3. Tab content (Background colour-active/inactive) Link
Thanks.

Comments

  • 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; }
  • edited 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

    2. Same "call to action button", what code to use to change font colour, size, formatting (bold/italic/underline)? Link

    3. On menu (where Smoothies, Juices, Frozen Yogurt are), what code do we use to change:

    - Background colour
    - Mouse-Over colour (Background and font)
  • 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; }
  • Hi, how do we change the bgcolor in side menu (Refer to attached screenshot, pointed by red arrows).

    URL here.

    Thank you.
  • Here you go
    .widget_archive ul, .widget_nav_menu ul {
    background: transparent !important;
    }
  • Thanks. Can you provide the code for #000 (white colour) background please.
  • Change the transparent to your color.
  • Hi, thanks for the comment but color has changed. (Refer screenshot here)

  • And the menu is white, what exactly do you have in mind.
    http://prntscr.com/g93p0j
  • How to change colour for the below items? We would like our page to look similar to the sample page (See below links):



    A) Accordion:
    1. 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
    2. When tab is expanded
      • All items in Point 1 to remain.
      • Content bgcolor = white (Currently orange)
      • Content box border = visible, border thickness = <thickness variable>
    B) Top Menu (Home, About Us, Our Menu....)
    1. Bgcolour (Currently white)
    2. Sub menu items bgcolor when hover (E.g. Smoothie, Juice, Yogurt in "Our Menu"), currently grey.
    3. Sub menu items font colour when hover, currently orange.
    C) Footer items:
    1. Bgcolour and font colour of each widget item (muffin menu) when not hover.
    2. Bgcolour and font colour of each widget item (muffin menu) when hover.
    3. Footer section bgcolor (Only widget area, not the "Copyright" area).
    Thank you in advance.
  • 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
  • edited 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?
    1. A) Accordion
    2. C) Footer items (1 and 2, refer attached screenshot)
    In addition:

    B) Top menu:
    1. How can we make area marked in red (Refer attached screenshot) to solid color? (It was solid colour previously).
    2. How do we eliminate the gap marked in yellow (Refer same screenshot above).

    Thank you for your help.
  • 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.
  • 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
    • 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

    B) Footer items (Attached screenshot and page link)
    1. Background colour and font colour of muffin menu widget when hover, and not hover.

    C) Menu header background color (Page link)
    • CSS for solid background colour please.

    Thank you.
  • 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)

  • 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.
Sign In or Register to comment.