Image not showing when sharing links

Topic summary

A user reports that link previews for their site have stopped displaying product or page images when shared on social media platforms (Facebook, Twitter) and text messages. The issue appears to have worked previously but recently broke.

Code shared:

  • Partial theme.liquid file showing meta tags and preconnect configurations
  • Snippet from _meta-tags.liquid including Open Graph and Twitter Card meta tags

Current status:

  • Another participant has offered to investigate if provided with the website URL
  • No diagnosis or solution has been identified yet
  • The discussion remains open and awaiting further troubleshooting
Summarized with AI on October 26. AI used: claude-sonnet-4-5-20250929.

So i noticed that when sharing links of my site via text messages, facebook, twitter, ect it stopped showing the main product or page image like it used to. can someone please help me figure out how to fix this. I’ll include my theme.liquid file and my snippets/_meta-tags.liquid files below

<!doctype html>
<html class="no-js" lang="{{ request.locale.iso_code }}">
<head>

    <meta charset="utf-8">
  <script>
  window.lazyImageOnLoad = function(img) {
    img.setAttribute('loaded', '');
  };

  window.loadStyle = function(linkElement) {
    if (linkElement && linkElement.rel === 'stylesheet') {
      linkElement.media = 'all';
    }
  };
</script>

    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta http-equiv="Content-Security-Policy" content="object-src 'none';">
    <link rel="canonical" href="{{ canonical_url }}">
    <link rel="preconnect" href="https://cdn.shopify.com" crossorigin>
    <link rel="dns-prefetch" href="https://cdn.shopify.com">
    

    {% unless settings.type_header_font.system? and settings.type_body_font.system? %}
        <link rel="preconnect" href="https://fonts.shopifycdn.com" crossorigin>
    {% endunless %}
    
    <link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link rel="preconnect" href="https://hatscripts.github.io">
 
    {% unless settings.type_body_font.system? %}
        <link rel="preload_tag" as="font" href="{{ settings.type_body_font | font_url }}" type="font/woff2" crossorigin>
    {% endunless %}
    
    {% unless settings.type_header_font.system? %}
        <link rel="preload_tag" as="font" href="{{ settings.type_header_font | font_url }}" type="font/woff2" crossorigin>
    {% endunless %}

 <!-- Open Graph -->
    <meta property="og:type" content="website">
    <meta property="og:title" content="{{ page_title | escape }}">
    <meta property="og:description" content="{% if page_description %}{{ page_description | escape }}{% else %}Home Furnishing Supplies | Blinds Parts | Alan Richard Textiles.{% endif %}">
    <meta property="og:url" content="{{ canonical_url }}">
    <meta property="og:site_name" content="Alan Richard Textiles">
    <meta property="og:image:width" content="1200">
    <meta property="og:image:height" content="630">

{% assign twitter_image = '' %}
{% if template == 'product' and product.featured_image %}
  {% assign twitter_image = product.featured_image | img_url: '1200x630' %}
{% elsif template == 'collection' and collection.image %}
  {% assign twitter_image = collection.image | img_url: '1200x630' %}
{% else %}
  {% assign twitter_image = '' %}
{% endif %}

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="{{ page_title | escape }}" />
<meta name="twitter:description" content="{% if page_description %}{{ page_description | escape }}{% else %}Home Furnishing Supplies | Blinds Parts | Alan Richard Textiles.{% endif %}" />
{% if twitter_image != '' %}
  <meta name="twitter:image" content="{{ twitter_image }}" />
{% endif %}
<meta name="twitter:site" content="@alanrichardtex" />
<meta name="twitter:creator" content="@alanrichardtex" />

  
    <title>
        {{ page_title }}
        {% if current_tags %} &ndash; tagged "{{ current_tags | join: ', ' }}"{% endif %}
        {% if current_page != 1 %} &ndash; Page {{ current_page }}{% endif %}
    </title>
