Sometimes, when you have a light-colored logo because your storefront/site has a dark-colored background, this can make your shared image difficult to see.

The good news is that you can fix this with a couple of simple steps!

The below code will set the same image for your entire site. If you only want to change the image for the Home Page, you must change this via the Code Editor in the _seo.liquid file, which does require liquid knowledge. If you are not familiar with HTML and Liquid, please refer to Hiring a Developer for Advanced Custom Changes

Step 1: Choose or create a darker-colored background/logo image.

Step 2: Upload your new logo image to your assets.

Step 3: Copy the new URL of the image you just uploaded and paste it somewhere where you will have easy access to it for a future step.

Step 4: Navigate to Website > Under Themes, click on the 3 dots > Checkout Snippet.

Step 5: Add the following code to your Head Code Snippets section:

<meta property="og:image" content="URL">

<meta name="twitter:image" content="URL">

Step 6: Replace the two URL's in Step 4 with the URL of your newly uploaded logo image.

Step 7: Click Save Changes.

Step 8 (optional): If you are using a Facebook Developer account, you can debug the image (https://developers.facebook.com/tools/debug), by using Facebook Debugger and clicking on Scrape or Scrape Again, depending on whether you just scraped your site's URL. This should help Facebook retrieve the updated image quicker.