sharing content on Facebook via AddThis

Question

On this page I use the AddThis JavaScript library to add buttons that allow the page to be shared on Facebook/Twitter. If you click on the Facebook button it shows the following preview of how the content will be posted to Facebook:

Notice that the image that is displayed in the post preview is the AJAX loader that is used on the site, i.e. an image that is displayed while an AJAX request is in progress. I don't know why this is being chosen as the image to be displayed in the post, is it possible for me to specify which image is used?

Here's the markup that I use to display the sharing buttons:

<div class="addthis_toolbox addthis_default_style addthis_32x32_style" style="width: 135px;">
    <a class="addthis_button_preferred_1"></a>
    <a class="addthis_button_preferred_2"></a>
    <a class="addthis_counter addthis_bubble_style"></a>
</div>

<g:javascript base="http://s7.addthis.com" src="/js/250/addthis_widget.js#pubid=xa-4fcaa48b0ffdb7b9" type="js" />

Answer 1

Between the tags of your HTML you have the following code:

<meta property="og:image" content="http://www.festivals.ie/images/responsive/bg.svg"/>

This tells Facebook what image it should be using in the share popup. 'og' stands for Open Graph, the protocol Facebook uses to fetch information about a page. However the image that is being linked to is a large SVG image (your site's background image) - you need to change this URL to the URL of your logo, and make sure this logo is in .jpg or .png format - a quick Google search suggests that Facebook doesn't really support SVGs being used for og:image.