Contact Us

WebSenor Pvt Ltd Bengaluru

Site No. 26 Laskar, Hosur Rd, Bengaluru, Karnataka 560029
Phone +91-8854834560

WebSenor Pvt Ltd Udaipur

3rd Floor , S.M. Lodha Complex,
Udaipur (Rajasthan)India

Phone: +91-9950834560
Phone+91-9782177208 
Emailinfo@websenor.com

USA – WebSenor LLC

25-03 83rd St, East Elmhurst, NY 11370, United States
Phone: +1-480-561-4112
Emailinfo@websenor.com

UK – WebSenor Ltd

184 Caroline St, Birmingham B3 1UE, UK
Phone+44 20 3286 4560
Emailinfo@websenor.com

WestoWeb Inc

Block 10, Salmiya, Kuwait
Phone+965-97487871
Emailinfo@websenor.com

Skype: WebSenor Infotech

Career

For Career / HR related queries : +91 85297 34560
For Recruitment related queries : +91 83068 92560

WebSenor is a high end tech company headquartered in AZ, USA and its development centers are in Udaipur & Bangalore, India. We provide web development, software development, mobile application development & digital marketing services to the global market.
With 10+ years of experience, 3000+ projects of portfolio and 110+ professionals, WebSenor is one of the leading name in IT market.

Connect with us

Social media buttons the easy way

Social media buttons the easy way

It’s great to have access to such a great repository of WordPress plugins, but sometimes a great plugin is just “too much” for a smaller task of function. Like social media buttons, they have in fact a very simple function and most buttons require only a few rows of code.

If a complex plugin doesn’t provide the specific function I need, it becomes time to think about a custom solution. During the last year I used several plugins or functions to show social media buttons on this blog site. At last I used the DiggDigg plugin, a plugin that offers a great floating bar like they use on Mashable. It’s really a great plugin, but you can’t customize the plugin’s behavior so much.

The important features I need

The most important feature is flexibility! I don’t like to show a DZONE button for my marketing related articles. Or what about a single article which becomes popular on some social network? I dont’t like to show that button on every page and I don’t like to place some button code somewhere else on that page. Do you remember the time that there was no Tweet button from Twitter? I used ~5 years ago the TweetMeMe button instead and I replaced those buttons with the “original” Tweet button 2-3 years ago. Since this change my older articles are looking less popular because the Tweet counter from Twitter shows only the new interactions. I didn’t found a plugin that is flexible like this, did you?

The “WordPress” solution

I use on my corporate website at finalwebsites.nl custom taxonomies to show or hide specific widgets in my sidebar (more on this in my next article). That brought me on the idea to use the same function for the social media buttons on this website.

You can create a custom taxonomy with your own code or you can create one using the Types plugin, which is very powerful and provides other functions to create custom post types and custom fields. Configure this taxonomy for posts and/or pages, it depends on wherever you like to show those social media buttons.

My custom function that shows a set of social media buttons

I like to have twitter and facebook buttons for every post and on specific pages (I don’t have so much of them). That will say I will include them automatically for my posts or pages. For several other posts I like to show buttons for StumbleUpon and/or DZONE. And for my older posts I need to show the TweetMeMe button in place of the original twitter button. (Seems like I missed that information about TweetMeMe’s sunset on 1st october 2012)

I don’t show the Google+ button, because I don’t want that Google spy on my website. 😉

Okay here is the code, place this function in your functions.php file.

You should call this function inside your single.php and page.php file right below (or above) the content.

You need to include the following JavaScript code for some of the social media buttons (for example, Facebook needs some extra code). Create a file with the name “socialbuttons.js”, add this code and save it inside your WordPress theme directory. You need to add your Facebook application ID as well.

Use the following code in your header.php file right below the BODY open tag to include the JavaScript file.

Additional code for the Facebook like button

Is you want to add open graph meta tags, I suggest to do this by using the WordPress SEO plugin. If needed add the an open graph namespace inside the HTML tag.

Don’t forget to create the different taxonomies for the social media buttons. I used the following slugs for IF statements on the taxonomies: digg, dzone, stumbleupon and tweetmeme. And of course you need to choose the taxonomies for your specific posts or pages.

What do you think, isn’t it a simple, flexible and user friendly function? If you prefer other buttons, visit the button/api pages from the specific social network and follow the instructions there. Create a new taxonomy value for this button, add the new button code to the function above and use the same kind of IF statements to switch them on and off.

Leave a Reply

Your email address will not be published. Required fields are marked *