Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2010-07-30 08:11:29

philwareham
Core designer
From: Haslemere, Surrey, UK
Registered: 2009-06-11
Posts: 3,564
Website GitHub Mastodon

[howto] Adding AddThis to articles (and article lists)

Hi, I’ve just been asked by a client to put the popular AddThis social media links on their site, and thought it might be of benefit to other TXP users to show how I integrated it. It does need the etz_striptags plugin as well…

First, go to the AddThis site and register an account (you don’t actually need an account in principle but to use any of the analytical data it’s required, which I think is pretty essential).

Second, you need to include their basic javascript library onto your page template or wherever you load in the javascript files for your site. It does need to go before any button code, so might be wise to put in the in head of the page. Change ‘your-addthis-username’ to the one you registered above.

<script type="text/javascript">var addthis_config = {username:"your-addthis-username",data_track_clickback:true}</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>

Then, in your article form, add the following code…

<p><a id="addthis-<txp:article_id />"><img src="http://s7.addthis.com/static/btn/sm-share-en.gif" width="83" height="16" alt="Bookmark and Share" /></a><script type="text/javascript">addthis.button('#addthis-<txp:article_id />',{services_exclude:"print"},{url:"<txp:permlink />",title:"<txp:title no_widow='0' />",description:"<txp:etz_striptags><txp:excerpt /></txp:etz_striptags>"});</script></p>

That’s it, it can be utilised in forms that are used for article lists too so each article in the list can have it’s own AddThis button (hence why an id attribute is used). In the example above I’ve excluded the ‘print’ link from the links panel just to show where you would put any custom options, as listed in their API documentation.

There are lots of customisation options on their site if you don’t like the button, or want a different look for the link panels etc.

In case you’re wondering, the etz_striptags plugin is used to strip any textile formatting out of page excerpts, which are being used for the addthis description attribute. That attribute is not essential (though it’s a good idea to use it) so if you use another method for creating meta page descriptions or simply don’t want to use that option you can amend or remove it, and won’t need the plugin either.

Cheers,
Phil

Last edited by philwareham (2010-07-30 08:15:19)

Offline

#2 2010-07-30 08:24:55

mapu
Member
From: Munich, Germany
Registered: 2004-03-16
Posts: 141

Re: [howto] Adding AddThis to articles (and article lists)

There’s also an app a plugin for that: lam_addthis!

Offline

#3 2010-07-30 09:33:26

philwareham
Core designer
From: Haslemere, Surrey, UK
Registered: 2009-06-11
Posts: 3,564
Website GitHub Mastodon

Re: [howto] Adding AddThis to articles (and article lists)

Cheers, I am aware of that plugin but it’s good to have the option of a txp tag only, non-plugin version – even if it uses another optional plugin (etz_striptags, which I install as a matter of routine for all textpattern sites).

Offline

#4 2010-07-30 10:10:58

merz1
Member
From: Hamburg
Registered: 2006-05-04
Posts: 994
Website

Re: [howto] Adding AddThis to articles (and article lists)

It does need the etz_striptags plugin as well…

I wasn’t aware of that old plug-in :)
But in case you need more shortening features the plug-in rss_auto_excerpt (also ORPHANED) is an awesome choice.


Get all online mentions of Textpattern via OPML subscription: TXP Info Sources: Textpattern RSS feeds as dynamic OPML

Offline

#5 2013-04-09 11:27:37

gour
Member
From: Hlapičina, Croatia
Registered: 2013-01-17
Posts: 124

Re: [howto] Adding AddThis to articles (and article lists)

philwareham wrote:

Hi, I’ve just been asked by a client to put the popular AddThis social media links on their site, and thought it might be of benefit to other TXP users to show how I integrated it.

At the moment I’m busy refreshing my CSS3/HTML5 skills, but still would like to embellish my site with AddThis links, so wonder if the above referenced info is still relevant or do you recommend something else (including AddThis solution) ?

Offline

Board footer

Powered by FluxBB