Jump to content

Setup Sharrre (sharing widget) in 5 minutes


Macrura
 Share

Recommended Posts

You can make your custom sharing widgets using sharrre and PW.. doesn't take long!

1.) Download    http://sharrre.com/

2.) put sharrre.php in templates

3.) put jquery.sharrre.min.js in your scripts folder.

4.) add the new template to PW

5.) add new hidden page using that template; call it anything (example 'sharrre')

6.) include the script in your output;

7.) in your custom js file setup your js; make sure to put in the correct urlCurl to your page using the sharrre.php

for example:

/*-----------------------------------------------------------------------------------*/
/*	SHARRRE
/*-----------------------------------------------------------------------------------*/

$('#shareme').sharrre({
	share: {
	twitter: true,
	facebook: true,
	googlePlus: true
	},
	urlCurl: '/sharrre/',
	template: '<div class="box"><div class="left">Share</div><div class="middle"><a href="#" class="facebook">f</a><a href="#" class="twitter">t</a><a href="#" class="googleplus">+1</a></div><div class="right">{total}</div></div>',
	enableHover: false,
	enableTracking: true,
	render: function(api, options){
	$(api.element).on('click', '.twitter', function() {
	api.openPopup('twitter');
	});
	$(api.element).on('click', '.facebook', function() {
	api.openPopup('facebook');
	});
	$(api.element).on('click', '.googleplus', function() {
	api.openPopup('googlePlus');
	});
	}
});

Note: there are other themes - see the website...

grab the CSS that goes with this JS setup:

http://sharrre.com/example2.html

8.) somewhere on your page, put the relevant markup:

<div id="sharrre">
      <div id="shareme" data-url="<?php echo $page->httpUrl?>" data-text="Share this page"></div>
</div>

works for me on 3 sites so far..

- - -

N.B. There is now a comprehensive module for social sharing buttons by Soma which is probably easier to setup and more flexible, though using Sharrre can still have some applications. Also, it is possible that Sharrre is no longer maintained and may not still work without some intervention... not sure as I have not researched this issue..

  • Like 6
Link to comment
Share on other sites

  • 1 month later...
  • 3 weeks later...
  • 2 months later...

do you have open graph tags?

you need to set og:image

https://developers.facebook.com/docs/sharing/best-practices#tags

<!-- Open Graph
================================================== -->
<meta property="og:locale" content="en_US" />
<meta property="og:type" content="website" />
<meta property="og:title" content="page title" />
<meta property="og:description" content="some description" />
<meta property="og:url" content="page URL" />
<meta property="og:site_name" content="Site Name" />
<meta property='og:image' content='url - to - image' />
Link to comment
Share on other sites

  • 2 weeks later...
  • 2 years later...

I'm not totally sure if Sharrre still works – it hasn't been updated since 2012 and I think it stopped working on some of my sites so I replaced the sharing buttons and used the MarkupSocialShare; I would double check that everything works and you are able to get the values from Facebook...

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...