Someone asked me on Youtube: “When I share my Muse website on Facebook, there is no thumbnail, no image to describe my page. How can I fix that?”. Indeed, sharing on Facebook is not that obvious and automatic. Although the Facebook bot is doing its best to make it work, some rules exist to optimize and master your Facebook sharing experience. I’ve recorded a video tutorial on Youtube, if you prefer to follow a written tutorial, read this article.
When someone will share your page on Facebook, he will discover a thumbnail, a title and a description.
For each page of your Muse website, you can define these properties adding OpenGraph metadata tags.
In Adobe Muse, open a page, and go to the “Page” menu to open the Page Properties panel.
Open the “Metadata” tab, and add OpenGraph tags in the “HTML for <head>:” textfield such as:
<meta property="og:title" content="Creative Minds in Paris" />
<meta property="og:image" content="http://museyoutube.businesscatalyst.com/assets/scooterParis.jpg" />
<meta property="og:description" content="A paragraph to describe the content of your page" />
You can read more information about these tags here: https://developers.facebook.com/docs/sharing/best-practices
To upload your own image on your website, maybe an image that you won’t use in your page, you can use the “File > Add Files for Upload…”. Once your website published, the file that you chose to upload will be in the /assets subfolder.
How to debug Facebook sharing
Be very careful, the first time you’ll share a page on Facebook, the Facebook bot will keep a lot of data in the Facebook cache. So, when you’ll update your pages with OpenGraph metadata and share it on Facebook again, you won’t see any change.
You need to force Facebook to refresh its bot and fetch for new metadata on your page. To do so, you can use the Facebook OpenGraph debugger tool. Paste the URL of your page, and click on “Fetch new scrape information”: https://developers.facebook.com/tools/debug/og/object/