<link rel="icon" href="https://cdn.shopify.com/s/files/1/0256/1078/0746/files/alan_circle_logo_basic_copy.png?v=1704771794" type="image/png">

    {% if page_description %}
        <meta name="description" content="{{ page_description | escape }}">
    {% endif %}
    
    {% if template contains 'product' %}
        <link rel="preload_tag" as="image_tag" imagesrcset="{{ product.media.first | image_url: '165x' }} 165w,
            {{ product.media.first | image_url: '360x' }} 360w,
            {{ product.media.first | image_url: '533x' }} 533w,
            {{ product.media.first | image_url: '720x' }} 720w,
            {{ product.media.first | image_url: '940x' }} 940w,
            {{ product.media.first | image_url: '1066x' }} 1066w,
            {{ product.media.first | image_url: '1200x' }} 1200w,
            {{ product.media.first | image_url: '1400x' }} 1400w,
            {{ product.media.first | image_url: '1600x' }} 1600w,
            {{ product.media.first | image_url: '1800x' }} 1800w,
            {{ product.media.first | image_url: 'master' }} {{ image.width }}w"
        href="{{ product.media.first | image_url: 'master' }}"
        {% if srcsize_desktop != blank or srcsize_mobile != blank %}
            imagesizes="{% if srcsize_desktop != blank %}(min-width: 992px) calc({{ srcsize_desktop }}),{% endif %}{% if srcsize_mobile != blank %}(max-width: 991px) calc({{ srcsize_mobile }}), {% endif %} 100vw"
        {% endif %} />
        <link rel="stylesheet_tag" as="style" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />
    {% endif %}

    {% render '_meta-tags' %}
    {{ content_for_header }}
    {% render '_css-vars' %}

    <script>
        document.documentElement.className = document.documentElement.className.replace('no-js', 'js');
        if (Shopify.designMode) {
            document.documentElement.classList.add('shopify-design-mode');
        }
        function lazyImageOnLoad(img) {
            img.setAttribute('loaded', '');
        }
    </script>

    {{ 'core.css' | asset_url | stylesheet_tag }}
    {{ 'style.css' | asset_url | stylesheet_tag }}
    
    
<script>
  window.renderBadge = function() {
    var ratingBadgeContainer = document.createElement("div");
    document.body.appendChild(ratingBadgeContainer);
    window.gapi.load('ratingbadge', function() {
      window.gapi.ratingbadge.render(ratingBadgeContainer, {
        "merchant_id": 6672198,
        "position": "BOTTOM_LEFT"
      });
      ratingBadgeContainer.style.position = "fixed";
      ratingBadgeContainer.style.bottom = "0px";
      ratingBadgeContainer.style.left = "60px";
    });
  };
</script>

  
  <script>
document.addEventListener('DOMContentLoaded', function() {
  let scriptsLoaded = false;

  function loadThirdPartyScripts() {
    if (scriptsLoaded) return;
    scriptsLoaded = true;

   // Load Userway Widget with dynamic preconnect
    (function() {
      var preconnectLink = document.createElement('link');
      preconnectLink.rel = 'preconnect';
      preconnectLink.href = 'https://cdn.userway.org';
      document.head.appendChild(preconnectLink);

      var userwayScript = document.createElement('script');
      userwayScript.src = "https://cdn.userway.org/widget.js";
      userwayScript.setAttribute('data-account', 'ORqGnwndMI');
      userwayScript.async = true;
      document.body.appendChild(userwayScript);
    })();

    // Load Google Platform Script with onload callback 'renderBadge'
    (function() {
      var googlePlatformScript = document.createElement('script');
      googlePlatformScript.src = "https://apis.google.com/js/platform.js?onload=renderBadge";
      googlePlatformScript.async = true;
      document.body.appendChild(googlePlatformScript);
    })();

    // Load Judge.me Stylesheet
    (function() {
      var judgeMeCSS = document.createElement('link');
      judgeMeCSS.rel = 'stylesheet';
      judgeMeCSS.href = "https://cdn.judge.me/widget_v3/base.css";
      document.head.appendChild(judgeMeCSS);
    })();

    // Load Judge.me Scripts asynchronously
    (function() {
      var judgeMeScriptSrcs = [
        "https://cdn1.judge.me/assets/installed.js?shop=alan-richard-textiles-ltd.myshopify.com",
        "https://cdn.judge.me/loader.js",
        "https://cdn.judge.me/widget/base.js",
        "https://cdn.judge.me/widget/common.js",
        "https://cdn.judge.me/widget/others.js"
      ];
      judgeMeScriptSrcs.forEach(src => {
        let script = document.createElement('script');
        script.src = src;
        script.async = true;
        document.body.appendChild(script);
      });
    })();

    // Load Google Analytics gtag
    (function() {
      if (window.gtagLoaded) return;
      window.gtagLoaded = true;

      var gaScript = document.createElement('script');
      gaScript.src = "https://www.googletagmanager.com/gtag/js?id=G-5PG7MG9VY1";
      gaScript.async = true;
      document.head.appendChild(gaScript);

      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      window.gtag = gtag;

      gtag('js', new Date());
      gtag('config', 'G-5PG7MG9VY1', { 'anonymize_ip': true });
    })();
  }

  // Attach event listeners once for user interaction to load scripts
  ['scroll', 'mousemove', 'touchstart', 'keydown'].forEach(event => {
    window.addEventListener(event, loadThirdPartyScripts, { once: true });
  });
});
</script>


