Event card
Last updated 10 Nov 2021
Displays summary information about an upcoming event with a date and time. Includes a link to further information.
- Options
- Variants
- Size
Platform - TypeHeading
Date, timeLorem ipsum dolor sit amet consectetur, adipisicing elit. Sapiente neque minus.
Action
- Overview
- Specifications
The event card component can help you to…
Promote an upcoming event with an accurate title and a brief description. Users can bookmark events to compare or return to later to read more information.
When to use event cards
You can add one or more event cards to any content page on your website. Event cards are most effective when they relate to the page topic or demonstrate the involvement and interest of UCL and your department in a specific field.
- Example: row of cards with custom colour scheme
- Example: a featured event on a course description page
Make it UCL
The event card component relates to the “Be disruptive” principles because it showcase how UCL is cutting edge and at the vanguard of the disciplines we teach and research.
How to use the event card component
Select the “Event card” component in Drupal and add the URL of the event from your department website. You won’t have to manually enter all the details, but you can type a title and optionally a description, as well as adding an image of your choice. You also have the option of making the card stand out by selecting the “Featured” option.
When using this component make sure to:
Write a concise title
Titles are best kept between 30 and 45 characters. This makes them more impactful and more recognisable, especially when the event card appears in a grid.
Think about the participants
In the title or description you can try to think about the language and expectations of the participants: what’s in it for them? Why should I come? What makes this event special?
Use a UCL image when possible
Best to use something we own, for consistency and copyrights. Visit Imagecentral. If you can’t find the right image, do something.
Include the lead speaker in the title
If the event has a well-known and affirmed lead speaker, highlight it in the title; careful not to add a long name to the title as it might make the card less legible.
Be careful not to:
Use the title as description
The title should not wrap on more than 3 lines because it makes it more difficult to read. You can add an optional description to include important details - keeping the title short and snappy.
Overuse the “Featured” option
This option won’t make your event stand out or highlight its importance if all the event you add have the same style. When everything stands out, nothing does. Use this option sparingly, ideally for keynote events and open days.
Stack multiple rows of event cards
Too many cards makes it difficult for people to scan the page and quickly find their best match. If you want to showcase your yearly calendar of events, consider showing the 3 most important ones and add a card link to your department’s event calendar.
Content guidelines
It’s tempting to want very detailed and descriptive text on your website. Cards are small, and especially when grouped in grids tend to be difficult to read. Try to keep titles and descriptions as short as possible. UCL has guidelines for content, tone of voice, and copy to help you craft the most inviting and useful text for your events.
