Themeforest

WordPress Plugin – Slick Social Share Buttons

Updated 15th March 2013

Add facebook like, twitter tweet button, google +1, linkedin, digg, stumbledupon, delicious, reddit, buffer & pinterest.com pin it social media share buttons in a floating or slide out tab to any Wordpress website with the Slick Social Share Buttons plugin.

Slick Social Share Buttons also includes a social statistics page in Wordpress admin, which gives you complete share totals for each page, post and category page.

The plugin has a range of options giving you full control of position of button panel, size of social media buttons, display order and whether to show or hide the floating or sticky panel on page load.

The plugin gives you the choice to include the social media share buttons on:

  • Wordpress Home page
  • Posts page if using static home page
  • Posts
  • Pages
  • Category Pages
  • Archive Pages

Premium WordPress Social Share Buttons Plugin

Our premium social share buttons plugin includes the Xing button plus bonus print and email buttons. The social share buttons are loaded via jQuery to improve page download speed. Check out the demos on the WordPress Social Share Buttons live preview site or purchase from codecanyon.

If you are looking for a non-Wordpress version, which can be used on all websites check out our Premium jQuery Social Share Buttons Plugin – allows you to add all of the main social media share buttons to any web page – no PHP required!

Also Check Out Our Other Premium WordPress Plugins:

Demos for WordPress Social Share Buttons Plugin

Plugin also used on this site – see social share buttons on left. Additional demos include:

Download Slick Social Share Buttons plugin

Download Slick Social Share Buttons 2.4.3 (171,365)

Installation

  1. Upload the plugin through `Plugins > Add New > Upload` interface or upload `slick-social-share-buttons` folder to the `/wp-content/plugins/` directory
  2. Activate the plugin through the ‘Plugins’ menu in WordPress
  3. Configure the plugin options via the “Social Buttons” menu option in Wordpress admin -> Social Buttons
  4. After selecting the button and plugin options click “Save” to activate the buttons on your Wordpress website

Floating/Sticky Tab Options

The type and position of the social button panel can be configured via the plugin settings page in Wordpress admin:

Method

Select either a “floating” panel or a sticky “Sliding” tab

Location:

The position of the social button panel in the browser window:

Position From Center

Only available if using floating buttons. Check this if you wish to have the floating button panel positioned from the center of the page as opposed to the edge of the browser. In the text box enter the number of pixels that the panel should be positioned from the center of the screen. Useful for fixed width websites.

If not checked the position of the floating panel will be based on the edge of the browser – i.e. if the browser window is reduced the buttons will move towards the center.

Offset

Offset allows you to fine tune the positioning by adding the number of pixels that you would like to offset the panel from the edge of the browser window.

For sliding tabs only one offset is used:

  • Top-left & bottom-left – number of pixels from left edge of browser
  • Top-right & bottom-right – number of pixels from right edge of browser
  • Left & right – number of px from the top of the browser window

Floating social buttons:

  • Top-left & left – pixels from top & pixels from left
  • Top-right & right – pixels from top, & pixels from right
  • Bottom-left – pixels from bottom & pixels from left
  • Bottom-right – pixels from bottom & pixels from right

Direction

Only applicable for “Slide Out” panels. This allows you to select whether the buttons are displayed horizontally or vertically.

Disable Floating Effects

If checked the floating style animation used for the floating buttons panel will be disabled and the panel will now stick to its location in the browser (only applicable to floating button panels)

Floating Speed:

The speed for the floating animation (only applicable for the floating type) in milliseconds – i.e. the time it takes to “catch up” when the page scrolls up or down) – e.g. to set the floating speed to 1.5 seconds use 1500.

The default speed is set to 1.6 secs.

Animation Speed:

The speed in milliseconds to open and close the button panel.

The default speed is set to 0.6 secs.

Auto-Close:

If checked, the panel will automatically slide closed when the user clicks anywhere else in the browser window

Load Open:

If checked, the social buttons will be displayed open when the page first loads. The tab will still close the panel when clicked.

Default Skin:

Check this box to use the default skin that comes with the plugin. To use your own styles uncheck the box and add the CSS to your theme’s style sheet. The default CSS file can be used as a template.

Tab Image URL:

