Support

Home Forums Event Espresso Premium Installed EE4 Calendar and Events CSS seems messed up

Installed EE4 Calendar and Events CSS seems messed up

Posted: April 30, 2014 at 4:28 pm


Thomas Galang

April 30, 2014 at 4:28 pm

Hi! I recently upgraded to EE4 with calendar but now the register buttons, some calendar fonts, etc seem messed up (fonts too tiny and button generic grey) — what went wrong possibly> THANK YOU!


Lorenzo Orlando Caum

  • Support Staff

April 30, 2014 at 4:38 pm

Hi Thomas,

Could you please share a link to an event where I can see the styling issue?


Lorenzo


Thomas Galang

April 30, 2014 at 5:32 pm

If you notice the fonts are too small..

http://apogeece.com/calendar/

and here the register button is plain grey, and for some strange reason there is a comment and sharing section

http://apogeece.com/events/arthritis-live-course-2/


Lorenzo Orlando Caum

  • Support Staff

April 30, 2014 at 5:52 pm

Hi Thomas,

Event Espresso 4 comes with basic styling and then will inherit styling such as the type of font from your theme. If you compare the site’s homepage to an event page, you’ll see the font is similar.

The following CSS will hide those elements on the single event pages. You can add it to a plugin like My Custom CSS:

.single-espresso_events .meta-info, .single-espresso_events .share-box, .single-espresso_events .about-author, .single-espresso_events #respond {display:none}

What color would you like the button to be?


Lorenzo


Thomas Galang

April 30, 2014 at 5:55 pm

thanks . Orange would be nice as it is the theme of the site… The version 3 buttons looked better and more pronounced, i dont know what happened 🙂


Lorenzo Orlando Caum

  • Support Staff

April 30, 2014 at 6:13 pm

Hello,

Try this CSS for the button:

.ticket-selector-submit-btn {
  color: #EEEEEE !important;
  font-size: 14px;
  text-shadow: 1px 1px 0px #7CACDE;
  box-shadow: 1px 1px 1px #BEE2F9;
  padding: 10px 25px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  border-radius: 8px;
  background: #E9A825;
  	float: right;

}

A plugin like My Custom CSS is a good place to add it. It will look similar to this:

http://cl.ly/image/2U3O3k0I0Q24


Lorenzo


Thomas Galang

April 30, 2014 at 6:24 pm

THANK you for your help I will try that and update this ticket – would you know what the issue is? does the register button/ event calendar come without a style sheet?


Lorenzo Orlando Caum

  • Support Staff

April 30, 2014 at 6:43 pm

Hi,

This isn’t a bug if that is what you are referring to.

Event Espresso 4 comes with basic styling and then uses styling from your theme.

Here is what the register button looks like with the Twenty Twelve theme:

http://cl.ly/image/2M0x2n1H2d1h

…and Twenty Fourteen:

http://cl.ly/image/3i0P370n1w30

Here is the code for a green button if you would like to try that instead (pulled from Twenty Fourteen):

button,
.contributor-posts-link,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	background-color: #24890d;
	border: 0;
	border-radius: 2px;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	padding: 10px 30px 11px;
	text-transform: uppercase;
	vertical-align: bottom;
}


Lorenzo


Thomas Galang

April 30, 2014 at 7:00 pm

Hmm weird, I am using the avada theme which should have good button styling.I must have messed something up


Thomas Galang

April 30, 2014 at 7:05 pm

Like mentioned, before I upgraded from V3, everything looked fine and dandy


Lorenzo Orlando Caum

  • Support Staff

April 30, 2014 at 9:11 pm

Event Espresso 4 is different from version 3. I’ve shared some sample CSS in my prior replies.


Lorenzo


Thomas Galang

April 30, 2014 at 10:58 pm

Okay, I am really not liking how this page has turned out,

http://apogeece.com/events/arthritis-live-course-2/

I am thinking of reverting back to V3 just for styling reasons. The fonts are too small, mind you, not comparable to my original CSS, plus the register now button is flushed to the right, and dead grey with no styling whatsoever. I wish it would have inherited the buttons from my other pages


Dean

May 1, 2014 at 7:02 am

Hi Thomas,

Sorry to hear that, as version 4 has many great features and is the next step for Event Espresso.

EE4 does make use of the themes styles much more than EE3, and we believe that this is a definite improvement. Your events will appear to be a part of your site rather than looking like they have been bolted on like in EE3.

On the flip side, the structure has changed so things are in different positions, and you may need to use some CSS to get it exactly how you want it, but this is no different than any other front facing WordPress plugin.

The register now button does take on the theme styles, so I’m not sure why it isn’t doing that for you:

2014 theme http://take.ms/y2DR0
2013 theme http://take.ms/NOkIu
2012 theme http://take.ms/fV3B0

The support post ‘Installed EE4 Calendar and Events CSS seems messed up’ 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