AddThis Pinterest widget is offereing images I don

Question

When I click the AddThis Pinterest button, the box opens mid-screen, offereing a variety of images from my page. Cool. However, among those offered are grainy, enlarged portions of nav buttons, banner ads, and other images that are relevant. On the same, page the Favorites Bar PinIt button (from Pinterest itself) does it "correctly", meaning it only offeres meaningful images; no nav buttons included.

How can I exclude selected images from the AddThis Pinterest widget box?

Thanks in advance to anyone who can help.

Answer 1

The actual way to force an image is the "media" option, not the "url" option:

<a... pi:pinit:media='http://path/to/my/image.jpg'>...</a>

Answer 2

AddThis Pinterest has support for "at_include" and "at_exclude" classes for images.

Full post here: http://support.addthis.com/customer/portal/articles/1300322-pinterest-image-sharing#.UuAnmrvTm2x

Include Images

You can instruct the share preview to only grab specific images from the page by using the “image_include” configuration option. First, set image_include to your desired class name (id selectors are not allowed, only class selectors), then add that same class name to each of the images on the page that should be grabbed. For image_include, don’t add the ‘.’ selector. Here’s an example:

<script type="text/javascript">
var addthis_config = {
image_include: "at_include"
}

Once image_include has been defined with a class, add that class to the desired images on the page. In this example, the only images on the page that will be grabbed, will be the images with the at_include class (img1.jpg and img3.jpg).

<img src="http://www.example.com/img1.jpg" class="at_include" />
<img src="http://www.example.com/img2.jpg" />
<img src="http://www.example.com/img3.jpg" class="at_include" />

Exclude Images

You can instruct the share preview to ignore specific images from the page by using the image_exclude configuration option. First, set image_exclude to your desired class name (id selectors are not allowed, only class selectors), then add that same class name to each of the images on the page that should be ignored. For image_exclude, don’t add the ‘.’ selector. Here’s an example:

<script type="text/javascript">
var addthis_config = {
image_exclude: "at_exclude"
}

Once image_exclude has been defined with a class, add that class to the desired images on the page. In this example, the only image on the page that will be grabbed, will be the image that doesn't have the at_exclude class (img2.jpg).

<img src="http://www.example.com/img1.jpg" class="at_exclude" />
<img src="http://www.example.com/img2.jpg" />
<img src="http://www.example.com/img3.jpg" class="at_exclude" />

Image Container

You can also instruct the share preview to grab images from a specific container, such as all the images contained within the class or id that has a Pinterest share button. This can be really helpful if there are multiple Pinterest share buttons on the page. Remember, the Pinterest share button must be within the same container that the images are located in. Also, notice that image_container needs to have the ‘.’ or ‘#’ selector. Here's an example:

<script type="text/javascript">
var addthis_config = {
image_container: ".shared_content"
}

Once image_container has been defined with a class, add that class to the desired on the page. In this example, the only images on the page that will be grabbed, will be the images contained within the shared_content .

<div class="shared_content">
Here's some example text. Images in this div will be grabbed.
<img src="http://www.example.com/img1.jpg" />
<img src="http://www.example.com/img2.jpg" />
<a class="addthis_button_pinterest_share"></a>
</div>

<div class="another_div">
Here's some more example text. Images in this div will not be grabbed.
<img src="http://www.example.com/img3.jpg" />
<img src="http://www.example.com/img4.jpg" />
</div>

Answer 3

If you want to specify a single image for Pinterest to use, you must specify the path to that image as the value of the pi:pinit:url property.

<a... pi:pinit:url='http://path/to/my/image.jpg'>...</a>