# Varbase Media Hero Slider

Populates the universal implementation of a "Hero Slider" to be used on the homepage in most cases.

A rich hero slider that allow Content Admins to display video and/or image slides. It implements the universal "Hero Slider" to be used in your homepage.

## Varbase Media Hero Slider Module

{% hint style="info" %}
Varbase media hero slider features are bundled through the **Varbase Media Hero Slider** module.\
GitHub: <https://github.com/Vardot/varbase_heroslider_media>\
Drupal.org: <https://www.drupal.org/project/varbase_heroslider_media>

After building a project using the `varbase-project` template, you can see the code of the **Varbase Media Hero Slider** module in:
{% endhint %}

```
project_directory
|-- docroot
    |-- modules
        |-- contrib
            |-- varbase_heroslider_media
```

Brings in the following core and contributed modules to your site:

| Module                                                                                | Purpose                                                                                             |
| ------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------- |
| [**Slick Carousel**](https://www.drupal.org/project/slick)                            | Slick carousel, the last carousel you'll ever need.                                                 |
| [**Slick Views**](https://www.drupal.org/project/slick_views)                         | Provides Slick carousel integration with Views.                                                     |
| <p><strong>Link</strong></p><p><em>(in Drupal core)</em></p>                          | Provides a simple link field type.                                                                  |
| <p><strong>Menu UI</strong></p><p><em>(in Drupal core)</em></p>                       | Allows administrators to customize the site navigation menu.                                        |
| [**Entityqueue**](https://www.drupal.org/project/entityqueue)                         | Allows users to collect entities in arbitrarily ordered lists.                                      |
| [**Rabbit Hole nodes**](https://www.drupal.org/project/rabbit_hole)                   | Adds Rabbit Hole functionality for nodes.                                                           |
| [**Field Group**](https://www.drupal.org/project/field_group)                         | Provides the ability to group your fields on both form and display.                                 |
| [**Length Indicator**](https://www.drupal.org/project/length_indicator)               | Adds an optional length indicator to fields                                                         |
| [**Advanced Text Formatter**](https://www.drupal.org/project/advanced_text_formatter) | Provides an additional formatter for text field, text area and text format.                         |
| [**Maxlength**](https://www.drupal.org/project/maxlength)                             | Limit the number of characters in textfields and textareas and shows the amount of characters left. |

## Required Varbase Modules

This module needs the following Varbase modules in order to function.

### Varbase Media Module

Manages type of media contents and entity browsers in the site.

{% content-ref url="../core-components/varbase-media" %}
[varbase-media](https://docs.varbase.vardot.com/9.0.x/developers/understanding-varbase/core-components/varbase-media)
{% endcontent-ref %}

## Features

* A full-width responsive **Media Hero Slider**.
* Easy to customize slides to act as a promotional feature typically displayed in the site's homepage.
* **Queued** Media Hero Sliders.

## Configure Varbase Media Hero Slider

{% content-ref url="../../configuring-a-varbase-site/configure-varbase-media-hero-slider" %}
[configure-varbase-media-hero-slider](https://docs.varbase.vardot.com/9.0.x/developers/configuring-a-varbase-site/configure-varbase-media-hero-slider)
{% endcontent-ref %}
