Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2010-12-12 22:35:26

Solidus
New Member
Registered: 2010-12-12
Posts: 6

Facebook Like Button and Twitter Button Plugins

Hey i was wondering If there were plugins that would allow people to like my blog posts via facebook or to retweet my articles? Also is there a reddit button addon?

Thanks,
Solidus

Offline

#2 2010-12-13 00:01:40

maruchan
Member
From: Ukiah, California
Registered: 2010-06-12
Posts: 595
Website

Re: Facebook Like Button and Twitter Button Plugins

Not sure about Reddit, but the Twitter and FB buttons seem pretty trivial to add to a TXP article form via the code that those companies provide (twitter here).

Last edited by maruchan (2010-12-13 00:03:02)

Offline

#3 2010-12-13 00:26:32

Solidus
New Member
Registered: 2010-12-12
Posts: 6

Re: Facebook Like Button and Twitter Button Plugins

If i added that retweet button, it retweets the entire web page, not the individual article. I had the same problem too when adding the facebook option. Do you add them to the “default” part of forms? Where do you tend to install them?

Offline

#4 2010-12-13 02:39:39

maruchan
Member
From: Ukiah, California
Registered: 2010-06-12
Posts: 595
Website

Re: Facebook Like Button and Twitter Button Plugins

Well, it works OK here. Here’s an example article with the Tweet button, and my result at twitter, and here’s the relevant portion of the form code I’m using:

Form excerpt: “article-listing”

<p class="pathway">A <a href="http://www.marccarson.com/site/articles/">Web Design Article</a></p>
        <h1 class="entry-title donthyphenate"><txp:title /></h1>
<div class="article-body-image"><txp:article_image /></div>
<h5 class="article-author">By <txp:author /></h5>
        <txp:body />
<a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-via="circular">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

Important: Please change the “data-via” attribute inside the Twitter code to your Twitter username! Otherwise I (@circular) get all the credit. :-)

That works here. In fact it was kind of fun! :-)

Facebook “Like” button

OK, here’s the extra code for Facebook’s Like button (thanks to JanDW) . Just put this below the Twitter </script> tag above, or somewhere in the same form:

<iframe src="http://www.facebook.com/plugins/like.php?href=<txp:permlink />&amp;layout=standard&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:px"></iframe>

You can see the result in the same place.

Notice the <txp:permlink /> tag in there? That is necessary so it knows what URL to “like.” This is yet another reason why Textpattern is spectacular. :-)

If you use the Facebook feature, please read their page about it, specifically the “Open Graph Tags” section. Those should really improve the experience for your visitors, if they use the Like button a lot.

Last edited by maruchan (2010-12-13 03:50:00)

Offline

#5 2010-12-13 02:51:18

Solidus
New Member
Registered: 2010-12-12
Posts: 6

Re: Facebook Like Button and Twitter Button Plugins

Thanks for your help. I’ll give it a try tomorrow!

Offline

#6 2010-12-13 02:56:15

maruchan
Member
From: Ukiah, California
Registered: 2010-06-12
Posts: 595
Website

Re: Facebook Like Button and Twitter Button Plugins

Sure thing. I also tested a Reddit button using code from their buttons page in the same way, and it worked fine. I doubt anybody would share one of my articles on Reddit though, so I’ve removed it from my own site. :-)

Last edited by maruchan (2010-12-13 02:56:34)

Offline

#7 2010-12-13 03:08:24

Solidus
New Member
Registered: 2010-12-12
Posts: 6

Re: Facebook Like Button and Twitter Button Plugins

The facebook one seems to work just great. However when I do the retweet button, it still retweets the entire site instead of the select article. Any idea how to fix that?

Offline

#8 2010-12-13 03:21:27

Solidus
New Member
Registered: 2010-12-12
Posts: 6

Re: Facebook Like Button and Twitter Button Plugins

http://twitter.com/#!/resident_evilx

You can see an example of it going awry here.

EDIT: I used a separate code and got the <txp:permlink /> put in the place of the override URL. Seems to work so far. It looks kind of clunky though any ideas?

This is the relevant script

<script type=“text/javascript”>
tweetmeme_url = ‘<txp:permlink />’;
</script>
<script type=“text/javascript” src=“http://tweetmeme.com/i/scripts/button.js”></script>

</div>

Last edited by Solidus (2010-12-13 03:34:26)

Offline

#9 2010-12-13 03:44:52

maruchan
Member
From: Ukiah, California
Registered: 2010-06-12
Posts: 595
Website

Re: Facebook Like Button and Twitter Button Plugins

What’s clunky about it? The code you’re using, or the result on the website?

Note: I noticed “via @circular” appearing in that Tweet. Oops! That’s me! This should be set to your own Twitter username. I’ve added a note to the post above.

Last edited by maruchan (2010-12-13 03:58:52)

Offline

#10 2010-12-13 04:53:59

Solidus
New Member
Registered: 2010-12-12
Posts: 6

Re: Facebook Like Button and Twitter Button Plugins

Not to worry I fixed it. I got everything up and running just tweaking with a few ideas you gave me. Thanks a lot man!

Offline

#11 2010-12-13 05:28:12

maruchan
Member
From: Ukiah, California
Registered: 2010-06-12
Posts: 595
Website

Re: Facebook Like Button and Twitter Button Plugins

Sure! Glad it worked for you. Jonathan invited me to submit it as a TXP Tip, too.

Offline

#12 2010-12-13 07:14:35

jstubbs
Member
From: Hong Kong
Registered: 2004-12-13
Posts: 2,395
Website

Re: Facebook Like Button and Twitter Button Plugins

Just a note to say that this excellent code from Marc Carson has been published on TXP Tips.

Edit: Sorry – did not see that Marc has already posted about TXP Tips..

Last edited by jstubbs (2010-12-13 07:15:24)

Offline

Board footer

Powered by FluxBB