When sharing your website's URL to a group chat or a post on social media, a preview of the site may appear. By default, Snappages will pull a random image from your home page/header. With a simple code snippet and uploading an image to the storage section of Snappages, you are able to add a custom image to your site.
1. Upload your image in the Storage section of Snappages.
On the Snappages dashboard, locate the Storage section and locate images. Here, you'll be able to upload an image to your Snappages site. This is a very important step because once you upload an image, snappages will generate a URL for the image which we will use later in this tutorial.
Check out our SnapPages Onboarding Roadmap if you are just getting started with Snapapges!
2. Add code to the page you want the preview image to appear.
On the page you wish to add a preview image to, select "OPTIONS" and go to "CODE". You can do this while in the page editor or in your pages menu.
Add the following code snippet to the header portion of the page.
<meta property="og:image" content=""
Leave the content=" field blank, we will come back to this later.
Then hit Save Settings on the upper right-hand corner.
3. Copy image URL from Storage Section of Snappages.
Find the image located in your storage section, select the image and on the right-hand panel you should see a space for the image URL, copy the URL from the image uploaded.
4. Copy image URL to code snippet of the page.
Jump back to the CODE section of the page, paste the image URL after the open quotation mark and add the closing quotation mark. Once that is done save your settings!
Your final code snippet should look something like this:
Tip: if you ever need to update the image, just change the image URL.