Support

Home Forums Event Espresso Premium Grid view CSS change not working

Grid view CSS change not working

Posted: February 6, 2018 at 8:24 am

Viewing 7 reply threads


David

February 6, 2018 at 8:24 am

Hi,

I want to customise the CSS for Grid view so that it permanently displays the event info rather than just on hover. I found this https://eventespresso.com/topic/how-to-customize-grid-template-to-display-event-details-by-default-2/ but for some reason when I alter the CSS for the page it doesn’t make a difference. Is the theme interfering somehow?

https://www.pb-education.co.uk/what-we-do/courses/

Any help woud be appreciated.

Thanks


Tony

  • Support Staff

February 6, 2018 at 10:21 am

Hi there,

The code you are trying to use is for an older version of the grid template add-on and will no longer work with the latest version.

You can use:

.ee_grid_box_v2 .ee_overlay {
    top: 0;
}

To display the event details permanently.

You can add that to Appearance -> Customize -> Additional CSS

Please refer to this guide for more detailed information about the CSS customizer: https://codex.wordpress.org/CSS#Custom_CSS_in_WordPress


David

February 6, 2018 at 10:37 am

That is perfect – thanks! If I want to change the font and font colour can I also do that through the same process?

Cheers
Dave


Tony

  • Support Staff

February 6, 2018 at 10:44 am

Similar, but it depends on what you want to change.

EE applies minimal styles and right now is picking up the theme’s default p styles for the bottom line, which I’m assuming is the problem?

What is it you want to change?


David

February 6, 2018 at 10:59 am

We are changing styles and wanted to change the font to ‘Cubano-Regular’ and for the date and time to also be in white.


Tony

  • Support Staff

February 7, 2018 at 2:59 am

Yeah so, you can style any elements within those sections by prefixing this selector .ee_grid_box_v2 .ee_overlay

So something like:

.ee_grid_box_v2 .ee_overla .event-link, 
.ee_grid_box_v2 .ee_overlay .event-title, 
.event-link, .ee_grid_box_v2 .ee_overlay .start-date {
    font-family: 'Cubano-Regular'!important;
}

Your theme is setting the font-family using !important, so we need to override that using the above.


David

February 7, 2018 at 4:16 am

So helpful – thanks so much!!


Tony

  • Support Staff

February 7, 2018 at 4:51 am

You’re most welcome.

Viewing 7 reply threads

The support post ‘Grid view CSS change not working’ is closed to new replies.

Have a question about this support post? Create a new support post in our support forums and include a link to this existing support post so we can help you.

Event Espresso