MediaHUB

Requires MediaHUB ParOne’s MediaHUB feature enables partners to configure video assets to be downloaded, shared, or embedded freely by third parties.

Preflight

Prior to integrating MediaHUB, make sure the following as been completed:

Your organization has created a feed.

Integrating MediaHUB

Add <script> Tag

Include the ParOne SDK script tag in your website’s <head> section.

<head>
    <script src="https://sdk.parone.io/parone.min.js"></script>
</head>

Insert <parone> Tag
Insert the ParOne mediaHUB tag into your site’s <body> section. Replace YOUR_MEDIAHUB_KEY with your MediaHUB key.
```
<body>
    <parone-media-hub mediahub-key="YOUR_MEDIAHUB_KEY" />
</body>
```

Adding a MediaHUB

You can learn more about Adding MediaHUBs.

Styling

The following classes will let you customize MediaHUB to fit your branding.

.media-hub { /* top level */ }
  .media-hub-pagination { }
  .video-grid-container { }
    .media-hub-video-grid { }
      .media-hub-video-card { }
        .media-hub-video-thumbnail { }
        .media-hub-video-info { }
          .media-hub-video-info-content { /* holds the text items */ }
          .media-hub-video-info-buttons { /* holds the buttons */ }
            .media-hub-button-embed { }
            .media-hub-button-download { }
  .media-hub-modal-wrapper { }
    .media-hub-modal-content { }
      .media-hub-video-preview-card { }
  .media-hub-filters { }
    .media-hub-search { }
    .media-hub-embed-options { }
  .media-hub-metadata { }
    .media-hub-parone-categories { }
    .media-hub-private-categories { }
    .media-hub-private-tags { }
  .sidebar-item { }
    .sidebar-item.selected { }
  .notification { }
    notification-close-button { }

External Videos

You can enable a ‘Community Upload’ feature by turning on Allow Uploading during the MediaHUB configuration.

These videos will appear in a separate section of the ParOne Dashboard. These videos are exactly like your videos and you have the ability to configure every element of them.

MediaHUB External Videos