Adding social bookmarks to sNews CMS

Adding social bookmarks to sNews CMS

updated january 30th, 2009, please read this entry for update instructions and the updated zip file.

Here's a quick hack for your sNews CMS, no doubt you've seen all the various social bookmarking icons below so many blog posts, tutorials, & articles these days, with this simple hack you can do the same to your sNews CMS articles.

This method isn't extremely complicated, and it doesn't have an admin interface, but if you're using sNews for your CMS, you probably don't mind getting your hands a little dirty. We will put most of the logic into a separate file to minimize any hacking (and potential screwing up) of the snews.php file...

So let's get started, the first thing we want to do is create the new php file to store all your social bookmark logic. I named mine social.php. OK, now we want to create our variables, with most all social bookmarks, you have two key variables, the article title, and the article url. There are others (such as description and tags, I use them with ma.gnolia), but those require modifying the mysql queries, I don't want to get into that with this tutorial. So, we will set up these two variables like so:

<?php
//social.php - contains the logic for the social bookmarking mod for sNews CMS

//grabs the url to the article
$social_url = urlencode(_SITE.$uri."/".$r['asef']);

//grabs the title of the article
$social_title = urlencode($title);

Now let's set some styles:

//put your div container style here
$container_style = "clear: both; padding: 2px; text-align: left;";

//put your image styles here
$img_style = "vertical-align: middle; padding: 0; margin: 2px;";

Lastly we need to insert the links, I have added 3 of the most popular here. If you want to add more, simply add another link and change the image & bookmarking url. Make sure you change the image path if you don't use "/images/social/" folder. Here are the images used in this tutorial:
SU reddit digg
Save these images into the folder /images/social

// add your links here
echo <<<HTML

<div style="$container_style">
<a rel="nofollow" title="stumbleupon" href="http://www.stumbleupon.com/submit?url=$social_url&amp;title=$social_title"><img src="/images/social/stumbleupon.png" alt="stumbleupon" style="$img_style" /></a>
<a rel="nofollow" title="reddit" href="http://reddit.com/submit?url=$social_url&amp;title=$social_title"><img src="/images/social/reddit.png" alt="reddit" style="$img_style" /></a>
<a rel="nofollow" title="digg" href="http://digg.com/submit?phase=2&amp;url=$social_url&mp;title=$social_title"><img src="/images/social/digg.png" alt="digg" style="$img_style" /></a>
</div>

HTML;
?>

That's it for that file, so save that as social.php and upload it to your server public html root. Now backup snews.php and open it up and find the function articles(). I used the "infoline" setting to decide whether or not I wanted to show the social bookmarks, so you may want to change that, but I found this works well, as I only use the "infoline" on my articles. So you'll want to find the two instances of the following line;

if ($infoline == true) {

and add the following code below it;

include('social.php');

Now upload snews.php and you should see your bookmark links under each article that use the infoline. This zip file contains the example social.php, the images, and the INSTALL.txt for your snews.php file. Enjoy!

updated january 30th, 2009, please read this entry for update instructions and the updated zip file.

Tags

 

You might like

Comments


Nice mod there man. I'll try it tomorrow and return with results.

thanks


Cool, sounds good, please don't hesitate to ask any questions if needed, or let me know if I goofed anything too.


Matt, this is the _output_ I get in local testing:
//grabs the url to the article $social_url = urlencode(_SITE.$uri."/".$r['asef']); //grabs the title of the article $social_title = urlencode($title); // add your links here echo <<stumbleupon reddit digg HTML;

(I removed the image references while testing)
Naturally I'm using a really modified setup, but seeing as the code gets printed well enough, I'd guess this would be a strip_tags issue? I'll try work around it, just thought I'd mention it.

Happy holidays!


Hi Fred,

That's odd, so it's simply printing the code out as text? Let me know what you figure out.If you get stuck, use the contact form to drop me an email and I'll email you back.

Happy holidays to you as well!
--Matt


Matt, the solution is really simple -- I should've seen it from the start and then it wouldn't have been a problem. I had no opening/closing php tags in the social.php file...

You could add a note in the tut that **if** people use the social bookmark function from an external file, make sure that it begins with ... Then even dimwits like me will get it right. The mod and tut are great.

Cheers!


Thanks Fred, that makes sense, I will add the opening and closing php tags in the tutorial now.

I'm glad you liked the mod.


How I can add another social bookmark/share this, like twitter and facebook?
Where I can find the social bookmark's images?
Thank you. :)


Hi Adhi,

Each social network has it's sharing link, as seen above, at the least you need to pass the url of the article, (and most accept the title as well). Those are contained in the $social_url and $social_title variables in my mod.

For example, facebook's sharing link uses sharer.php and passes the variables as u(the url) and t(the title), aka you'd add this to the boomarks div;

<a rel="nofollow" title="facebook" href="http://www.facebook.com/sharer.php?u=$social_url&t=$social_title"><img src="/images/social/facebook.png" alt="facebook" style="$img_style" /></a>

And then for twitter;

<a rel="nofollow" title="twitter" href="http://twitter.com/home?status=$social_title"><img src="/images/social/twitter.png" alt="twitter" style="$img_style" /></a>

As for the icons, each service usually has a default icon, i.e.

<a href="http://www.facebook.com/share_partners.php">http://www.facebook.com/share_partners.php</a>

or

<a href="http://twitter.com/favicon.ico">http://twitter.com/favicon.ico</a>

download them and convert them to .png or whatever, but you can find all kinds of great free sets just by googling.


hi matt you know you deploy your social bookmarks mod but it happens that gives me a very big space after the article to show social bookmarks could help me?
my page is www.kudaiarg.com
thanks
Excuse my English


Hi Armando,

I just had a look at http://www.kudaiarg.com, and it looks OK to me. I don't see the large space in Firefox, using FireBug I only see 2px padding around the containing div?

Can you take a screenshot and post the link?


Armando,

It appears that you have a div after the sidebarright, it's class="claer".. I'm guessing that should be class="clear"? maybe that would help?

Actually, if it's breaking the layout, you probably don't want that div there at all...


Done... Thinking of adding more to it though... perhaps.


Yeah, I ended up just dropping it and sticking the "AddThis" button, it's nice and compact and has access to the myriad services people use.

Comments are closed. No new comments allowed.

Copyleft 2002 - 2017 Matt Jones
Hand crafted with HTML5 & CSS3
↑ Back to top