Use custom video thumbnail generation

For each video that you upload in the video library, you can generate a video thumbnail by capturing images from the video. You then select the image you want to use as a video thumbnail in the video galley, for example.

In addition to this thumbnail generation, you can can create an automatic thumbnail generation mechanism for HTML5 videos. You do this by using a third-party component to generate the video thumbnails. For example, you can use the nReco video converter. You add a reference to the nReco assembly and then implement the interface for the custom thumbnail generation. Finally, you replace the default thumbnail generation with the custom one.

To do this:

  1. Download the nReco FFMpeg wrapper from www.nrecosite.com/video_converter_net.aspx
  2. In Visual Studio, add a reference from your project to the NReco.VideoConverter.dll assembly.
  3. In the IVideoThumbnailGenerator interface, implement the CustomVideoThumbnailGenerator method.

    EXAMPLE: For more information about the code of the class, see CustomVideoThumbnailGenerator.cs in Sitefinity documentation-samples on GitHub.

    In the code above, you instantiate object of type FFMpegConverter and you provide the full path to the:

    • Video file name
    • Image thumbnail
    • Frame that is used to create the thumbnail

    The FFMpegConverter object generates a thumbnail that is read as a file stream and an object of type System.Drawing.Image is returned as a result.

  4. In the Global.asax file of your project, replace the default video generation with object factory from the previous step, that is, the custom video generation functionality.

    EXAMPLE: For more information, see Global.asax.cs in Sitefinity documentation-samples on GitHub.

  5. Build your solution.

Want to learn more?

Sign up for our free beginner training. Boost your credentials through advanced courses and certification.
Register for Sitefinity training and certification.

Was this article helpful?