When you share a link to your online store on Facebook, Twitter, LinkedIn, or messaging apps, the platform automatically generates a social preview image. This image is also known as an Open Graph (OG) image. Setting it correctly helps your brand look professional and encourages more clicks from social media.
What Is a Social Preview Image?
A social preview image is the thumbnail that appears alongside your page title and meta description when a link is shared on social media. It gives customers a visual first impression of your store.
For example:
- A product page usually shows its featured product image.
- A collection page usually shows its featured collection image.
- A custom landing page built with GemPages can display its own preview image.
How to Set Social Preview Images by Page Type
1. Homepage Social Preview Image
The Homepage social preview image can only be set in Shopify Admin.
Steps:
- From your Shopify Admin, go to Online Store > Preferences.
- Scroll to the Social sharing image section.
- Click Add image (or Change if updating).
- Upload the image you want to use.
- Click Save.
2. Product Page Social Preview Image
When a product page is shared on social media, Shopify automatically displays the featured product image.
Steps to update:
- Go to Products in your Shopify Admin.
- Select the product you want to edit.
- In the Media section, upload or update the featured image.
- Click Save.
3. Collection Page Social Preview Image
Collection pages use the collection’s featured image as the social preview image.
Steps to update:
- In your Shopify Admin, go to Products > Collections.
- Open the collection you want to edit.
- In the Collection image field, upload or change the featured image.
- Click Save.
4. Blog Post Social Preview Image
When you share a blog post, Shopify uses its featured image as the preview image.
Steps to update:
- From your Shopify Admin, go to Content > Blog posts.
- Choose the blog post you want to edit.
- In the Featured image section, upload or update the image.
- Click Save.
5. GemPages Landing Page Social Preview Image
For custom landing pages built with GemPages, you can assign a specific preview image directly in the editor.
Steps:
- Open your page in the GemPages Editor.
- Go to Publish Settings > Social Sharing.
- Upload the image you want to use as the preview.
- Save and republish the page.
Thank you for your comments