Develop Reference

Addthis: Display total shares

I would like to get the AddThis widget to display the total number of shares of an URL on Facebook, Twitter and Google+. Here comes my code:
<script src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
<div addthis:url="http://de.wikipedia.org/wiki/JavaScript" addthis:title="Wikipedia JavaScript page">
<a class="addthis_button_facebook"></a>
<a class="addthis_button_twitter"></a>
<a class="addthis_button_google_plusone"></a>
<a class="addthis_button_email"></a>
</div>
JSFIDDLE: http://jsfiddle.net/ez8ya0ov/
How do I achieve that the total count of shares on facebook, twitter and google+ get displayed in a bubble on the right side? I do NOT want the individual numbers of each social media service get displayed (in this example I want to get rid of the bubble with "7" next to the google+ icon). Anyone has an idea how to achieve that?

Tweet button shows incorrect of tweets

On a page I have a Tweet button, like this:
Tweet
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
The problem is that in the bubble with counts of tweets is the value 2197, which is incorrect.
How to put there the correct value?
Thanks

The problem is that you're specifying:
<a ... data-url="false" .../>
Twitter reads this value as the URL you're wanting to share, and is ultimately under the impression that the URL "false" has been shared 2,197 times. If you want to share a static URL, this attribute must relate to the URL of the page you're wanting users to Tweet about. If your page was http://example.com, for instance, you'd use:
<a ... data-url="http://example.com" .../>
(Which has been shared 1,492 times).
If you want to share the URL of the page the button is added to, you'd simply remove the data-url parameter altogether:
<a href="https://twitter.com/share"
class="twitter-share-button"
data-lang="en"
data-count="horizontal"
data-text="#{tw_listing(#data)}">Tweet</a>
If you need help with creating your Tweet button, you should refer to the official creation page at twitter.com/about/resources/buttons.

How do I let a user tweet an image?

We have a twitter button set up where users click on it and a popup opens up to let the user tweet from their own account. How can we include an image with that tweet? (With facebook we've been able to do it).
<div>
<a href="http://twitter.com/share" class="twitter-share-button"
data-url="http://www.mysite.com"
data-text="sharing this with you...."
data-count="none">Tweet</a>
</div>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<script type="text/javascript">
twttr.events.bind('tweet', function(event) {
window.location = "http://www.mysite.com"
});
</script>

To do this, you'll need to use the API directly (not just their widget). Details on how to post with a media item can be found at the status/update_with_media docs.
If you're looking for a kind of rendering a 'preview' of a link (what Facebook allows through Open Graph), then checkout the Cards documentation.

You can also use the following:
https://dev.twitter.com/rest/media/uploading-media

Check referrer and find the href that leads to it, then trigger a click with javascript

I'm working on a WP single page portfolio that loads post content with AJAX. I read that WP doesn't need #! URLs to make it crawlable by Googlebot. If I understand it correctly, since Googlebot won't interpret ajax, it will just follow the link and index the article page.
So I removed #! from my URLs and when a post is opened I update them with .pushState.It's working fine, but if I hit F5 or if I try to load a specific URL (not the home) I fall into the page of the post (single.php).
To prevent it, I added a javascript redirection in single.php that leads users to the homepage. Then I need to open the content of the article on the homepage.
Here is the address of my site: http://www.youpiemonday.com/ (the redirection isn't online yet).
How can I tell the browser "if you're coming from this page (the referrer), trigger a click on the thumbnail which href is corresponding" (the click will load the content)?
I'm digging around this but I have no idea how to target the thumbnail correctly...
<script type="text/javascript">
$referer = document.referrer; // where we come from
$LinktoRef = $('.ProjectWrap').find("a").href; // the href in the thumbnail
console.debug($LinktoRef); // still undefined...
if ( $LinktoRef == $referer ){
find("a").trigger('click');
}
</script>
Here is what the html markup looks like:
<div id="portfolio-list">
<div class="ProjectWrap">
<?php the_post_thumbnail(); ?>
<a href="<?php the_permalink(); ?>">
<div class="contentProject">
<h4 class="ProjectTitle"><?php the_title(); ?></h4>
</div>
</a>
</div>
<div class="ProjectWrap">//same as above</div>
<div class="ProjectWrap">//same as above</div>
// and the list goes on...
</div>
I'm not really a programmer so any help would be very appreciated. And if you can comment your code, that would be invaluable to me.

Because you are probably trying to reference the element before it is rendered on the page. Use document ready or window onload and reference the link there.

How To, Tweet Button sample code help?

i'm trying to implement a Tweet Button from this page http://dev.twitter.com/pages/tweet_button
and it looks like ti doesn't working very well for me. if my website is www.xxx.com the script should be:
Tweet
the graphics load but the count is 0.
i don't understand what could be wrong.
any ideas?
Thanks

Try this code, using jQuery
<img id="tweetButton" style="cursor:pointer;" title="Share this on Twitter" src="http://a3.twimg.com/a/1294785484/images/goodies/tweetn.png" />
$("#tweetButton").click(function () {
window.open("http://twitter.com/share?url=xxx", "tweet", "status=0,toolbar=0,width=500,height=300");
});

You need to go register for this feature on the twitter developers site. Once you do that it should generate some sort of number or code for you to put on your page that will link everything together and start counting as it should.