Home Feed
The current implementation of for the home feed relies Entry Points, and is only available for video content. This is expected to change in the near future.
Setting up your Shop Mini for the Home Feed allows you to reach thousands of users in the Shop App, but has extra requirements to ensure a great user experience. It is also an opportunity to not only show content from the merchant that a user clicked on, but to show content from other merchants that a user might be interested in.
There are both technical requirements and design guidelines that you should follow to ensure a great user experience.
Appearing on the Home Feed
Appearing on the Home Feed requires creating an Entry Point with the HOME_FEED
location and must be the VIDEO_COLLECTION_V2
type.
This entry point will be associated with a product via the owner_id
field.
The entry point should contain one item
, which contains the video, a poster image and list of related products where the first product is the same as the owner. All content must be served from Shopify CDN, and the video must be in m3u8
format (see uploading media for details about uploading videos and images).
The Shop App is responsible for selecting which content is being shown and is displayed in a way that is consistent with the design guidelines.
Since the Shop App is responsible for selecting the content, it is recommended to create an entry point for each product that you want to appear on the Home Feed.
Behavior inside the Mini
See the CrossMerchantShoppableVideos component for an out of the box implementation.
entryPointParams
The structure of the entryPointParams
object is as follows:
- The
entryPointParams.location
will beHOME_FEED
. external_id
will be set to the item that was clicked by the user. All other fields will be null.entrypoint.collectionItems
will contain a list of entry point videos with the recommended products for the merchant. See playback sequence for how to show these videos.
Playback Sequence
When your Mini is opened from the Home Feed, it should start playing the video from the external_id
field. After this video, it should continue playing videos from the entrypoint.collectionItems
array. After the last video, it should begin playing recommended videos from other merchants. These can be popular, trending or related videos but must include a variety of merchants. Dead ends should be avoided, if you run out of videos, start from the beginning. Only videos that have related products can be shown. A video without linked products is not acceptable when the Mini is opened from the home screen and should be skipped. If a product is ineligible, that product should not be shown and if all products are ineligible, the video should not be shown.
Audio Controls
Be sure to include mute/unmute audio controls. ignoreSilentSwitch
should be set to IGNORE
, since the buyer has already clicked on the video we can ignore the silent switch.
Merchant Branding We want to be sure that the merchant is always visible and identifiable. Make sure to include the brand logo and link it to the merchant's storefront.
Related Products The related products should be shown in the video player using either the ProductCard or ProductLink components.
Content Format
The content can be in any common format and can be served from any CDN, but it is highly recommended to use the m3u8
format for video. See uploading media for details about uploading videos and images.
Submissions
When submitting your Mini, make sure that in your manifest.json
you have a section for entry_points
that includes the HOME_FEED
location and the VIDEO_COLLECTION_V2
type.
"entry_points": [
{
"location": "HOME_FEED",
"type": "VIDEO_COLLECTION_V2"
}
]
Testing
To test your Mini appearing on the Home Feed, go to Settings > Development Mode > Preview Minis Entry Points. Follow instructions there to see an example entry point. When clicking on the entry point, you should see your Mini as if opened from the Home Feed.