To use your own image for the button panel tab insert the full URL for the image into the text field. Leave the box empty if you wish to use the default “Share” tab that comes with the plugin.

Page Display Options

Check the boxes of those pages/posts where you would like the social media buttons to appear:

  • Wordpress Home page
  • Posts page – if using a static home page this will be the page that displays posts
  • Posts
  • Pages
  • Category Pages
  • Archive Pages

Excluding Individual Categories

For category pages you also have the option to specify any categories you would like to exclude from showing the social media buttons.

Click the “Show Categories” link to display a complete list of all categories on your website. Clicking on a category will move the category between the include and exclude lists.

Click the “Save” button once you have selected the relevant categories.

If a category is excluded the social media buttons will not appear on the category page or any post assigned to that category.

Social Media Button Options

To disable a button uncheck the checkbox next to the button name.

The size of each button and whether to display a count of total shares for that page can be selected from the dropdown menu. A sample showing an actual, active button with the selected settings will display in the right-hand column.

The buttons will display on the website in the same order that they are listed in the settings page. To change this order drag & drop the buttons and arrange as required.

Current Supported Social Media Share Buttons:

  • Twitter Button
  • Facebook Like
  • Google +1 Button
  • Delicious Button
  • LinkedIn Button
  • StumbleUpon Button
  • Digg Button
  • Reddit Button
  • Buffer Button
  • Pinterest “Pin It” Share Button

In addition to the basic settings some Social APIs require additional information.

Twitter

Input your twitter username (minus the ‘@’ symbol) to include this in the tweet.

Facebook

The facebook like button includes the option to use either the iFrame or xfbml methods of adding the button.

If you select the xfbml version you must add the following settings:

  • Either a Facebook App ID or a Facebook Admin ID – although both can be entered you only need one for the xfbml version to work.
  • Default Facebook Image – enter the URL for an image that will be entered into the facebook open graph meta tag in the event that a post thumbnail is not available for the page.
  • Disable Opengraph – if you already have a plugin adding the facebook opengraph settings you can disable this plugin adding an additional set by checking this checkbox.

Pinterest.com Pin It

The pinterest button now has 2 options available (starting version 2.4).

Featured – The image will be set to the “featured” image in the post.

Preview – select this option if you want to let your user select which image to use – clicking the “Pin It” button will bring up an overlay containing thumbnails of relevant media found on the page. The user can click one of these images to select it for posting onto their pinterest board.

Twitter URL Shortening

The plugin includes the option to select URL shortening for twitter from several services:

  • Bit.ly
  • Digg
  • Su.pr
  • tinyurl

If using bit.ly the API Key and account login must also be entered. For su.pr these are both optional.

Social Statistics & Metrics

Starting with version 2.0, the Slick Social Share Buttons plugin now includes a statistics page in Wordpress admin, which gives you a complete overview and summaries of shares on your posts, pages and category pages.

To access this page go to Wordpress Admin -> Social Buttons -> Social Stats

Social Stats options include:

Show

Select whether to show just your home page, posts, pages or category pages. Selecting the pages option will also include the home page results as the first item.

Filter

Available for posts only this lets you filter the results by category.

Order By

Select whether to sort the results by either date or alphabetically by title in either ascending or descending order. Only available for posts or pages.

Display

Show the total shares per URL either as text, text using conditional formatting to give a data “heatmap” or as active share buttons.

Note: selecting the “buttons” option will increase loading time as each button must be generated from the relevant social network site.

Per Page

Adjust the number of results per page. For faster loading time select a lower number per page.

Shortcodes

The plugin includes the feature to add text links within your site content that will open/close the sticky or floating button panel.

Click the links below to open/close the share button panel.

[dcssb-link] – default link, which will toggle the social share button panel open/closed with the link text “Share”

[dcssb-link text="Tell Your Friends"] – toggle the button panel open/closed with the link text “Tell Your Friends”

[dcssb-link action="open"] – open the button panel with the default link text.

[dcssb-link action="close"] – close the button panel with the default link text.

Troubleshooting & Frequently Asked Questions

Check out our Frequently Asked Questions for Slick Social Share Buttons.

If you have a problem with the facebook like button try this first – Checking you facebook like button.

