Support

Home Forums Event Espresso Premium Editing the CSS on the just EE pages

Editing the CSS on the just EE pages

Posted: January 12, 2018 at 6:41 pm


Jane

January 12, 2018 at 6:41 pm

Hello, I’ve been able to customize the CSS on my site page-by-page by installing a plugin called “CSS Plus.” It creates a CSS editor field underneath each page editor. However this doesn’t happen for the Events page in Event Espresso. Is there another plugin that works better, or actually any way to do this? I see that there is a “CSS Editor” in the Default Settings tab, but when I enter code into it and press the “Save” button, the code I enters gets deleted rather than applied to the page. Please help me with this. Thanks!


Tony

  • Support Staff

January 15, 2018 at 4:23 am

Hi there,

It really depends on what it is you would like to change, can you provide more details on what you want to styles with CSS? It’s likely better to just include the CSS in either your themes styles or a plugin that loads for all pages.

I see that there is a “CSS Editor” in the Default Settings tab, but when I enter code into it and press the “Save” button, the code I enters gets deleted rather than applied to the page. Please help me with this. Thanks!

I’m not sure what this is (EE doesn’t have a CSS editor), can you add a screenshot?

https://eventespresso.com/wiki/troubleshooting-checklist/#screenshots

In any case, if the code isn’t saving that usually means its either been added in the wrong location and/or the syntax is wrong and the editor is ignoring the changes to prevent an error on your site.


Jane

January 15, 2018 at 7:55 am

I’m trying to have a unique header banner on each page. I can’t figure out a way to do that without tinkering with the CSS.

Here’s a screenshot of the CSS Editor field I see in the EE interface:
CSS Editor.

The code I’m trying to add is:
.hero .inner-hero {background-image: url(http://em-w.com/_images/inner-banner.jpg);}
I’m pretty sure the syntax is fine.


Tony

  • Support Staff

January 15, 2018 at 9:24 am

It is yes, but that code editor is not from Event Espresso, its some other plugin adding that to the setting page and is likely failing because it doesn’t have a post object to assign it to (in short it shouldn’t be there 🙂 ).

That code is rather generic, it doesn’t seem like something that applies to a specific page but all pages? Is that just an example?

I’m just confirming I’m giving you the correct option to add your CSS.


Jane

January 15, 2018 at 10:34 am

Putting that code in specific pages using the plugin, CSS Plus allows me to have a different image in the headers than the one on the homepage. I need this for the Event Espresso pages as well.


Tony

  • Support Staff

January 15, 2018 at 10:47 am

Ahh ok, so it’s the same code on multiple pages.

You can use the body class to do that for all EE events with a single line of code, like this:

.single-espresso_events .hero .inner-hero {background-image: url(http://em-w.com/_images/inner-banner.jpg);}

And rather than adding that to the CSS Plus section for each individual EE event, 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

The support post ‘Editing the CSS on the just EE pages’ 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