Hello guys,
I am trying to create a share counter for my blog on Webflow.
I would like to make it like the one that appear on Mashable .
I find the plugin Sharrre on Github but I don’t know how to integrate it on Webflow.
Could you help me build it ? If you think it’s the best plugin to use.
I’m sure it will be very useful for the entire Webflow community.
Thanks in advance.
Antoine
samliew
(webflowexpert.com)
March 29, 2016, 1:06pm
3
Rough steps (use on collection template page only ):
Add class total-shares
to an element:
<div class="total-shares">0</div>
Go to the collection template Page Settings > Custom Code. Paste this in the Footer Code.
<script>
var Webflow = Webflow || [];
Webflow.push(function() {
$.getScript('https://cdn.rawgit.com/Julienh/Sharrre/master/jquery.sharrre.min.js', function() {
$('.total-shares')
.sharrre({
title: '',
url: window.location,
share: {
facebook: true,
digg: true,
delicious: true,
linkedin: true,
},
buttons: {
facebook: true,
digg: true,
delicious: true,
linkedin: true,
},
render: function (api, options) {
$(api.element).text(options.total);
},
});
setInterval(function() { $('.total-shares .buttons').remove(); }, 200);
});
});
</script>
Publish site
Demo: Is Your Child Sleeping Enough? | Singapore's Child
Hello Samuel !
Thanks a lot for your quick response !
Unfortunately it doesn’t work… Here is what I did :
Add a text block element inside a div with the text : “0 shares”
Add text span on the “0” with the class “total-shares”
Paste the code you give me in the footer
Publish site
Do I have to paste my url in the script to make it work ?
Antoine
samliew
(webflowexpert.com)
March 29, 2016, 5:19pm
5
Please provide the following when asking for help:
Public share link for designer
Published URL link
samliew
(webflowexpert.com)
March 30, 2016, 9:58am
7
Edited code above. Replace your code.
Thanks a lot Samuel, it’s working !
It was displaying share boxes when the mouse was on the counter zone but I used the style fonction style="pointer-events: none!important;"
to make it disappear.
Cheers
system
(system)
Closed
May 30, 2016, 9:12am
9
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.