Many issues that can crop up with installing and using the plugin with different themes have also been covered in our comments section. Please check previous comments and FAQ for further information/tips.

For plugin customisations or additional support please contact us for a quotation.

Demos for WordPress Social Share Buttons Plugin

Plugin also used on this site – see social share buttons on left. Additional demos include:

Download Slick Social Share Buttons plugin

http://wordpress.org/extend/plugins/slick-social-share-buttons/

Feedback

If you find this plugin useful please take the time to rate it at wordpress.org.

Screenshots

Example of vertical sliding social buttons panel

Example of horizontal sliding social buttons panel

Example of floating panel

Social Statistics admin page

Other Social Media/Network Plugins

If you like Slick Social Share Buttons then try out our other social media Wordpress plugins:

Social Media Tabs

Add a facebook like box, google +1, google buzz, twitter and RSS profiles and feeds to any widget area with compact, slick sliding tabs. Plugin has the option of adding the tabbed box to either a slide out panel at the side of your browser window or as a static tabbed box in your widget area – see plugin page

Floating Tweets

The Floating Tweets plugin adds a floating, slide out tab containing the latest tweets from any twitter account. The widget is easily set up via any widget panel and can handle multiple twitter feeds per page – see plugin page

Updates

Version 2.4.10 – 15th March 2013

  • Updated: button select list for Chrome

Version 2.4.9 – 3rd March 2013

  • Updated: pinterest preview button

Version 2.4.8 – 13th February 2013

  • Updated: pinterest button css

Version 2.4.7 – 12th December 2012

  • Updated: use wp_enqueue_script for admin jquery ui (WordPress 3.5 compatibility)

Version 2.4.6 – 27th November 2012

  • Updated: Code to reload jquery plugins if overwritten

Version 2.4.5 – 1st November 2012

  • Fixed: Reset URL shortener when “none” selected

Version 2.4.4 – 20th October 2012

  • Added: Code to reload jquery plugins if overwritten
  • Edited: Change plugin path to use plugins_url()
  • Fixed: Bug with button size select lists in admin

Version 2.4 – 10th February 2012

  • Added: Buffer button
  • Added: New option for pinterest button to allow user to select the associated image.

Version 2.3 – 22nd January 2012

  • Added: Reddit button
  • Fixed: Stumbleupon width & height

Version 2.2 – 30th December 2011

  • Added: Delicious button
  • Removed: Obsolete google buzz button

Version 2.1.4 – 22nd November 2011

  • Added: Option to disable facebook opengraph settings

Version 2.1.1 – 22nd October 2011

  • Added: Option to show buttons on posts page when using a static home page
  • Added: Conditional loading of jquery &CSS files
  • Added: Option to view social statistics counts using a data “heatmap”

Version 2.0 – 17th October 2011

  • Added: Social statistics admin page
  • Added: Only show statistics for active buttons
  • Fixed: Total posts when filtering posts by category

Version 1.4.2 – 12th October 2011

  • Fixed: Bug with short url meta data

Version 1.4.1 – 7th October 2011

  • Update: Pin It button size drop down menu
  • Update: Optimize jquery plugin files
  • Update: Changed method of retrieving post ID

Version 1.4 – 5th October 2011

  • Added: pinterest.com “Pin It” share button

Version 1.3 – 29th September 2011

  • Updated: remove additional facebook js script
  • Updated: facebook opengraph type meta tags

Version 1.2.9 – 27th September 2011

  • Updated: Added local GA social tracking script

Version 1.2.8 – 23rd September 2011

  • Updated: Increased title/description text

Version 1.2.7 – 9th September 2011

  • Fixed: Tweet home page & category page URL using shortener
  • Fixed: Hiding of facebook like comment box

Version 1.2.6 – 4th September 2011

  • Added: Option to disable floating button effects

Version 1.2.5 – 25th August 2011

  • Added: Option to position floating buttons from center of page

Version 1.2.4 – 19th August 2011

  • Added: Google Buzz button

Version 1.2.3 – 14th August 2011

  • Added: Ability to exclude specific categories

Version 1.2 – 11th August 2011

  • Added: Digg button
  • Fixed: Bug with Stumbleupon & Safari

