How do I customize the preview when people share my giveaway link?
Quick answer
Facebook and X build the link preview from the Open Graph meta tags in your page's header. To show a custom image, title and description for your giveaway, add those tags to your giveaway page with an SEO or Open Graph app, or have your developer add them in theme.liquid. The rest of your store keeps its default preview.
Giveaway Ninja can't edit your theme pages, so the tags have to come from an app or from your theme code. No developer? Use the giveaway's Direct URL instead.
How do I add the tags with Liquid?
- Create a dedicated landing page for the giveaway, for example
/pages/giveaway. See how to embed a giveaway on a Shopify landing page. - In Shopify Admin, go to Online Store > Themes, click the ... menu next to your theme, choose Edit code and open
theme.liquid. - Find the line that renders your theme's social tags. It's usually
{% render 'meta-tags' %}in Dawn and newer themes, or{% render 'social-meta-tags' %}in older ones. - Replace that line with the code below. Keep your theme's own snippet name in the
elsebranch.
{% if page.handle == 'giveaway' %}
<meta property="og:type" content="website">
<meta property="og:title" content="--- preview title here ---">
<meta property="og:description" content="--- preview description here ---">
<meta property="og:image" content="https://cdn.shopify.com/s/files/---">
<meta property="og:image:secure_url" content="https://cdn.shopify.com/s/files/---">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="--- X preview title here ---">
<meta name="twitter:description" content="--- X preview description here ---">
<meta name="twitter:image" content="https://cdn.shopify.com/s/files/---">
{% else %}
{% render 'meta-tags' %}
{% endif %}page.handle == 'giveaway'matches the/pages/giveawaypage. Change it if your page has another handle.- In your giveaway, set the URL to share in the Refer-a-Friend action to
/pages/giveaway, so every referral link points to the page with the custom tags.
Facebook and X now pull the preview from /pages/giveaway, while every other page keeps the default preview set in Online Store > Preferences.
How do I test the preview?
Paste your giveaway URL into opengraph.xyz or Facebook's Sharing Debugger. If Facebook still shows the old preview, click Scrape Again in the Sharing Debugger.
No developer? Use the Direct URL
Publish the giveaway on its own giveaway.ninja page instead. Edit the giveaway, open the GIVEAWAY tab and, in the Direct URL section, turn on Publish on giveaway.ninja. Then upload a 1,200 x 630 pixel image under FB/X OpenGraph Cover Image.
Links to that page show your image, with the giveaway's title and description as the preview text. See how to set up a giveaway on Shopify.
People also ask
Why does my shared giveaway link show the wrong image?
Facebook and X use your page's Open Graph tags, which default to your store's settings. Add custom tags for the giveaway page, then refresh the preview in Facebook's Sharing Debugger. Get more ways to drive traffic to your giveaway.
Do referral links use the same preview?
Yes, as long as the URL to share in the Refer-a-Friend action points to your giveaway page. See how the refer-a-friend entry action works.
Still stuck?
Our support team is available 24/7 and always replies. Send us a message and we'll help you sort it out.