WolfspyreLabs KibbleBowl/ Snippits & Exemplars/ WolfspyreLabs Exemplars/ WolfspyreLabs Shortcodes/ Embedded Video/ Embedded Video 🐺 embed video FUCK youtube. Host it yerself! embed-video launches a video-js1 instance within a content page. There’s a handful of parameters that can be fed to the shortcode. Full parameter list # Click here to see the full parameter list β name #String Required The video asset in question π URL Creation/declaration #π π https #Boolean (Default: true) Toggle if video src is/is not HTTPS π host #FQDN (Default: assets.wolfspyre.io) Overrides the host portion of the amalgamated URL for the video asset. π path #String (Default: vids/) Sets the path segment of the video URI π ytVidID #String (Default: "")` π vidFullURI #String (Default: "") π βοΈ VideoJS Knobs #βοΈ βοΈ vidJSVersion #String (Default: 8.5.3) The version of videojs requested from fastly via in script call: https://vjs.zencdn.net/vidJSVersion/video.min.js //vjs.zencdn.net/vidJSVersion/video-js.min.css βοΈ techOrder #String (Default: false) βοΈ vidType #String (Default: "") If set, This informs video-js of the codec and container of the html5 video element. useDataSetup #Boolean (Default: false) βοΈ π₯οΈ Presentation #π₯οΈ π₯οΈ vidWidth #String (Default: 100%) The string value fed to the width parameter of the js player π₯οΈ vidPoster #String (Default: "") If set, is used as a placeholder image before the video os played π₯οΈ vidPreload #String (Default: "auto") Can be set to ‘auto’ ‘metadata’ ‘on’. Leave at auto Determines if / how the video asset is pre-loaded before the user begins playing it. π₯οΈ vidClass #String (Default: vjs-big-play-centered vjs-show-big-play-button-on-pause vjs-fluid) The HTML classes to assign the video player resource. π₯οΈ fluid #Boolean (Default: true) π₯οΈ showLink #Boolean (Default: false) Whether or not to display the (VideoURL: yerlinkhere) text below the video π₯οΈ Usage #Youtube Related Content #ποΈ With the aid of VideoJS-Youtube There are two ways to use embed-video to display youtube videos. ποΈ Click here for information on parameters specific to embedding Youtube Content β Required parameters # Parameter Type Example Purpose name string ytvid01 This sets the html resource’s ID attribute. Any HTML ID must be unique within the page it’s defined. techOrder string "youtube" This sets the videojs DataSetup Object, which includes the videojs-youtube javascript resource Additionally, one of the following two parameters must be included. ytVidID The bare youtube video id. This will assume a base URL of http://www.youtube.com/watch?v= Example: ytVidID="dYaX2xjB9y4" vidFullURI The full video URI. This will work for all URLTypes supported by VideoJS-Youtube2: youtube.com or youtu.be Regular style: (http://www.youtube.com/watch?v=xjS6SftYQaQ) Embeded style: (http://www.youtube.com/embed/xjS6SftYQaQ) Playlist URLs: (http://www.youtube.com/playlist?list=PLA60DCEB33156E51F) (http://www.youtube.com/watch?v=xjS6SftYQaQ&list=SPA60DCEB33156E51F) ποΈ embed-video YoutubeStyle ποΈ Examples: # ytVidID Only #{{< embed-video name=“ytVidIDtest” techOrder=“youtube” ytVidID=“dYaX2xjB9y4” >}} ytVidID Only - show video link #{{< embed-video name=“ytVidIDtest” techOrder=“youtube” showLink=true ytVidID=“dYaX2xjB9y4” >}} (VideoURL:https://www.youtube.com/watch?v=dYaX2xjB9y4) vidFullURI embed endpoint (with displayed link) Example #{{< embed-video name=“yttest2” techOrder=“youtube” showLink=true vidFullURI=“http://www.youtube.com/embed/dYaX2xjB9y4" >}} (VideoURL:http://www.youtube.com/embed/dYaX2xjB9y4) vidFullURI Example # {{< embed-video name=“yttest2” techOrder=“youtube” vidFullURI=“https://www.youtube.com/watch?v=dYaX2xjB9y4" >}} ποΈ NOTE: I’ve not figured out how to get rid of the poster image bullshit here. todo later. have wasted too much time on this for the moment Skwirreltrap-Hosted Content #πΏοΈπͺ€ πΏοΈπͺ€ Click here for information specific to embedding video content sourced from Skwirreltrap β Required parameters # Parameter Type Example Purpose name string NocSunPromo04.m4v The video asset to load. This should be in the asset repo3 . …. Pretty simple, yes? Optional relevant parameters # Parameter Type Default Purpose path string vids/ Specifies the path4 portion of the URI vidFullURI Full Video URI false overrides the entire URI assembly logic. Facilitates hosting things whereverOr displaying the same video multiple times (via using different name values) πΏοΈπͺ€ embed-video SkwirreltrapStyle πΏοΈπͺ€ Examples: # name Only #{{< embed-video name=“NocSunPromo04.m4v” >}} πΏοΈπͺ€ name Only - show video link #{{< embed-video name=“NocSunPromo09.mp4” showLink=true >}} πΏοΈπͺ€ (VideoURL:https://assets.wolfspyre.io/vids/NocSunPromo09.mp4) name and path - show video link #{{< embed-video name=“UDUMASS.m4v” path=“lulz/” showLink=true >}} (VideoURL:https://assets.wolfspyre.io/lulz/UDUMASS.m4v) name and path #{{< embed-video name=“Panda.mp4” path=“lulz/” >}} “External” Content #π₯π¬πͺ There are two ways to use the embed-video shortcode with external video assets. The most straightforward is to just declare the name and use vidFullURI to define the entire URI: π₯π¬πͺ Click to see the relevant parameters. β Required parameters # Parameter Type Example Purpose name string SomeVideo The label to use as the ID of the asset. This shouldn’t have spaces.. vidFullURI Full Video URI false Since this asset is not hosted on skwirreltrap, the entire URI needs be declared OR, if you want to, you can declare the different parts of vidURI5 resource fed to the videojs player as a $.Scratch variable: The parameters’ default values work for video content stored in Skwirreltrap’s assets.wolfspyre.io staticsite. Here’s a breakdown: https6://host7/path/4name π₯π¬πͺ Click here for a piecemeal list β vidURI Parameters #name #String Required The video asset in question https #Boolean (Default: true) Toggle if video src is/is not HTTPS host #FQDN (Default: assets.wolfspyre.io) Overrides the host portion of the amalgamated URL for the video asset. path #String (Default: vids/) Sets the path segment of the video URI π₯π¬πͺ name and vidFullURI - show video link #{{< embed-video name=“PandaLink” showLink=true vidFullURI=“https://wplimgs.dog.wolfspyre.io/PandaCheese.mp4" >}} (VideoURL:https://wplimgs.dog.wolfspyre.io/PandaCheese.mp4) name and vidFullURI #{{< embed-video name=“PandaCheese” vidFullURI=“https://wplimgs.dog.wolfspyre.io/PandaCheese.mp4" >}} π https://videojs.com ↩︎ https://github.com/videojs/videojs-youtube#how-does-it-work> ↩︎ https://gitlab.wolfspyre.io/wolfspyrelabs/skwirreltrap-asset ↩︎ This defaults to vids/ ↩︎ ↩︎ [embed-video.html:133] ↩︎ This is set to https by default. If the shortcode is fed https=false it will be set to http ↩︎ This defaults to assets.wolfspyre.io ↩︎