# Countdown

#### **Parameters**

| **Parameter**           | **Description**                                     | **Accepted Values**                                       | **Default Value**            |
| ----------------------- | --------------------------------------------------- | --------------------------------------------------------- | ---------------------------- |
| `event_id`              | Specifies the event(s) to countdown to.             | A comma-separated list of event IDs (e.g., `1,2,3`).      | *Required*                   |
| `data_items`            | Defines the time units to include in the countdown. | `years`, `months`, `days`, `hours`, `minutes`, `seconds`. | `days,hours,minutes,seconds` |
| `data_labels`           | Custom text for each time unit label.               | Any text (e.g., `Días`, `Heures`).                        | `Days,Hours,Minutes,Seconds` |
| `display_labels`        | Toggles visibility of the labels.                   | `true`, `false`.                                          | `true`                       |
| `expiration_message`    | Message displayed when the countdown expires.       | Any text (e.g., `Event Started`, `Over`).                 | `EXPIRED`                    |
| `card_edges`            | Style for the edges of the countdown cards.         | `square`, `rounded`.                                      | `square`                     |
| `card_background_color` | Background color of the countdown cards.            | Any valid HEX color (e.g., `#000000`).                    | Accent color of your theme.  |
| `card_text_color`       | Text color for the countdown cards.                 | Any valid HEX color (e.g., `#ffffff`).                    | `#ffffff` (white).           |
| `card_border_color`     | Border color of the countdown cards.                | Any valid HEX color or `none`.                            | `none`                       |
| `card_font_size`        | Font size for text inside the countdown cards.      | Any valid CSS font size (e.g., `14px`).                   | `24px`                       |
| `font_size`             | Overall font size for the countdown.                | Any valid CSS font size (e.g., `12px`).                   | `18px`                       |

***

#### **Usage Examples**

1. **Basic Countdown to a Single Event**

   ```shortcode
   [countdown event_id="1"]
   ```
2. **Countdown with Custom Labels and Data Items**

   ```shortcode
   [countdown 
       event_id="2" 
       data_items="days,hours,minutes" 
       data_labels="Días,Horas,Minutos"]
   ```
3. **Customized Countdown Card Appearance**

   ```shortcode
   [countdown 
       event_id="3" 
       card_edges="rounded" 
       card_background_color="#333333" 
       card_text_color="#00FF00" 
       card_border_color="#FF0000" 
       card_font_size="16px"
       font_size="14px"]
   ```
4. **Countdown with an Expiration Message**

   ```shortcode
   [countdown event_id="1" expiration_message="The event has started!"]
   ```

***

#### **Notes**

* **Event Dependency:** The countdown will function only if a valid `event_id` is provided and associated with an event in the system.
* **Parameters:** The number of `data_labels` needs to be in the same order and be the same amount as the `data_items`
* **Coming Soon:** This shortcode is not yet published, but we are excited to release it soon! Stay tuned for updates.