Support » Plugin: WebVTT » Implement a navigation list of chapters

  • Is there any easy way of generating a list of chapters used in a video?

    There’s an example of how WebVTT chapters can be displayed as list:
    Demo 3: Video navigation using WebVTT Chapters

    Seems like there’s an space holder div which is filled with the chapters as list elements. Clicking on one of the chapter links has the effect that the video starts playing the specified chapter.

    This would be a really nice improvement which i’m was missing.

    • This topic was modified 5 years, 5 months ago by fireemerald.
Viewing 1 replies (of 1 total)
  • Plugin Author bobbywalters


    Hey @fireemerald, thanks for giving the plugin a try and I appreciate you taking the time to give feedback.

    WebVTT was created to get the tracks read in and used within administration screens and on normal pages as easy as possible following conventions and using all the standard WordPress shortcodes. As a result, the rendering is left up to any JavaScript handler, by default MediaElement.js in WordPress, and the browser to display and control the video. This allows any handler to be used without creating a dependency on how the track information is presented. Meaning, a new video player plugin could create their own filter and parse the <track> elements as they saw fit.

    Creating a separate chapters list would take some effort but not out of the realm of possibility. Some things that would need to be considered:

    • How to tell that the chapters should be split out into a separate list?
    • How to interact with subtitle language change to match the chapters to the right language?
    • What happens if there isn’t a matching language for both subtitle and chapter tracks?
    • What happens if a different handler other than MediaElement is used?

    I’d recommend checking out the MediaElement.js Plugins and seeing what’s possible using their API. MediaElement is quite robust in what it can do and creating a nice chapters list plugin would be a welcomed addition I’m sure. Plus the example you already came across could be a head start.

    Again, thanks for using WebVTT.

Viewing 1 replies (of 1 total)
  • The topic ‘Implement a navigation list of chapters’ is closed to new replies.