> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: Tutorial | Hide a Video Player When There's No Video

## Article: Tutorial | Hide a Video Player When There's No Video

## Article Link: https://dev.wix.com/docs/develop-websites-sdk/get-started/tutorials/user-interface/tutorial-hide-a-video-player-when-there-s-no-video.md

## Article Content:

# Tutorial | Hide a Video Player When There's No Video

Learn how to automatically hide a [video player](https://dev.wix.com/docs/velo/velo-only-apis/$w/video-player/introduction.md) element when the connected collection item has no video URL, instead of showing a default placeholder. This is useful when the page shows various collection items that contain multiple fields, and may or may not include a video.

In this tutorial we create a collection of minimal items, displayed in a [repeater](https://dev.wix.com/docs/velo/velo-only-apis/$w/repeater/introduction.md).

We'll use the following steps to create this functionality:

1.  [Create a collection.](#step-1--create-a-collection)
2.  [Set up page elements.](#step-2--set-up-page-elements)
3.  [Add code.](#step-3--add-code)

## Step 1 | Create a collection

1. Create a collection with a URL type field. Name the field `url`.
2. Add to the collection at least 1 item with a valid video URL in the `url` field, and at least 1 item with an empty `url` field.

## Step 2 | Add elements to your page

1. Add a repeater to your page. Set the repeater ID to `repeater`.
2. [Connect](https://support.wix.com/en/article/about-datasets-and-connecting-data) the repeater to the collection.
3. Add a video player element to the repeater items.
4. Connect the video player to the collection.
5. [Connect](https://support.wix.com/en/article/cms-formerly-content-manager-displaying-collection-content-in-the-single-video-player) the video player's **Video source** to the `url` field.

## Step 3 | Add frontend code

Add this code to your page to wait for the repeater items to load, and hide the video player in items that contain no video URL:

```javascript
$w("#repeater").onItemReady(($item, itemData) => {
  if (!itemData.url) {
    $item("#videoPlayer").collapse();
  }
});
```

## Test your implementation

In edit mode, video players will show some default content even if they don't contain a video.
To test your implementation, preview your site.
In items with an empty `url` field, the video player will automatically collapse.

## See also

- [About Collections](https://dev.wix.com/docs/develop-websites-sdk/code-your-site/work-with-data/introduction/about-collections.md)
- [Video Player API](https://dev.wix.com/docs/velo/velo-only-apis/$w/video-player/introduction.md)