Configure HTML Snippets for Intranet

Administrators can configure the application to display HTML snippets when it detects certain URL patterns in newsfeeds, the same way that other end-user collaboration tools offer to embed rich content. To configure rich content snippets for editorial content please see Editorial snippets.

This article provides instructions to configure and manage the HTML Snippets on the Appspace Intranet (powered by Beezy) platform.

Back to top

Prerequisites

Global or Local Admin permissions.

Back to top

Navigation Layout and Interface

In order to access the Navigation dashboard on the Intranet platform, go to Settings > Site settings > Beezy settings > Editorial settings > Snippets > HTML Snippets.

You can add a new HTML snippet, which will create an empty row with two columns:

In URL pattern type the URL pattern you want the application to recognize.
In Template paste HTML you want to display when identifying the URL pattern.

The URL has to match perfectly, if not the transformation will not be applied.

You can use wildcard parameters in both URL and template, i.e. if you type the following URL pattern:

https://contoso.sharepoint.com/portals/hub/_layouts/15/PointPublishing.aspx?app=video&p=p&chid={chid}&vid={vid}&from=1

Appspace Intranet will be able to use these values in the HTML template:

<iframe width=640 height=360 src='https://contoso.sharepoint.com/portals/hub/_layouts/15/VideoEmbedHost.aspx?chId={chid}&amp;vId={vid}' allowfullscreen></iframe>

Back to top

Configure HTML Snippets

Add a HTML Snippet

Log in to your Appspace Intranet console.
Click the Settings ⚙ icon, and select Site settings from the SharePoint navigation.
Navigate to the Site Collection Administration section, and click Beezy settings.
Under Advanced configuration, click Editorial settings and click Snippets from the side panel.
Click the HTML Snippets Edit link, and click the + Add Snippet button.
In the Editorial Snippets window, proceed to enter the following:
- URL pattern – Enter the URL pattern you want the application to recognize.
- Template – Enter the HTML you want to display when identifying the URL pattern.
Once complete, click Save.

Back to top

Content Providers for HTML Snippets

The following configurations will allow you to embed HTML content from some popular providers:

Microsoft Stream

URL Pattern

https://web.microsoftstream.com/video/{vid}

Template

<div style=’max-width: 1280px’><div style=’position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;’><iframe width=”1280″ height=”720″ src=”https://web.microsoftstream.com/embed/video/{vid}?autoplay=false” frameborder=”0″ allowfullscreen style=’position: absolute; top: 0; left: 0; right: 0; bottom: 0; height: 100%; max-width: 100%;’></iframe></div></div>

Vimeo

URL Pattern	`https://vimeo.com/{vid}`
Template	`<iframe width=”560″ height=”315″ src=”https://vimeo.com/{vid}?autoplay=false” frameborder=”0″ allow=”encrypted-media” allowfullscreen></iframe>`

YouTube

URL Pattern

https://www.youtube.com/watch?v=

Template

<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/{vid}?autoplay=false” frameborder=”0″ allow=”encrypted-media” allowfullscreen></iframe>

YouTube

URL Pattern	`https://www.youtu.be/{vid}`
Template	`<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/{vid}?autoplay=false” frameborder=”0″ allow=”encrypted-media” allowfullscreen></iframe>`

Microsoft Forms

URL Pattern	`https://forms.office.com/Pages/ResponsePage.aspx?id={id}`
Template	`<iframe width=”250px” height= “1000px” src=” https://forms.office.com/Pages/ResponsePage.aspx?id={id}&embed=true” frameborder= “0” marginwidth= “0” marginheight= “0” style= “border: none; max-width:100%; max-height:100vh”allowfullscreen webkitallowfullscreen mozallowfullscreen msallowfullscreen></iframe>`

Office 365 Video

URL Pattern

https://{domain}.sharepoint.com/portals/hub/_layouts/15/PointPublishing.aspx?app=video&p=p&chid={chid}&vid={vid}

Template

<iframe width=640 height=360 src=’https://{domain}.sharepoint.com/portals/hub/_layouts/15/VideoEmbedHost.aspx?chId={chid}&vId={vid}&width=640&height=360&autoPlay=false&showInfo=true’ allowfullscreen></iframe>

Power BI

URL Pattern	`https://app.powerbi.com/view?r={id}`
Template	`<iframe width=”800″ height=”600″ src=”https://app.powerbi.com/view?r={id}” frameborder=”0″ allowFullScreen=”true”></iframe>`

Giphy

URL Pattern	`https://giphy.com/gifs/{gif}`
Template	`<iframe src=”https://giphy.com/embed/{gif}” width=”480″ height=”270″ frameBorder=”0″ class=”giphy-embed” allowFullScreen></iframe>`

Twitter

URL Pattern	`https://twitter.com/{user}/status/{id}`
Template	`<blockquote class=”twitter-tweet” data-lang=”en”><a href=”https://twitter.com/{user}/status/{id}?ref_src=twsrc%5Etfw”>January 29, 2019</a></blockquote>`

Twiter

URL Pattern	`https://t.co/{id}`
Template	`<a class=”twitter-timeline” data-width=”640″ data-height=”320″ data-theme=”light” href=”https://twitter.com/followbeezy?ref_src=twsrc%5Etfw”>Tweets by followbeezy</a> <script async src=”https://platform.twitter.com/widgets.js” charset=”utf-8″></script></div>`

Spotify

URL Pattern	`https://open.spotify.com/{spotify}?si={x}`
Template	`<iframe src=”https://open.spotify.com/embed/{spotify}” width=”300″ height=”380″ frameborder=”0″ allowtransparency=”true” allow=”encrypted-media”></iframe>`

Back to top

Configure HTML Snippets for Intranet

Prerequisites

Navigation Layout and Interface

Configure HTML Snippets

Add a HTML Snippet

Content Providers for HTML Snippets

Microsoft Stream

Vimeo

YouTube

YouTube

Microsoft Forms

Office 365 Video

Power BI

Giphy

Twitter

Twiter

Spotify

Related Articles

Latest Articles

Browse By Category

Company

Helpful Links

Follow