How to change individual page link preview images for facebook og:image

wdshahinwdshahin Member Posts: 1
edited May 2021 in Theme and Design

Hello, Guys.

We have a link that you frequently share on Facebook.

https://www.theartofdetail.com/service/rendezvous-salon/

But when we share this link we get the default image preview.

My question is how to set a unique image for this page that will display upon sharing.

Any code example will be appreciated too.

Kind Regards.

Shahin

2 comments

  • carisa_collagepdxcarisa_collagepdx Member Posts: 2

    Hi there!

    I am having the same issue. Ecomm support said the only way to fix is to hire a developer to add lines of code. Wondering if anyone has the code figured out?


  • larry_nalzarolarry_nalzaro Member Posts: 30

    First, upload an image to associate with that page. Then note its internal URL.

    Second, modify your og tag, like so:

    {% if page.breadcrumbs[0].url == 'service/rendezvous-salon' %}
    <meta property="og:image" content="https://cdn.shoplightspeed.com/shops/634889/files/123456789/rendezvous-salon.jpg" />
    {% else %}
    <meta property="og:image" content="https://cdn.shoplightspeed.com/shops/634889/files/34219106/theartofdetail.jpg" />
    {% endif %}
    
Sign In or Register to comment.