How to Add Twitter Card Tags to Shopify & WooCommerce
errorThe Problem
Your pages are missing Twitter Card meta tags. When someone shares your product or store link on X (formerly Twitter), it shows as a plain text URL instead of a rich card with an image, title, and description.
trending_upWhy It Matters for SEO
Tweets with rich cards get significantly more engagement than plain text links. Twitter Cards make your shared links look professional and trustworthy — showing a product image, title, and description. This drives more clicks back to your store. The tags also work on other platforms that read Twitter Card markup, like Slack and Discord.
buildHow to Fix It
- 1
Open Online Store → Themes → Edit Code.
- 2
Open layout/theme.liquid.
- 3
Add Twitter Card meta tags in the <head> section. You can place them right after any existing Open Graph tags.
- 4
Shopify provides the necessary variables for dynamic content.
- 5
Save and test by pasting a product URL into Twitter's Card Validator or sharing on X.
<!-- Add to layout/theme.liquid inside <head> -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="{{ page_title }}">
<meta name="twitter:description" content="{{ page_description | escape }}">
{% if page_image %}
<meta name="twitter:image" content="https:{{ page_image | img_url: '1200x630' }}">
{% endif %}
<!-- Optional: add your Twitter handle -->
<meta name="twitter:site" content="@YourStoreHandle">Related Fix Guides
How to Fix Missing Open Graph Tags on Shopify & WooCommerce
Your pages look bad when shared on social media. Learn how to add Open Graph tags to your Shopify or WooCommerce store for better social sharing.
How to Fix Missing Meta Descriptions on Shopify & WooCommerce
Fix missing meta descriptions on your Shopify or WooCommerce store. Learn how to write compelling descriptions that boost click-through rates from Google.
Want to check if YOUR store has this issue?
Scan your site for free — get copy-paste fixes in 60 seconds.
searchScan Now — It's Free