-
-
Notifications
You must be signed in to change notification settings - Fork 3.1k
How to use Plyr.io video player in a Laravel application with Bootstrap. help me #2835
Unanswered
madfortech
asked this question in
Q&A
-
<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSRF Token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<link rel="canonical" href="https://www.AppName.com/home.html">
<meta property="og:url" content="https://www.AppName.com/home.html">
<meta name="Author " content="Author name">
<meta name="twitter:description" content="write description here">
<meta property="og:description" content="wrtie description here">
<meta property="og:type" content="website">
<meta property="og:title" content="AppName">
<meta name="twitter:title" content="AppName">
<meta name="description" content="write description here">
<link rel="stylesheet" href="{{asset('css/bootstrap.min.css')}}">
<link rel="manifest" href="{{asset('manifest.json')}}" crossorigin="use-credentials">
<link rel="stylesheet" href="{{asset('css/styles.min.css')}}">
<!-- Fonts -->
<link rel="dns-prefetch" href="//fonts.bunny.net">
<link href="https://fonts.bunny.net/css?family=Nunito" rel="stylesheet">
<!-- Scripts -->
@vite(['resources/sass/app.scss', 'resources/js/app.js'])
<style>
input[type=text]{
border: 2px solid;
border-color: #bea6ff;
}
</style>
<script src="https://cdn.plyr.io/3.7.8/plyr.polyfilled.js"></script>
<script>
const player = new Plyr('#player', {
type: 'video',
});
</script>
</head>
@if($item->getMedia('videos')->count() > 0)
<!-- <video src="{{ asset($item->getMedia('videos')[0]->getUrl()) }}"
class="object-fit-contain w-100" controls>
</video> -->
<video
id="player"
playsinline
controls
class="object-fit-contain w-100"
data-poster="/path/to/poster.jpg">
<source src="{{ asset($item->getMedia('videos')[0]->getUrl()) }}"
type="video/mp4" />
</video>
@endif
~~~
Beta Was this translation helpful? Give feedback.
All reactions
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment