Changing Your Default Website Link Thumbnail (For Facebook)
Sometimes when a link to your website gets shared on Facebook, your brand is not accurately being represented by default. Often the Link Thumbnail that is going out by default is a weird listing photo, or some other image from your website that doesn't actually represent your website in full. In this article, we're going to walk you through all the steps towards changing the default LINK THUMBNAIL that appears whenever you or someone else shares a link from your website to Facebook.
If you're not familiar with what I'm talking about, look for the Link Thumbnail in the screenshot below (This is a good one... you want yours to look similar to this once we're done!).
NOTE: I will refer to the above screenshot as "Main Screenshot" later in this article.
Step 1: Log in to your RealtyNinja website (www.yoursite.com/login)
Step 2: Once logged in, from the top right of the screen, click "SETTINGS"
Step 3: From the options on the right, click "Custom Code"
Step 4: This step is going to require you to open a notepad or some other type of simple text editor on your computer or laptop (wherever you are reading this). You're going to copy the following line of code and paste it into your notepad/text editor:
<meta property="og:image" content="Custom Image URL Here"/>
Step 5: Now that you've pasted this line of code into your notepad, you're going to make some modifications to it before pasting it into your RealtyNinja website. Don't worry, the modification is very simple. We're going to modify the information that comes BETWEEN the quotation marks after content=.
Highlight the words Custom Image URL Here and replace that phrase with the URL of the image that you want as your default Link Thumbnail Image when a link to your site is shared (See Main Screenshot). This is a direct link to the image, not to a web page with an image on it. You need to upload the image to your website and then fetch the direct URL for that image (in most browsers you can right click on an image on a page, then select 'Open Image in a New Tab' to get the URL). Click here to see an example of a link directly to an image.
Ninja Tip [-_-]~~ The ideal size for Facebook link thumbnails is 470 X 246 pixels.
Step 6: Once you've added the image URL to your line of code, highlight the whole line again and copy (Hold CTRL + Click C or Hold CMD + Click C on Mac).
Step 7: Now that you've copied your line of code, move back over to your RealtyNinja website dashboard, where you left off at the Custom Code section in Step 3. Scroll down to the box titled "Custom Header Code" and paste your line into it (Hold CTRL + Click V or Hold CMD + Click V on Mac). It should end up looking something like the screenshot below.
Step 8: Scroll to the bottom of the page and click "Apply Changes"
Step 9: The hard part is over! Now you're going to debug your website in the Facebook Open Graph Developer Site. Go to the following URL: https://developers.facebook.com/tools/debug/
Step 10: Once there, enter your website URL into the Open Graph Object Debugger Input URL Box, and click "Fetch New Scrape Information". See the screenshot below this Step for all additional information about this page.
If you are not happy with the preview, then go back to your RealtyNinja "Custom Code" section and replace the Image URL with a different one. Then Apply your Changes, and come back and repeat step 10 until the changes are being reflected.
NOTE: Every single listing on your RealtyNinja website has it's own default image thumbnail, which is automatically set to the first listing photo. This means that if you're sharing a listing, Facebook will give you the option to either choose the main listing photo as the default link thumbnail, OR the new default thumbnail you just set. Look in the top left corner of your FB post before you share it to see the left and right arrows where you can cycle through that URL's available default thumbnail images. Lots of big words, easier to show you. See the screenshot below.
If you have any questions or would like Ninja assistance with this task, please don't hesitate to e-mail us at support@realtyninja.com and let us know. We're always here to help.