Implementing a Custom Share Card for Video Sharing

Overview:

When users share a video from the SDK player, the default behavior is to generate a simple link to the video URL. To enhance the sharing experience, the link should generate a custom preview card on social platforms like Facebook. This is achieved by ensuring that the video URL points to a webpage containing the appropriate Open Graph metadata.

Steps to Implement:

Add Open Graph Tags to the Webpage:

Ensure that the webpage associated with the video URL includes the following Open Graph metadata in the <head> section:

<head>
    <meta property="og:title" content="Your Video Title" />
    <meta property="og:description" content="Your Video Description" />
    <meta property="og:image" content="https://example.com/your-thumbnail.jpg" />
    <meta property="og:url" content="https://example.com/your-video-page" />
    <meta property="og:type" content="video.other" />
</head>

Open Graph Tags Details:
- og:title: The title of the video.
- og:description: A brief description of the video content.
- og:image: URL to the video thumbnail image.
- og:url: The URL to the webpage where the video is hosted.
- og:type: Set to video.other to specify the type of content.

Open Graph Tag Requirements:

These Open Graph tags are crucial for generating a rich preview when the video link is shared on social platforms like Facebook.
Facebook and similar platforms do not support custom previews when sharing directly from the iOS share sheet. The preview is generated based on the metadata provided by the URL.

Conclusion:

By ensuring the appropriate Open Graph tags are added to the webpages associated with your video URLs, you can enhance the sharing experience with a custom share card that includes the video thumbnail, title, and description.