# Event reference card

### Summary <a href="#eventreferencecardcomponent-summary" id="eventreferencecardcomponent-summary"></a>

The Event reference card creates an Event card based on a previously created event or page.

This article shows you how to add an Event reference card to the Manual list component.

Below is an example of an Event reference card.

<figure><img src="https://3596844540-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F79QhtrrFEncRGId6RF6A%2Fuploads%2Fgit-blob-d9f0040987de8bdb92b5815cf74a09a47875feb1%2Fimage.png?alt=media" alt=""><figcaption></figcaption></figure>

### Step 1 - Add the Event reference card <a href="#eventreferencecardcomponent-step1-addtheeventreferencecard" id="eventreferencecardcomponent-step1-addtheeventreferencecard"></a>

Within the Manual list component under List items, click on the dropdown and select Event reference card.

<figure><img src="https://3596844540-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F79QhtrrFEncRGId6RF6A%2Fuploads%2Fgit-blob-e672a7269acaf18fd8b5b604ade8efe90cc24a8e%2Fimage.png?alt=media" alt=""><figcaption></figcaption></figure>

### Step 2 - Fill in the various fields <a href="#eventreferencecardcomponent-step2-fillinthevariousfields" id="eventreferencecardcomponent-step2-fillinthevariousfields"></a>

There are only 2 fields.

<figure><img src="https://3596844540-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F79QhtrrFEncRGId6RF6A%2Fuploads%2Fgit-blob-2e06d2bc3dab962f3b68369582ad90d5c59b6f2e%2Fimage.png?alt=media" alt=""><figcaption></figcaption></figure>

1. Reference - This is an autocomplete text field that will suggest **Event content type** titles as you type. Event content must exist in your site. You can create Events here: *\[your\_site]/node/add/civictheme\_event*
2. Theme - Select whether you want light or dark theme settings.
