Skip to content
This repository was archived by the owner on Oct 3, 2024. It is now read-only.

Generic Installation Guide

Jump to bottom
Chad Wade Day, Jr edited this page Jan 6, 2019 · 1 revision

Here's a guide without platform-specific instructions, so adapt as needed.

Here's how to get the video tag bbcode working on Jcink Forum Hosting

Prerequisites

To install this code your software needs three things:

  • The ability to create new BBCodes
  • The ability to add JavaScript to your board
  • The ability to add StyleSheets and custom CSS to your board

Add the following CSS and JavaScript in the <head> tag of your board. This should be on any page where posts can show up so the bbcode can be parsed by our JavaScript

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/video-tag@beta/dist/video-tag.css" />
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/video-tag@beta/dist/video-tag.js"></script>

Eventually the @beta tag will be swapped for @stable or something similar. You can self-host this code yourself by downloading files from our releases page and using them instead.

You can style the tag a bit as well. I recommend adding the following CSS to somewhere in your stylesheets to start:

.video-tag {
  margin: 1em 1em 1em 0;
  max-width: 100%;
}

You can also style the fallback link as well with the video-tag-fallback class.

By default the video should go the width of a post in a 16:9 aspect ratio.

BBCodes

The main BBCode is a 1-param code where users can just paste in an URL. It only accepts URLs- don't paste just a video ID in the code.

Main Code

You'll want to create a bbcode with 1 required parameter and 1 optional one. In the HTML I'll call the required one {PARAM1} and the optional one {PARAM2}- replace these as needed with whatever your software wants for those parameters instead. The tag can be called video or anything else you like.

<div class="video-tag" data-source="{PARAM1}" data-provider="{PARAM2}"><a class="video-tag-fallback" href="{PARAM1}">{PARAM1}</a></div>

Here's an example of the bbcode in a post:

[video]https://www.youtube.com/watch?v=g4Hbz2jLxvQ[/video]

And one with the optional parameter you can post a video just using a video ID:

[video=YouTube]g4Hbz2jLxvQ[/video]

The fallback won't work if a user enters just a video ID- typically it's way easier to just share URLs so you shouldn't expect users to use that feature too much anyway.

See the Jcink Forum Hosting installation guide for other BBCode ideas.

Clone this wiki locally