</head>
<body>
    
    {% render '_js-vars' %}
    {% render 'icons-sprite' %}
    
   <cart-provider {% if request.page_type == 'cart' %}cart-page{% endif %}>
        {% if request.page_type != 'cart' %}
            {% if settings.enable_cart_notification %}
                <cart-notification></cart-notification>
                <script type="module" src="{{ 'cart-notification.js' | asset_url }}" defer></script>
                {% if settings.cart_notification_enable_recommendations %}
                    <script type="module" src="{{ 'cart-notification-recommendations.js' | asset_url }}" defer></script>
                {% endif %}
            {% endif %}
           {% section 'g_cart-drawer' %}
        {% endif %}

        {% render 'load-css', file: 'spinner', lazy: true %}
        {% section 'g_newsletter-popup' %}
        {% sections 'header-group' %}

        <main id="MainContent" class="content-for-layout focus-none" role="main" tabindex="-1">
            {{ content_for_layout }}
        </main>

        <ul hidden>
            <li id="a11y-refresh-page-message">{{ 'accessibility.refresh_page' | t }}</li>
        </ul>

        {% sections 'footer-group' %}
        {% render 'posted-popup' %}
        {% render 'modal-popup' %}
        {% render 'page-spinner' %}
        {% render 'toast-notification' %}
    </cart-provider>

    <script type="module" src="{{ 'cart-provider.js' | asset_url }}" defer></script>

    {% if settings.scroll_to_top_button %}
        {% render 'scroll-to-top-button' %}
    {% endif %}
    
    {% if settings.disable_right_click %}
        <script defer>
            document.addEventListener('contextmenu', event => event.preventDefault());
        </script>
    {% endif %}
    
    <script type="module" src="{{ 'dynamic-icon.js' | asset_url }}" defer></script>
    <script type="module" src="{{ 'drop-down.js' | asset_url }}" defer></script>
    
    {% if settings.product_card_show_express_button %}
        {% render 'load-css', file: 'express-option-list', lazy: true %}
        <script type="module" src="{{ 'express-option-list.js' | asset_url }}" defer></script>
    {% endif %}

    <script defer>
        if (window.innerWidth <= 992) {
            function setMobileViewportHeight() {
                document.querySelector(':root').style.setProperty('--mobile-viewport-height', window.innerHeight + 'px');
            }
            window.addEventListener('resize', setMobileViewportHeight);
            setMobileViewportHeight();
        }
    </script>

    {% if request.design_mode %}
        {% render 'editor-scripts' %}
    {% endif %}
    
    {% if settings.enable_cart_notification %}
        {% render 'load-css', file: 'cart-notification', lazy: true %}
        {% if settings.cart_notification_enable_recommendations %}
            {% render 'load-css', file: 'cart-notification-recommendations', lazy: true %}
            {% render 'load-css', file: 'product-card-min', lazy: true %}
            {% render 'load-css', file: 'swiper', lazy: true %}
        {% endif %}
    {% endif %}
    
    {% render 'quick-view-styles-fix' %}
    {% render 'gm-custom' %}
    {% render 'ot-qty' %}
  
    <script>
        var first_time_accessed = "{{ settings.first_time_accessed | escape }}";
    </script>

    <!-- Start of Judge.me Core - Optimized -->
    <link rel="preconnect" href="https://cdn.judge.me/" crossorigin>
    <link rel="dns-prefetch" href="https://cdn.judge.me/">

    {{ shop.metafields.judgeme.settings }}

    {% for count in (0..5) %}
      {% assign metafield_key = 'html_miracle_' | append: count %}
      {% assign current_metafield = shop.metafields.judgeme[metafield_key] %}
      {% unless current_metafield %} {% break %} {% endunless %}
      {{ current_metafield }}
    {% endfor %}

    <script data-cfasync='false' class='jdgm-script' defer>
    !function(e){window.jdgm=window.jdgm||{},jdgm.CDN_HOST="https://cdn.judge.me/",
    jdgm.docReady=function(d){(e.attachEvent?"complete"===e.readyState:"loading"!==e.readyState)?
    setTimeout(d,0):e.addEventListener("DOMContentLoaded",d)},jdgm.loadCSS=function(d,t,o,s){
    !o&&jdgm.loadCSS.requestedUrls.indexOf(d)>=0||(jdgm.loadCSS.requestedUrls.push(d),
    (s=e.createElement("link")).rel="stylesheet",s.class="jdgm-stylesheet",s.media="nope!",
    s.href=d,s.onload=function(){this.media="all",t&&setTimeout(t)},e.body.appendChild(s))},
    jdgm.loadCSS.requestedUrls=[],jdgm.docReady(function(){(window.jdgmLoadCSS||e.querySelectorAll(
    ".jdgm-widget, .jdgm-all-reviews-page").length>0)&&(jdgmSettings.widget_load_with_code_splitting?
    parseFloat(jdgmSettings.widget_version)>=3?jdgm.loadCSS(jdgm.CDN_HOST+"widget_v3/base.css"):
    jdgm.loadCSS(jdgm.CDN_HOST+"widget/base.css"):jdgm.loadCSS(jdgm.CDN_HOST+"shopify_v2.css"))})}(document);
    </script>
    <!-- End of Judge.me Core -->

    <noscript><link rel="stylesheet" type="text/css" media="all" href="https://cdn.judge.me/shopify_v2.css"></noscript>
    <!-- End of Judge.me Core -->

    <nav id="breadcrumbs" aria-label="breadcrumbs">
        <script>
            (function() {
                const breadcrumbHistory = JSON.parse(localStorage.getItem('breadcrumbHistory')) || [];
                const navElement = document.querySelector("#breadcrumbs");

                breadcrumbHistory.forEach((page, index) => {
                    const isLastPage = index === breadcrumbHistory.length - 1;
                    const content = isLastPage ? `<span aria-current="page">${page.title}</span>` : `<a href="${page.url}">${page.title}</a>`;
                    navElement.innerHTML += `<div class="${isLastPage ? 'current-breadcrumb' : 'breadcrumb'}">${content}${!isLastPage ? ' &gt; ' : ''}</div>`;
                });
            })();
        </script>
    </nav>

    <script>
        function adjustContentMargin() {
                     const menu = document.querySelector('.gm-menu-installed .gm-menu');
            if (!menu) return;

            const menuHeight = menu.offsetHeight;

            const mainContent = document.querySelector('#MainContent') || document.querySelector('.main-content') || document.querySelector('main');

            if (!mainContent) return;

            mainContent.style.marginTop = menuHeight + 'px';
        }

        window.addEventListener('load', adjustContentMargin);
        window.addEventListener('resize', adjustContentMargin);
    </script>
  
  
