|
Trilink
|
February 18, 2014 at 2:34 pm
Just started using EE4. On previous version, we linked directly to the events page, which showed all events and was easy to read. In ee4, it’s very difficult to tell where one event info ends and the next event begins. This may be due to the many h1-hAppears all major titles, such as Event title, venue, etc. are auto coded as a header and not configurable to paragraph or other text type.
|
|
Josh
|
February 18, 2014 at 3:08 pm
Hi Sean,
This can more than likely be fixed with some CSS. We can take a look and offer some suggestions if you can post a link to the page.
|
|
Trilink
|
February 20, 2014 at 10:47 pm
Josh,
Thank you for the quick reply!
Here’s a link to our overall event registration page:
https://trilink.pro/event-registration/
As you can see, each “title” or anything with a <h > type tag appears as a green bar and seems to run the events together. It looked fine in ee3 as there was a border around each event and only one overall title. Any suggestions would be appreciated.
Thanks!
Sean
|
|
Seth Shoultes
|
February 21, 2014 at 1:49 am
Hi Sean,
Now that we are using Custom Post Types, Event Espresso just injects the event content into your default post templates. The design of each post is controlled by your WordPress theme. You will have to adjust your themes CSS/HTML to add visual separation of the content.
|
|
Seth Shoultes
|
February 21, 2014 at 1:55 am
For example. Find the following code in your theme’s css file:
#page_content h1 a, #page_content h2 a, #page_content h3 a
And add these properties:
font-size: 30px;
font-weight: bold;
It will look something like this:
http://www.screencast.com/t/3kM2NUz3
|
|
Trilink
|
February 21, 2014 at 2:40 pm
Seth,
Thank you for the code example.
I tried it and it did work.
However, we use some pages & posts on main pages of the website
and it doesn’t look good there. So, I’m not really able to make
a global change.
If however, I was able to modify the css for only the events-registration page
or modify those headers from h1, h2, h3 to paragraph text, etc. as we can when editing a page description, then I could make only the Class title stand out.
Thank you again!
|
|
Dean
|
February 23, 2014 at 11:56 pm
Hi Sean,
Each event in the list has CSS classes of espresso_events and type-espresso_events
This can be used to target just those events, for example if you change the code Seth gave you to the following which has those classes, it will only affect the events
#page_content .espresso_events h1 a, #page_content .espresso_events h2 a, #page_content .espresso_events h3 a {
font-size: 30px;
font-weight: bold;
}
You could take it further and style them more
#page_content .espresso_events {
background-color: #eee;
border: #000 thick solid;
}
Obviously that’s a very basic and ugly example, but hopefully you get the idea.
|
