Individual Events Page

Description

Each event listed in the Event List Page opens up to an individual events page. This is where you can add more information and build out a more extensive events page.

Custom CSS

For style changes across multiple pages, add the code snippet to your Custom CSS panel and each page will be updated.

Advanced Code Injection

For style changes on one page, add the code snippet to the page Advanced Code Injection so only that page will be updated. Enclose your code in style brackets like this:

<style>

.ProductItem .ProductItem-details .ProductItem-details-title {
}

</style>
 

Custom CSS

To target event title

/* event title */
.eventitem-title {
}

To target the “back go all events” list link

/* back to all events list link */
.eventitem-backlink {
}

To target the metadata

/* all event metadata */
.eventitem-meta {
}

To target the date

/* event date */
.event-date {
}

To target the event location

/* event location */
.eventitem-meta-address {
}

/* event location - title only */
.eventitem-meta-address-line--title {
}

To target the event share

/* event share - ical */
.eventitem-meta-export-ical {
}

/* event share - google */
.eventitem-meta-export-google {
}

To target the event tags

/* event tags */
[data-content-field="categories"] a {
}

To target the pagination

/* pagination title */
.item-pagination-title {
}

/* pagination date */
.events-item-pagination-date {
}

/* pagination symbol */
.item-pagination[data-collection-type^="events"] .item-pagination-icon svg {
}

To target the map link

/* event map link */
.eventitem-meta-address-maplink {
}

To target the time

7.0

/* event time */
.event-time-12hr {
}

/* start time */
.event-time-12hr-start {
}

/* end time */
.event-time-12hr-end {
}

7.1

/* event time */
.event-time-12hr {
}

/* start time */
.event-time-12hr-start {
}

/* end time */
.event-time-12hr-end {
}
7.0, 7.1Cristina TiosecoEvents