Post by wafflemeister » Thu Dec 19, 2013 10:38 am

Hey guys,

I am trying to place the facebook like, the goole+ and twitter follow button in the header of my website. While I have successfully placed the code/images at the desired location, the buttons have to reload every time I change sites while browsing through my website. The website is wafflepantry.com and I have a custom theme. I would like them to be statics like my store logo or the SSL security image while browsing my sites.

I have added the necessary codes of each social media site into the header.tpl of my custom theme. I have attached the whole header.tpl, but here is also just the code I added:

Code: Select all

	<!-- Facebook Like button START-->

		<div id="fb-root"></div>
		<script>(function(d, s, id) {
 		 var js, fjs = d.getElementsByTagName(s)[0];
 		 if (d.getElementById(id)) return;
 		 js = d.createElement(s); js.id = id;
 		 js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
 		 fjs.parentNode.insertBefore(js, fjs);
		}(document, 'script', 'facebook-jssdk'));</script>

		<div class="fb-like" data-href="https://www.facebook.com/pages/Wafflepantrycom/1398343833743698" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></div>

	<!-- Facebook Like button END-->


	<!-- Twitter+ Follow button START-->

		<a href="https://twitter.com/WafflePantry" class="twitter-follow-button" data-show-count="false" data-show-screen-name="false">Follow @WafflePantry</a>
		<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

	<!-- Twitter+ Follow button END-->


	<!-- Google+ Follow button START-->

		<div class="g-plusone" data-annotation="none"></div>

		<script type="text/javascript">
 		 (function() {
  		  var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
  		  po.src = 'https://apis.google.com/js/platform.js';
  		  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
 		 })();
		</script>

	<!-- Google+ Follow button END-->
I would greatly appreciate your help in figuring this out. Thank you in advance.

New member

Posts

Joined
Fri Jun 21, 2013 11:10 pm

Post by veganista » Thu Dec 19, 2013 7:01 pm

Unfortunately this is just how they work.

If you want the functionality they offer you will have to put up with them loading like they do.

They need to be loaded remotely from fb, google and twitter's services

New member

Posts

Joined
Mon Apr 26, 2010 11:50 pm

Post by wafflemeister » Fri Dec 20, 2013 12:24 am

That is unfortunate.

Thanks veganista!

New member

Posts

Joined
Fri Jun 21, 2013 11:10 pm

Post by veganista » Fri Dec 20, 2013 6:03 pm

No worries,

You may want to add Solved: to the start of your post title so people know.

New member

Posts

Joined
Mon Apr 26, 2010 11:50 pm
Who is online

Users browsing this forum: No registered users and 36 guests