# Upcoming Events

The **Upcoming Events** is used to display the upcoming Events Post type with Countdown in the List view.

### Using the Upcoming Events widget

Go to your site and start editing the page with Elementor.

### Step 1:

Select the **Upcoming Events** widget from the menu bar on the left-hand side of your screen then drag and drop it into the selected area.

![](https://1186712708-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fe1Jo7DkgxZUy8C30NAXD%2Fuploads%2FyXfhkUTRopIQUmSxm6AU%2FCompanion%20-%20up%20events%20add.png?alt=media\&token=77a6a964-6830-4e14-bc20-e712c409cea5)

### Step 2:

You will get a window with the basic setting options under the **Content** tab. It will give you options to set the Number of events on the page, and set icons from the Icons library:

![](https://1186712708-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fe1Jo7DkgxZUy8C30NAXD%2Fuploads%2FJcd4HoMuWGa6OmCPEVdX%2FCompanion%20-%20up%20events%20general.png?alt=media\&token=a48d1852-5437-44d2-ad75-d976639371b5)

### Step 3:

Now, by clicking on the Style Tab you can customize the text color, typography, margin, padding, and many more for the Upcoming Event and Event List.

![](https://1186712708-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fe1Jo7DkgxZUy8C30NAXD%2Fuploads%2FMcfZgyGtlPmziQKv0qpL%2FCompanion%20-%20up%20events%20style.png?alt=media\&token=f5f7706b-7d88-463a-aa9a-3e1f1ecf9c8e)

### Step 4:

If you want to add motion effects, background, or make the page responsive, click on ‘Advanced**’** to explore those options. This **‘Advanced’** tab is a default feature of Elementor. Give a read to [this Document](https://docs.elementor.com/article/571-advanced-tab) to know more about Advanced features and their uses.

![](https://1186712708-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fe1Jo7DkgxZUy8C30NAXD%2Fuploads%2FCXj6fdfTEhWgxLMpjNWv%2FCompanion%20-%20up%20events%20adv.png?alt=media\&token=9b33461f-d020-4cc8-bd18-d0b908455b02)

Finally, after completing all the customization click on ‘Publish’ to see your work live.

![](https://1186712708-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fe1Jo7DkgxZUy8C30NAXD%2Fuploads%2FVHiqMsMLDpBdEcp8az6b%2FCompanion%20-%20up%20events%20final.png?alt=media\&token=58ab2dc6-fa55-4884-b5b2-3d2258acba20)

Great job! You have done it successfully.

![](https://1186712708-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fe1Jo7DkgxZUy8C30NAXD%2Fuploads%2Fod7fBOQh7t0koW7p453n%2FEvent%20List.gif?alt=media\&token=0a46637f-3973-4db7-b0bc-ca5ba05c0ee1)