New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Loading the video plugin #9
Comments
Same question here, we need to use the video plugin... Did you found a solution @timnilson? |
@adrienlamotte No, I never got that working. |
Add video and thumbnails to the pin "stimulus-lightbox", to: "https://ga.jspm.io/npm:stimulus-lightbox@3.2.0/dist/stimulus-lightbox.mjs"
pin "lightgallery", to: "https://ga.jspm.io/npm:lightgallery@2.7.1/lightgallery.es5.js"
pin "lg-video", to: "https://ga.jspm.io/npm:lightgallery@2.7.1/plugins/video/lg-video.es5.js"
pin "lg-thumbnail", to: "https://ga.jspm.io/npm:lightgallery@2.7.1/plugins/thumbnail/lg-thumbnail.es5.js"
pin "lg-zoom", to: "https://ga.jspm.io/npm:lightgallery@2.7.1/plugins/zoom/lg-zoom.es5.js" Override controller and default options: import Lightbox from 'stimulus-lightbox'
import lgVideo from 'lg-video'
import lgThumbnail from 'lg-thumbnail'
import lgZoom from 'lg-zoom'
export default class extends Lightbox {
connect() {
super.connect()
}
get defaultOptions() {
return {
controls: true,
loop: true,
plugins: [lgZoom, lgVideo, lgThumbnail]
}
}
} Add styles (I don't know how to add them when using <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.7.1/css/lightgallery.min.css" integrity="sha512-F2E+YYE1gkt0T5TVajAslgDfTEUQKtlu4ralVq78ViNxhKXQLrgQLLie8u1tVdG2vWnB3ute4hcdbiBtvJQh0g==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.7.1/css/lg-video.min.css" integrity="sha512-89gDQOHnYjji90NPJ7+M5tgA/0E+fjL4KuSFhi6tjH6sZ54yUEogPMmOAgbI599fW1CtCyrsJbch8k/QzuoXzw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.7.1/css/lg-zoom.min.css" integrity="sha512-vIrTyLijDDcUJrQGs1jduUCSVa3+A2DaWpVfNyj4lmXkqURVQJ8LL62nebC388QV3P4yFBSt/ViDX8LRW0U6uw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.7.1/css/lg-thumbnail.min.css" integrity="sha512-GRxDpj/bx6/I4y6h2LE5rbGaqRcbTu4dYhaTewlS8Nh9hm/akYprvOTZD7GR+FRCALiKfe8u1gjvWEEGEtoR6g==" crossorigin="anonymous" referrerpolicy="no-referrer" /> Don't forget to use overriden controller filename instead of You're done. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I've tried to extend the stimulus component to load the needed lightgalleryjs video plugin to show YouTube videos. However, I can't get that working. Could you add an example in the documentation on how to do this? Thank you! Love your work Guillaume!
The text was updated successfully, but these errors were encountered: