Adds social sharing buttons to the video widget for Facebook, Twitter, and your own generic embed code.
Share your embeded video URL directly from the unit itself. This plugin adds a Facebook and Twitter (more possible) widget to your player to share the page URL without having to scroll to your page’s own share tools.
This plugin requires Video.js and was created with version 7.2.
It also uses flexbox.
- Install Video.js
- Add the videojs-socialShare CSS to your page
- Initialize the plugin with some social sharing information in JSON format
- Test to see that the social sharing tools appear
Below is a sample use case. Feel free to add the videojs-socialShare CSS/JS to your own project how you see fit. Separated here as an example.
The order in which the options are listed in the configuration object governs the order in which the buttons will appear.
You can also specify additional sharing mechanisms. These are specified with an icon (in SVG format) and a callback function, as shown below:
For Facebook to work to the best of its ability, you need to have implemented the Facebook SDK or at least the og metadata, include the
You should also style this to work across viewports, since this is only a cursory example for desktop, although it'll probably work fine on smaller screens. It also doesn't have a fallback for mobile, for example, appearing under or over the video itself, since it appears on hover and mobile devices don't do that.
Let me know if you run into any bugs or recommendations.