How do I change the picture and title that appears when sharing my website in Facebook?

This information is controlled by something called Open Graph (OG) tags. Currently Xara doesn't add these tags so we'll need to manually insert them.

Adding OG tags to your website

1. Go to Utilities > Web Properties
2. Click on the Website Tab
3. Click on HTML code head
4. Add the following code:

<meta property="og:url" content="http://www.xara.com" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Your title goes here" />
<meta property="og:description" content="Brief description of your website goes here." />
<meta property="og:image" content="http://www.xara.com/images/exampleimage.jpg" />

Lets quickly break this down.

og:url - The URL of your website.

og:type - The type of website or media. By default this is website, but can be article, book, profile etc. If you are unsure, just use website. More information on og:type can be found here.

og:title - The Title that appears at the top of your post.

og:description - The description that appears under your title. There's a fairly limited space here so keep it short and concise.

og:image - The image to be displayed.

If you are linking to an image, you can set an image name to make it easier to link to.

If you do not set any values, then Facebook or any other social media will pull try to pull the details of your website itself, which may end up with random information.  

Please also note - If you set this within your Web Properties Website tab, it will be included in all pages. If you set it within the Web Properties > Page tab, it will only be applied to that page.

Tip: for a full explanation and look into OG tags, take a look at this article: https://developers.facebook.com/docs/sharing/webmasters/