Sign up
Quick links
cancel
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Showing results for 
Search instead for 
Did you mean: 

How to change the image when posting a link to social media platforms?

Solved
Highlighted
‎01-03-2020 02:35 AM
RyaneBin
New Member
7 0 0
I am using Mobilia - Milan. There is a social media tab to change the image there but above that it says it will use that image “only if it can’t find an image” unfortunately it’s using a partial of the logo type I placed on the password page. I am still launching soon but I am planning on marketing right now to gather emails. One of the first forms I am using is word of mouth from people I know.

When I add the link “www.sadurica.com” on the Facebook post or anywhere else, it’s that small portion I mentioned. How can I change that image through Shopify?

I’ve tried so many different methods and non worked.
0 Likes
Reply
Highlighted
‎01-03-2020 05:31 AM
RichardNguyen
Shopify Partner
172 21 35

This is an accepted solution.

Hi there

You can change your page's preview image when sharing it on social platform by set the thumbnail for your page in theme setting by following this guide:
https://help.shopify.com/en/manual/using-themes/change-the-layout/theme-settings/showing-social-medi...

Or if you have knowledge about coding you can directly edit your theme code by following these below steps:

  • Navigate to your theme's liquid (Online store > Themes > Actions > Edit Code) 
  • Select the theme.liquid, and search for the <head> tag. On the line below that tag, paste this code: 
    <meta property="og:image" content="www.yourimagelink.com" />
     
  • Save the theme.liquid, and open up a new tab with Facebook's debugger. Enter the home page URL to scrape the page, and wait a few moments for the new image to populate. You may need to scrape the page once more. 
- [Tutorial] How to customize Shopify product page: academy.pagefly.io/customize-shopify-product-pages
- Are you having problems customizing your Shopify pages? Check out PageFly - Advanced Shopify Page Builder
1 Like
Reply
Highlighted
‎01-03-2020 09:22 AM
Nick
Community Moderator
Community Moderator
3078 232 504

Hi @RyaneBin,

 

Nick here from Shopify. 

 

@RichardNguyen hit the nail on the head for you here. If you follow these steps in the guide Richard shared here you can change the image for your social media footnote: 

 

  1. From your Shopify admin, go to Online Store > Themes.

  1. Find the theme that you want to edit and click Customize.

  2. Click the Theme settings tab.

  3. Click Social media.

  4. In the Social sharing image area, select the image that you want to show on social media.

  5. Click Save.

All the best, Nick

Nick | Community Moderator @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
Reply
Highlighted
‎01-03-2020 03:00 PM
RyaneBin
New Member
7 0 0

Thank you for the help, but tried both of those methods both individually and together, still didn't work. I am still in password mode, not sure if that makes a difference or not. I attached screenshots, maybe i'm still doing something wrong.

 

Screen Shot 2020-01-03 at 11.50.27 AM.pngScreen Shot 2020-01-03 at 11.51.20 AM.pngScreen Shot 2020-01-03 at 11.58.25 AM.png

0 Likes
Reply
Highlighted
‎01-06-2020 10:50 AM
Nick
Community Moderator
Community Moderator
3078 232 504

Hi @RyaneBin,

 

Sometimes it can take some time for this to come through and take effect. Something you can use to check in the meantime is the Facebook Crawler which you can see here. 

 

There is a mention of the Facebook crawler in the guide shared above with some information about this which you can see in the screenshot highlighted below:

 

06-58-o3pqc-hlqvv

 

I tested this on my test store with the password control on and off and the image showed up after some time for both settings, so I don't believe the password aspect would affect this directly.

 

Nick | Community Moderator @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
Reply
Highlighted
‎01-06-2020 01:04 PM
RyaneBin
New Member
7 0 0
No I figured it out. It’s because I am still in password mode. When disable password, it works perfectly. When I put it back on than it’s back to what I don’t want.

I wish there was a way to change the image in password mode
0 Likes
Reply
Highlighted
‎05-16-2020 06:11 AM
jscan
New Member
1 0 0

Not working on my end. I already did that.

 

0 Likes
Reply
Highlighted
‎05-22-2020 08:43 PM
kellylazzara
New Member
1 0 1

 

I'm using Debut theme. Changing the Social Sharing Image through Shopify's GUI wouldn't actually change it. So I manually changed the og:image src in theme.liquid using the following code:

  <meta property="og:image" content="https://cdn.shopify.com/s/files/1/0045/6533/6167/files/wai_social_sharing.png?v=1590193923" />

That still didn't work at first. The issue is that social-meta-tags.liquid is also defining og:image. See here:

 

{% if settings.share_image %}
  {%- capture og_image_tags -%}<meta property="og:image" content="http:{{ settings.share_image | img_url: '1200x1200' }}">{%- endcapture -%}
  {%- capture og_image_secure_url_tags -%}<meta property="og:image:secure_url" content="https:{{ settings.share_image | img_url: '1200x1200' }}">{%- endcapture -%}
{% endif %}

So I just deleted the following from the above:

  {%- capture og_image_tags -%}<meta property="og:image" content="http:{{ settings.share_image | img_url: '1200x1200' }}">{%- endcapture -%}


I believe that Shopify's share_image variable can be buggy, i.e. it doesn't update or something when someone changes it through the GUI. So, modify theme.liquid that's referencing it, remove the reference in social-meta-tags.liquid, upload your own social sharing image in 1200x630, and reference it in theme.liquid.

btw, the way I found the other og:image definition was by searching 'og:img' throughout all my shopify theme files using this chrome ext https://chrome.google.com/webstore/detail/shopify-theme-search-by-b/epbnmkionkpliaiogpemfkclmcnbdfle...

 

1 Like
Reply
Highlighted
‎06-05-2020 08:34 AM
DariusWS
Excursionist
14 0 3

Same problem for me. Could easily make a workaround but waiting till Shopify stuff fix by themself

    <meta property="og:image" content="http:{{ 'WoCo-logo-1200x628.png'| asset_img_url: "1200x628" }}">
    <meta property="og:image:secure_url" content="https:{{ 'WoCo-logo-1200x628.png'| asset_img_url: "1200x628" }}">
0 Likes
Reply
Highlighted
‎06-12-2020 10:38 AM
posturepro
Tourist
19 0 2

Hello, I want to remove the image, and it seems I can only change it....How do i remove the image?

0 Likes
Reply
Quick links
Facebook Twitter Youtube Instagram Linkedin Pinterest
Terms of Service Privacy Policy