https://github.com/sh20raj/sopplayer

Sopplayer - HTML5 Stylish Video Player
https://github.com/sh20raj/sopplayer

custom-video-player html5-video-player player sh20raj sopplayer video-js videojs-custom-skin videojs-skin

Last synced: 10 months ago
JSON representation

Sopplayer - HTML5 Stylish Video Player

• Host: GitHub
• URL: https://github.com/sh20raj/sopplayer
• Owner: SH20RAJ
• License: mit
• Created: 2020-12-23T11:56:27.000Z (over 5 years ago)
• Default Branch: main
• Last Pushed: 2024-07-03T08:49:20.000Z (almost 2 years ago)
• Last Synced: 2024-12-07T20:51:09.449Z (over 1 year ago)
• Topics: custom-video-player, html5-video-player, player, sh20raj, sopplayer, video-js, videojs-custom-skin, videojs-skin
• Language: JavaScript
• Homepage: https://sh20raj.github.io/Sopplayer/
• Size: 18.4 MB
• Stars: 11
• Watchers: 1
• Forks: 9
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# [Sopplayer](https://github.com/SH20RAJ/Sopplayer/) Integration - HTML5 Stylish Video Player

[![](https://data.jsdelivr.com/v1/package/gh/sh20raj/sopplayer/badge)](https://www.jsdelivr.com/package/gh/sh20raj/sopplayer)

[![Visitors](https://api.visitorbadge.io/api/combined?path=https%3A%2F%2Fgithub.com%2FSH20RAJ%2Fsopplayer&labelColor=%2337d67a&countColor=%23ba68c8&style=flat)](https://visitorbadge.io/status?path=https%3A%2F%2Fgithub.com%2FSH20RAJ%2Fsopplayer)

Sopplayer is a sleek and feature-rich HTML5 video player that enhances the visual experience of videos on web pages. It offers compatibility across devices and browsers, supporting various video formats. With intuitive controls and customizable options, Sopplayer provides a seamless and captivating playback experience for viewers.

> See All SopProducts: [https://sh20raj.github.io/SopProducts/](https://sh20raj.github.io/SopProducts/)

> Sopplayer Players: [https://sh20raj.github.io/Sopplayer/players/](https://sh20raj.github.io/Sopplayer/players/)

![Sopplayer Screenshot](https://1.bp.blogspot.com/-MXdsGGbh59A/X-cM2B2eQ6I/AAAAAAAAAZU/KLEP-6BI85gMXR-7NjBWIdxnCKyIaNzbACLcBGAsYHQ/w640-h361/sopplayer.JPG)

**See Video Documentation**: [https://youtu.be/Tmj2QOXE6EU](https://youtu.be/Tmj2QOXE6EU)

**Player Demo**: https://codepen.io/SH20RAJ/pen/QwLRpyx

## Table of Contents

- [Steps](#steps)

- [Before Sopplayer](#before-sopplayer)

- [After Sopplayer](#after-sopplayer)

- [Full HTML Code Example](#full-html-code-example)

- [Additional Information](#additional-information)

- [Demo](./home.html)

## Steps

1. Use the `class="sopplayer"` in your `` tag.

2. Add `data-setup="{}"` attribute to your `` tag.

```html

  

  

```

3. Add the CSS CDN before the closing `` tag.

```html

```

4. Add the JavaScript CDN before the closing `