Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Addthis: Changing Description, Title, and Url being sent

I am building a forum in PHP and I want users to be able to share the title and description of each post to facebook, twitter, ...etc using the Addthis social plugin. Here is the code Addthis has given me:

    <!-- AddThis Button BEGIN -->
    <div class="addthis_toolbox addthis_default_style "
        addthis:url="www.example.com"
        addthis:title="Example Title"
        addthis:description="Example Description">
    <a class="addthis_button_preferred_1"></a>
    <a class="addthis_button_preferred_2"></a>
    <a class="addthis_button_preferred_3"></a>
    <a class="addthis_button_preferred_4"></a>
    <a class="addthis_button_compact"></a>
    <a class="addthis_counter addthis_bubble_style"></a>
    </div>
    <script type="text/javascript" src="http://s6.addthis.com/js/154/addthis_widget.js#pubid=rd-39e8r89e9er8er989"></script>
    <!-- AddThis Button END -->

I was able to change the url to another I have specified, but changing the title and description has no effect. In fact, they do not even show up when I click the share button and post it to my facebook wall. What is the proper way to get this to work?

like image 722
recount88 Avatar asked Aug 19 '11 21:08

recount88


3 Answers

AddThis doesn't officially support all these parameters as far as I can tell (I can't find them all in once place in their documentation), so ideally you should just use OpenGraph tags on the page you are on. But in any case...

You need to specify it on the custom buttons themselves, not on the toolbox. You can even specify the image. If your buttons have to come from AddThis instead of specifying them yourself, I'm not sure.

<div class="addthis_sharing_toolbox">
    <a class="addthis_button_facebook"
        addthis:url="http://google.com/"
        addthis:title="Here's a title"   
        addthis:media="http://images.google.com/example.png" 
        addthis:description="Here's a cool description">
        <i class="ico ico-facebook"></i>
    </a>

    <a class="addthis_button_twitter"
        addthis:url="http://google.com/"
        addthis:title="Here's a title"   
        addthis:media="http://images.google.com/example.png" 
        addthis:description="Here's a cool description">
        <i class="ico ico-twitter"></i>
    </a>

    <a class="addthis_button_linkedin"
        addthis:url="http://google.com/"
        addthis:title="Here's a title"   
        addthis:media="http://images.google.com/example.png" 
        addthis:description="Here's a cool description">
        <i class="ico ico-facebook"></i>
    </a>
</div>

AddThis's documentation sucks so I just happened to run into the right things and figure this out. Enjoy!

like image 81
timothyashaw Avatar answered Oct 31 '22 06:10

timothyashaw


AddThis specific recommend that you use meta tags from the Open Graph Protocol to specify what to show

We strongly recommend the page-tagging approach over passing your widget parameters to our APIs

So in your case you should have the code lie it's original:

<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style">
<a class="addthis_button_preferred_1"></a>
<a class="addthis_button_preferred_2"></a>
<a class="addthis_button_preferred_3"></a>
<a class="addthis_button_preferred_4"></a>
<a class="addthis_button_compact"></a>
<a class="addthis_counter addthis_bubble_style"></a>
</div>
<script type="text/javascript" src="http://s6.addthis.com/js/154/addthis_widget.js#pubid=rd-39e8r89e9er8er989"></script>
<!-- AddThis Button END -->

and change your header to include the addThis meta tags, in your example, like:

<meta property="og:url" content="http://www.example.com" />
<meta property="og:title" content="Example Title" />
<meta property="og:description" content="Example Title Description" />
<meta property="og:image" content="http://www.example.com/logo.gif" />

This avoids any problem you can encounter in the Client API.

like image 2
balexandre Avatar answered Oct 31 '22 07:10

balexandre


I went around and around before finding this on the AddThis website:

Setting the URL & Title to Share

...for our newest tools, use the data-url and data-title parameters...

I am using their latest code (addthis_sharing_toolbox instead of addthis_toolbox) and all I could find were people using addthis:url="" which was not working.

like image 2
zacharydl Avatar answered Oct 31 '22 08:10

zacharydl