> For the complete documentation index, see [llms.txt](https://wpcloudplugins.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wpcloudplugins.gitbook.io/docs/modules/module-configurator/layout.md).
# Layout
{% hint style="success" %}
Settings displayed in the [**Module Configurator**](/docs/modules/module-configurator.md) depend on the type of module you have selected.
{% endhint %}
### File Browser
| Setting | Description |
| --------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **File Browser view** | Select Grid/Thumbnail view or List view. |
| — Display filename on hover (Grid View) | Display the file names in the thumbnail view only when hovering over the file. When disabled, the file names and actions will be displayed directly under the file. On touch devices, it will always displayed. |
| — Show quick preview button (List View) | Allow the user to see thumbnail of a file when hovering over an quick preview button. |
| **Allow switching between views** | Should the user be allowed to change the view via the module on the Front-End? |
| **Show folder tree** | Display a folder tree for easier navigation. |
| **Show file extension** | |
| **Show file size** | |
| **Show last modified date** | |
### Gallery
| Setting | Description |
| ------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- |
| **Show file names** | Display or Hide the file names in the gallery. |
| **Descriptions always visible** | The description will appear on hover by default. When this setting is enabled it will always be visible. |
| **Image row height** | The ideal height you want your grid rows to be. The module will slightly adjusts the row height to fit the images in the masonary grid. |
| **Padding** | Space between images. You can use pixels or percentages. For instance: `0px`, `10px`, `1vw`, `2%` or `clamp(1px, 1vw, 20px)`. |
| **Border radius** | The roundness of the image corners in pixels (px). Leave empty for default value. |
### Slider
#### Slider Layout
| Setting | Description |
| ---------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **Slide height** | The height of your slides. You can use pixels or percentages. For instance: `360px`, `50vh`, `70%`. |
| **Slide padding** | Space between slides (in "px"). Cannot yet be used in combination with Auto size setting. |
| **Slides in viewport** | Number of slides being displayed in the viewport at the same time. |
| **Slide placement** | Arrangement of the slides. Arrange the slides in a row (horizontal) or column (vertical). |
| **Centred slides** | Center the active slide in the viewport. |
| **Auto size** | If enabled, the dimensions of each slide are its natural dimensions. If disabled, all slides will be the same size and the image will cover the slide. |
#### Slide Content
| Setting | Description |
| --------------------------- | ----------------------------------------------------------- |
| **Show last modified date** | Display the last modified date of the item. |
| **Show file names** | Display or Hide the file names in the slider item. |
| **Show descriptions** | Display descriptions in the slide if available. |
| — Description position | Select the way in which the description is to be displayed. |
#### Slider Navigation
| Setting | Description |
| ------------------------ | ------------------------------------------------------------ |
| **Show dots** | Navigate through the slides using the dots below the slider. |
| **Show arrows** | Navigate through the slides using arrows above the slider. |
| **Slides per animation** | Number of slides going on with one next click. |
| **Animation duration** | Speed of the slide animation. |
| **Autoplay** | Toggles the automatic change of slides. |
| — Delay between slides | Delay between cycles in milliseconds. Defaults to `5000`. |
| — Pause on hover | Stops sliding on mouseover. |
| — Direction | Direction of slide movement. |
### Audio Player & Media Player
| Setting | Description |
| --------------------------------- | --------------------------------------------------------------------------------------------------------------------------------- |
| **Video aspect ratio** | Select the aspect ratio of your videos. The height of the video player will be set accordingly. |
| **Auto Play** | Start the media directly when the module is rendered. |
| **Mediaplayer Buttons** | Set which buttons (if supported) should be visible in the mediaplayer. |
| **Enable Video Advertisements** | Supports VAST XML advertisments to offer monetization options for your videos. Currently, only Linear MP4 elements are supported. |
| **Show Playlist** | |
| — Playlist open on start | Display the playlist directly when the module is rendered. |
| — Playlist opens on top of player | Display the playlist above the video container. |
| — Playlist autoplay | Automatically start the next item in playlist once current one is finished. |
| — Playlist loop | Restart the playlist as soon as it is finished. |
| — Display thumbnails | Add thumbnails for the items in the playlist. |
| — Show last modified date | Display the last modified date in the playlist. |
| — Link to webshop | Display a purchase button for your media by adding an url to your webshop. |
### List
| Setting | Description |
| -------------------------- | --------------------------------------------------- |
| **Default click behavior** | Select what should happen when you click on a file. |
### Embed
| Setting | Description |
| ------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Aspect ratio** | Select the aspect ratio for the iFrames. You can set the width of the module container in the Module Container section, and the height will be set accordingly. |
| **Embed Type** | What type of embedding should the document have? |
| **Show file name** | Show the file name of the document above the iFrame. |
| **Direct media display** | You can display audio, video and image files directly, without having to embed them in an iframe. |
### LightBox
| Setting | Description |
| ----------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
| **Show Thumbnails** | Show thumbnails of the files inside the Lightbox. |
| **Image Source** | Select the source of the images. Large thumbnails load fast, original files will take some time to load. |
| **Navigation** | Navigate through your documents in the inline preview. Disable when each document should be shown individually without navigation arrows |
| **Open Lightbox on page load** | Automatically open the lightbox immediately after the module has loaded the content. |
| **Enable Slideshow** | Automatically start the Slideshow mode when the lightbox is opened. |
| — Delay between slides
| Delay between cycles in milliseconds. Defaults to `5000`. |
### Header
| Setting | Description |
| --------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Show header** | Display a header that shows the folder location and action buttons. |
| — Show refresh button | Add a refresh button in the header so users can refresh the data in the module and pull changes. |
| **—** Show breadcrumb | Display the breadcrumb with the current folder location. |
| **— —** Use custom name for home folder | Instead of using the original top folder name, set a custom "Home" or "Start" text for the top folder in the breadcrumb path. This is useful if you do not want to reveal the top folder name. |
| **— —** Custom text for the top folder | Set a custom text for the top folder in the breadcrumb folder path. For example: "Home" or "Start". |
### Module Container
| Setting | Description |
| ---------------------- | ---------------------------------------------------------------------------------------------------------------------------------- |
| **Module Width** | Set maximum width for the plugin container. You can use pixels or percentages. For instance: `360px`, `48vw`, `70%`. |
| **Module Height** | Set maximum height for the plugin container. You can use pixels or percentages. For instance: `360px`, `50vh`, `70%`. |
| **Theme style** | Set the color theme to be used for this module. This will override the global theme style set on the plugin's main options page. |
| **Module ID** | Give this module a specific id. You can use this ID to target this module via your own CSS or JS code, for example. |
| **Custom CSS Classes** | Add your own custom classes to the plugin container. Multiple classes can be added seperated by a whitespace. |
| **Scroll to Top** | Allow the user to quickly access the breadcrumb, folders and header actions by using the 'return to the top' button in the module. |