Version 1.1 – 11th August 2011

  • Added: Default image for facebook like button Open Graph tags
  • Fixed: URL for Wordpress home page for Open Graph tags

777 Comments

  • Hello,

    I installed the plugin and it seems to have issue with my theme. I am getting everything to work, but there is a problem with the tab. It slides out when you click on it, but slides back immediately. There is no time for the user to click one of the like buttons since the tab slides back before they get a chance. Is there a solution for this? Thanks!

    • Hi,

      There must be some jquery in your theme which is also affecting the tab. Look for any generic jquery rules which apply to the class “tab”

      • Do you know what php file this might be in and what the jquery rule might look like? Do I modify it or delete it?

        • No idea sorry. You need to check with the theme author or if you want to look through the files I would suggest looking as the js files. It would probably involved “.tab” as the selector in the jQuery code since thats the part of the plugin that’s being affected.

  • [...] Slick Social Share Buttons | Download | Demo Cost: free [...]

  • Hi Lee,

    Your plugin has everything I’m looking for. However, I’m trying to setup so it will display at the bottom of each post (not floating, but permanently fixed)
    I’ve tried playing around with the settings, but after a 1-2 seconds delay, only the green share icon “floats”.
    Only when clicked will it display the social network buttons.
    I’m using WP 3.3.1
    Any idea what I’m doing wrong?
    Otherwise, if I can make it work – it is by far the best plugin I’ve seen.

    • Hi,

      Unfortunately that isnt a plugin feature. The plugin only offers the floating/slide out buttons

      • Will you be implementing something similar to what I’m referring to? I would not mind a paid version based on your plugin concept. Right now, you can see my blog at http://blog.background-checks-systems.com and see that I’m using 4 different plugins at bottom of each post. Due to this, they don’t align nicely.

        I’m aware that there are other “all-in-one” social plugins, but yours had the better configuration options.

  • Love the plugin, but I must get the Pinterest button to work in order to use it. The odd thing is, it’s working in Chrome and Safari, but not in Firefox! Any help would be much appreciated.

    Here’s a video demonstration of my problem: http://screencast.com/t/sT2U8RBJ

    • Hi,

      Try the other version of the pinterest button

      • I already tried both the horizontal and vertical (stated that in the video).

      • Lee…Any other thoughts on my Pin it problem in Firefox?

        • Tey checking the page for javascript errors or using the other pinterest button.

          • No Javascript errors.

            When you talk about the other pinterest button, are you talking about the horizontal version? Or another pinterest button in another of your plugins?

          • Thanks, Lee. The Pin it button does work with “Featured Image” in Firefox. Really liked the possibility of the user choosing which image to pin that you built into v2.4. Maybe it’ll work in Firefox in the near future.

          • The button already does work. There are no errors in the plugin code so the problem must be with the theme or another plugin

  • I installed your plugin. Why is it showing the same number of Facebook likes on all the pages? When a Facebook like is incremented on any page, all the Likes increment at the same time.

    • Because your theme files are adding the facebook open graph meta tags in the head of your page with the same URL on every page. Check your page source code to see the tags

      • Are the open graph meta tags necessary? Can they be removed?

      • I removed the open graph HTML from the header.php of WordPress with no ill effects. Each page is now showing a different URL for the open graph tags, for example:

        <meta property="og:url" content="http://accountantsalaryinfo.com/cpa-requirements"/>

        The problem still exists though. Any other suggestions?

      • I removed the tags but the problem still exists on a few of the pages. The other pages increment properly.

        Any ideas on what to fix on the problem pages?

        • I suggest trying the debugging tool listed in the FAQ. This will give you more info on what may be causing the problems.

  • The RT button for Twitter works but doesn’t include the url link to the post being RTd. Any clue how to fix this, please? It’s happening to some other blogs too, not just on mine.

    • H,

      Never come across the problem. All of the buttons use exactly the same source to get the link so its either an error in the twitter code (this I have seen before caused by plugins, which try to rewrite external links so they open in a new window) or an error with a shortener service if you are using one.

      You can check the latter by seeing if your posts have custom field values with the name “dcssb_short_url”. Otherwise would need to see the page source code to see what values are being sent to twitter

  • Great plugin.
    Some issues I have found:
    I have had issues with the tall G+ button as it wasn’t displayed, had to switch to a different button.

    - How do you set it up at a fixed position , narrow it and remove the head like on your site?

    Regards
    Tobi

    • Hi,

      See the FAQ on how to set up the buttons like designchemical.com

      The google issue may be a local problem with google +1. Usually this will correct itself

  • Very slick, indeed.

    One snag. I have not found any combination of settings that works well when viewing the page on a phone. The “Share” tab stays on the screen, and always covers part of the content. With static “on the page” buttons (as opposed to your dynamic “on the screen” buttons) this is not such an issue.

    Perhaps an idea for a future update: switch to static “on the page” buttons when a small screen is detected?

    But nice work, I have to say.

    • Hi,

      Static isnt currently possible due to the way the plugin inserts the code into the page. Try setting the positioning based on the center of the page as opposed to the edge of the browser window

  • I love using the social slick share buttons. Whit the latest update I face a little difficulties – the LinkedIn and pinterest buttons really don’t look fine for me, because the LinkedIn counting number isn’t next to the LinkedIn button, while the pinterest doesn’t even have a button with its logo (icon) with.

    I really don’t want to use something else, so please look into the problem.

    Thank you

    • Is the default style sheet enabled in the plugin settings?

  • Great plugin – thanks!
    I’m having a small problem with the display. The “Share” button covers the Tweet button. Is there a way to fix this?

    • Hi,

      You can edit the CSS to change the size of the button areas – see FAQ section for info on customising the style sheet

  • I seem to be having the same problem as another person who commented above. My plugin in activated, and my setting saved, but nothing is showing up on any part of the website. Does this plugin not work for certain themes?

    • No it will work for all WordPress themes assuming the theme follows standard wordpress layout. If there is no button code appearing in the page then the wp_footer() function must be missing from the theme’s footer.php file

  • Hi! Thanks a lot for a great plugin!
    However the Pin it button doesn’t seem to work. After I pin a picture, the pin process didn’t go through and it kept asking me to put in description for the pin. Could you please review this?

    Thanks!
    Jen

    • hi,

      Try switching to the other pinterest button – the plugin includes 2 different types

  • My social plugins is not showing up at all? Why could that be? Do I need to fill in _all_ options on the settings-page?

    • Hi,

      See FAQ section and previous comments for solution to the same problem

  • How can I manually add the Pin It button?

    • Hi,

      The pinterest button is already included in the plugin

  • Hi there, awesome plugin!!!

    I’m using the Elegant Themes Handheld plugin to display my site in mobile format when viewed on a smartphone. When this happens, the Slick Social Share Buttons cover up my blog posts. Is there any way to disable this plugin only when viewed on a mobile device?

    Many thanks

    • Hi,

      Usually the theme should handle this

  • Is there any fix if another crucial plugin is conflicting? I really do not want to get rid of these awesome 2 plugins

    Thanks Frank

    • Hii,

      Only fix the other plugin. There should be no conflicts with WordPress caused by the social share buttons plugin (assuming that the theme is coded correctly)

  • Love the plug-in! If you visit my site http:// http://www.hiremarkjohnson.com (very much in progress still) you’ll see that I’ve heavily customized it based on your lead.

    I was wondering if there was a way to keep it from reloading on every page… just load once and stay there on the left like the contact tab.

    THANKS!

    • Hi,

      The buttons have to load on every page. You cant keep HTML between pages

  • [...] -> Plugin Author Site: Design Chemical [...]

  • Hello,

    I cannot get this plugin to work. I’ve enabled the floating bar on post pages, yet nothing’s appearing. I use the Thesis theme, which has no footer.php file. I’m also using the W3 Total Cache plugin, and I wonder if that might be conflicting? I disabled JS minification, but this plugin still doesn’t work for me.

    Thanks in advance, the plugin looks awesome, so I hope I’ll be able to use it!
    Diana

  • Hi, I setup this plugin into my website, however I want to change position, it is vertical now and I want make it horizontal, can you help me? I could not find any option in the admin area…

    • the settings for vertical/horizontal are in the settings

Leave a comment

To add code to your comments wrap the code text in [text][/text] tags