Howto add Shareaholic to WooCommerce Products

Home/Blog/WordPress HowTo/Howto add Shareaholic to WooCommerce Products

Howto add Shareaholic to WooCommerce Products

Shareaholic is a fantastic free plugin to add social sharing to your posts and pages across your website  whereas WooCommerce is the number one free plugin to change your WordPress website into a full working E-commerce website. In this tutorial I will show you howto add Shareaholic share buttons to your WooCommerce products.

With the free WordPress plugin Shareaholic you can add social sharing buttons to your WordPress website in a few minutes. You can find the plugin here: www.shareaholic.com/

With the free WordPress plugin WooCommerce created by the great WOOteam you can turn your WordPress blog or website in a full functional E-commerce store with just a few clicks. You can find the WooCommerce plugin here: www.woocommerce.com

One challenge I ran into was the fact that there is no simple setting to add the Shareaholic share buttons to all the WooCommerce products pages. There is a free WooFacebook plugin that does the job just for Facebook . Unfortunately there is no (free) way of adding all the social networks to your products. That is why I like Shareaholic.

Here is howto add Shareholic to Woocommerce Products

NOTE! Before you start editing files please backup your WordPress website completely! 

We are going to edit the functions.php file of your installed theme so I recommend using a child theme so you can always start over if something goes wrong. Click here to find out how to create a child theme

After creating the child theme, we will need to edit the functions.php file of your installed theme. The functions.php file can be found in the root of your theme map located in: wp-content/themes/your_theme. In this example I use the free artificer theme from WooThemes. So my functions.php file is located in /wp-content/themes/artificer/

Login with your favorite FTP program (I use FileZilla) and go to wp-content/themes/your_theme. Now download it to your hard-drive.

Open functions.php with Notepad ++ or your favorite text editor and add this php code:

add_action(‘woocommerce_share’, ‘shareaholic_share_buttons’);

function shareaholic_share_buttons() {
echo do_shortcode(‘

[shareaholic app=”share_buttons” id=”xxxxx”]’); }

The code will be put below this line:

/*———————————————————————————–*/
/* You can add custom functions below */
/*———————————————————————————–*/

The file should look like this:

functions.php

 

Now don’t forget to change the xxxxx to the id number that you find in the customize popup.

Finding your Shareaholic id code

Now first login to your website and click on shareholic in the left menu.

Now click on Page –> below content –> customize. You will get a popup where you find the shortcode for the share buttons.

shareaholic shortcode

 

Copy the id code and replace the xxxxx in functions.php with this id code.

Now save functions.php. Go back to your FTP program and browse to your CHILD THEMES MAP. This is important!! Don’t upload to your original theme folder.

Now upload your new created functions.php to the root of the child theme map.  /wp-content/themes/YOURTHEME-child/

Now browse to your website and check your products. The share buttons are added to your products below the meta tags.

You can change the appearance of the icons and choose which social media icons are used in the customize popup of Shareaholic.

INFO! There is a possibility to edit the functions.php file within wordpress by just copying the functions.php file directly to your child theme map. The reason that I use FTP and edit the file on my local computer is that if I make a type mistake and the code is wrong, your admin area will not load anymore and you can’t undo your changes. You will have to login through ftp and remove your code locally and upload the original file again. That is my experience. Feel free to try.

Now you know howto add Shareholic to Woocommerce Products pages without using a paid plugin. I am planning to create more tutorials and WordPress plugin reviews in the future, so if you want to stay updated please leave your name and email at the top of this page.

I hope you have learned from this tutorial. If you find this post useful please share it by clicking the social media buttons below. Comments are also welcome. I wish you all a nice day and hope to see you back here soon.

By | 2016-10-15T18:28:36+00:00 May 11th, 2014|WordPress HowTo|5 Comments

5 Comments

  1. Dedeobi August 21, 2014 at 10:25 am - Reply

    Hi, I would like to ask how to remove shareaholic related articles and shareaholic share button within woocommerce product page? I am installing both plugins. But I cant setup woocommerce product page for excluding shareaholic.

    • Andrew Dishes September 2, 2014 at 9:01 pm - Reply

      Hi Dedeobi,
      Thanks for you question. I will take a look at it and let you know.

    • Andrew Dishes September 2, 2014 at 9:30 pm - Reply

      Hi Dedeobi,

      To remove your Woocommerce products from the related articles you can do the following.

      Go to the backend of your website and click on shareholic -> App manager in the left menu.

      Then click under Related Content on Edit Related Content Settings.
      Now let’s say your shop slug is http://www.yourdomain.com/shop/

      Than add http://www.yourdomain.com/shop/* in the box and save settings.
      The * is a wildcard.

      For removing the Sharebuttons I have to get back to you on that one. Hope this helps

  2. Jay @ Shareaholic September 5, 2014 at 8:30 pm - Reply

    Andrew,

    Thanks so much for posting this tutorial!

    We’re in the process of working with the WooCommerce team on a deep integration. In an upcoming release we’re also going to make it dead-simple to be able to exclude specific product pages from being Recommended.

    Best,
    Jay

    • Andrew Dishes September 5, 2014 at 10:32 pm - Reply

      Hi Jay,

      Thanks for your comment. That would be a fantastic upgrade. I bet a lot of people who use WooCommerce and Shareaholic will be very pleased when this upgrade. Please keep me posted on this, so I can share it here as well.

Leave A Comment