</body>

</html>
{%- liquid
  assign og_title = page_title | default: shop.name
  assign og_url = canonical_url | default: shop.url
  assign og_type = 'website'
  assign og_description = page_description | default: shop.description | default: shop.name

  if request.page_type == 'product'
    assign og_type = 'product'
  elsif request.page_type == 'article'
    assign og_type = 'article'
  elsif request.page_type == 'collection'
    assign og_type = 'product.group'
  elsif request.page_type == 'password'
    assign og_url = shop.url
  endif
-%}
<meta property="og:site_name" content="{{ shop.name }}">
<meta property="og:url" content="{{ og_url }}">
<meta property="og:title" content="{{ og_title | escape }}">
<meta property="og:type" content="{{ og_type }}">
<meta property="og:description" content="{{ og_description | escape }}">
{%- if page_image -%}
  <meta property="og:image" content="http:{{ page_image | image_url: 'master' }}">
  <meta property="og:image:secure_url" content="https:{{ page_image | image_url: 'master' }}">
  <meta property="og:image:width" content="{{ page_image.width }}">
  <meta property="og:image:height" content="{{ page_image.height }}">
{%- endif -%}
{%- if request.page_type == 'product' -%}
  <meta property="og:price:amount" content="{{ product.price | money_without_currency | strip_html }}">
  <meta property="og:price:currency" content="{{ cart.currency.iso_code }}">
{%- endif -%}
<link rel="preconnect" href="https://cdn.shopify.com">
<script src="//cdn.shopify.com/s/files/1/0574/1140/3910/files/function.js?v=1709233602" type="text/javascript" ></script>
<script src="//cdn.shopify.com/s/files/1/0574/1140/3910/files/global.js?v=1709233602" type="text/javascript" ></script>
{%- if settings.social_twitter_link != blank -%}
  <meta name="twitter:site" content="{{ settings.social_twitter_link | split: 'twitter.com/' | last | prepend: '@' }}">
{%- endif -%}
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="{{ og_title | escape }}">
<meta name="twitter:description" content="{{ og_description | escape }}">

Hi @alanrichardtex,

Please send the website link, I will check it for you