Help Desk

Cant figure out how to change filter bar background

  • Posts: 2 Topics: 1
    | Permalink

    Ive tried changing every CSS associated with Event Calendar and nothing Ive tried will change the back ground of the Filter Bar. Could someone please point me in the right direction?
    http://pksp.org/events/

    Thank you!

    Posts: 4919
    | Permalink

    Hi there,

    I’m sorry you’re having so much trouble changing the color! Try adding the following to in the custom CSS section under Appearance > Customize (if you have one) or in the style.css file in your child theme:

    #tribe_events_filters_wrapper.tribe-events-filters-horizontal, .tribe-events-filters-horizontal .tribe-events-filters-content {
        background-color: #e16d70;
    }

    This is what you should get. If you want to remove that white border as well, you can add:

    .tribe-events-filters-horizontal .tribe-events-filters-content {
        border: none;
    }

    Let me know how that works for you!

    Thanks,

    Jennifer

    Posts: 2 Topics: 1
    | Permalink

    Good evening!

    If you look at http://pksp.org/events

    You did resolve the issue with the background of the Filter bar, Thank
    you!

    However, look at Venues. I have 2 venues configured but the volors of
    the text and background ar eboth white.
    The same is true for Featured Events, TAGS, Day, Time and Organizers.

    It seems like you should have a custimization GUI to modify the
    properties for all of the available/selected fields in the filter bar.

    Thank you!

    Posts: 4919
    | Permalink

    Hello,

    We actually do have some options for changing colors on events pages under Appearance > Customize > The Events Calendar! However, your theme can also have a large impact on how the events pages are displayed. Try adjusting the Default stylesheet used for events templates and¬†Events template¬†settings under Events > Settings > Display. These control how much the events pages inherit styling from your site’s theme.

    I’d also recommend taking a look at the following articles:

    Stylesheets and Page Templates

    The Events Calendar Category Colors

    Basic Font and Color Changes with CSS

    Styling Events Widgets

    Let me know if that helps and if you have any questions!

    Thanks,

    Jennifer

    Posts: 2 Topics: 1
    | Permalink

    My apologies. I have dug through the CSS and the style sheets. I cannot figure out what value to place in the CSS to change the text color to black in the venues, featured events, tags, day, time and organizers pulldowns.
    In all of these the text is white and the background is white.
    There REALLY needs to be a GUI for controlling all of the values for foreground text and back ground fill for the filter bar.

    Posts: 4919
    | Permalink

    Hello,

    Thanks for following up! I took another look at the Venues dropdown, and it looks like the font color is coming from the theme (see screenshot). Were you able to get any better styling by changing the settings under Events > Settings > Display ?

    There is actually a GUI for changing the colors under Appearance > Customize > The Events Calendar (sorry, I thought I had mentioned that before!). Can you try adjusting the colors there as well?

    If all else fails, you can add the following CSS to change the font color in the dropdowns:

    #tribe_events_filters_wrapper .tribe-events-filter-group label {
    color: #000000;
    }

    Typically, the GUI and/or adjusting the templates settings under Display will work to get the calendar styles integrated well with the theme, but sometimes it might be necessary to adjust the CSS to get the calendar to match the theme.

    I hope this helps – please let me know how it goes!

    Thanks,

    Jennifer

    Posts: 7
    | Permalink

    Hey there! This thread has been pretty quiet for the last three weeks, so we’re going to go ahead and close it to avoid confusion with other topics. If you’re still looking for help with this, please do open a new thread, reference this one and we’d be more than happy to continue the conversation over there.

    Thanks so much!
    The Events Calendar Support Team

    | Permalink

The topic ‘Cant figure out how to change filter bar background’ is closed to new replies.