Okay so I found out how to place it there. Everything is working APART from the total amount of shares.
I found add_action('wp_footer', 'add_social_button'); inside cresta-social-share-counter.php (around line 464) – this creates the floating social bar.
I replaced wp_footer with the name of the function that displays the theme’s own social bar, so it looked like: add_action('thb_social_article_detail_vertical', 'add_social_button');
Inside my themes files, I went to that function (thb_social_article_detail_vertical) and removed all the echo‘s where it was trying to display its own share bar. Now cresta-social-share-counter.php is basically going to inject the plugin’s share bar into there.
Voila, it works! But now the total number of shares won’t work, it just shows a loading icon for infinite time. Obviously something to do with the way it’s called through wp_footer, but why? 🙁
Any help appreciated!
Hi wdevraz,
can you link me your website?
If the total shares not appear very likely is a javascript problem but I should see the site for more information.
Best,
CrestaProject
Hi,
Thanks for the speedy response. The website is over at https://sciscomedia.co.uk/proxima-b-habitable-planet/ (that is one of the articles)
You can see the social bar on the side, I have done display:none on #total-shares in CSS so if you inspect element you can remove that and see the problem with spinning loading icon 🙂
Thanks
Hi wdevraz,
there are no javascript errors, the only problem is that the number of shares of each social network is not passed to the total counter.
Have you made some changes to the plugin files (PHP or JS)?
Is really weird, everything works fine but the value of total shares is not passed.
Best Regards,
CrestaProject
Hi,
I just reinstalled your plugin to revert all the changes I made in the code. Now instead I am simply using some jQuery to re-position the floating bar and place it inside of the container next to the article, code is below.
$("#crestashareicon").appendTo(".share-article-vertical");
However the total shares are still broken
So even without modifying the PHP or JS in your plugin but just by simply moving it, it breaks the total shares.
Not sure what to do…
If you use the “classic mode” to show the buttons, the total counter works?
In this way we begin to discard the possible causes.
CrestaProject
Ok I have thought of a solution.
I can use JavaScript to get the values inside of #facebook-count, #twitter-count elements, which contain the amount of shares for each social network.
Then I will use JavaScript to add these together and replace the animated loading icon with the total number.
I’ll let you know how I get on and post my full solution in-case others would like to use it. This is of course only a hack/work-around for now 🙂
Classic mode style it is still broken.
Okay that was really easy, and I’m not great with JavaScript either!
Here’s my code, with a brief explanation in comments for anyone who wants to use this.
(function($) {
$("#crestashareicon").prependTo(".share-article-vertical"); //here is where we move the floating bar, change '.share-article-vertical' with where you want to move it.
fshares = $("#facebook-count").text(); //get facebook shares
gshares = $("#googleplus-count").text(); //get gplus shares
pshares = $("#pinterest-count").text(); //get twitter shares
totalshares = fshares + gshares + pshares; //add all shares
$( "#total-count" ).replaceWith( totalshares ); //replace the spinning loading icon with the total shares
})(jQuery);
Don't forget to turn off <code>fixed</code> positioning for the <code>#crestashareicon</code> element in CSS!
Done! Thanks for the great plugin.
Perfect 🙂
Thanks to you for sharing the tutorial.
Best,
CrestaProject
I’m currently working on a small fix for counting the shares on your plugin, which will search for HTTP as well as HTTPS, as the website I linked used to be using HTTP, so now some of the shares aren’t showing as it is only searching for HTTPS through the API’s. If possible I could send you the code and you could implement it in a new version of the plugin? Might help some people 🙂
