Jump to content
Sign in to follow this  
davidcsonka

Adding Facebook Like to Platform Pro

Recommended Posts

davidcsonka

Are there any guides on how to add the Facebook Like button to a Platform pro theme? I was disappointed to discover that this theme uses the outdated Share functionality.

Share this post


Link to post
Share on other sites
catrina

Are you referring to a Facebook Like button for the blog/website overall or individual posts?


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
davidcsonka

Specifically the "Like Button" for single post pages. I will use the "Like Box" for the overall website.

Share this post


Link to post
Share on other sites
davidcsonka

Well, those add the iframe versions. It would be nice to be able to use the fbml versions. Like some way to have the code for the buttons put in above the post content.

Share this post


Link to post
Share on other sites
catrina

Would that be the button style with the "thumb up" image that you see at the top of a page on Facebook?


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
davidcsonka

Well, the iframe and fbml versions are essentially the same, the LIke butotn with the thumbs up, except the iframe can sometimes be problematic and its just easier to work with the fbml version with themes usually. I guess I'll just use the plugin for now.

Share this post


Link to post
Share on other sites
catrina

Perhaps there is FBML WordPress plugin, but I have yet to see it be made for individual posts. Have you tried looking in the plugins directory?


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
davidcsonka

Is there some kind of content area for Platform Pro that allows you to add content at the top of a single post content area? That would make this much more doable, without forcing me to edit the single post php file.

Share this post


Link to post
Share on other sites
catrina

You can use the custom code hook called pagelines_loop_before_post_content in the single post PHP file to add the content.


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
davidcsonka

That maybe what I have to do. When I look in the single.php file, it's basically empty. I assume this file has been superceded by another within the platform theme - which one would it be?

Share this post


Link to post
Share on other sites
cmunns

Are you using the child theme? If so, I can give you simple hook + code for the like button to be on single posts.

Share this post


Link to post
Share on other sites
davidcsonka

Yes, I installed Base - that is what you mean by the child theme, right?

Share this post


Link to post
Share on other sites
cmunns

yep. In functions.php add this code ` add_action('pagelines_loop_metabar_end','fb_like'); function fb_like(){?> <?php if(is_single()):?> <?php endif;?> <?php } ` You may have to change some cSS as well to account for some spacing, but let's get here first.

Share this post


Link to post
Share on other sites
davidcsonka

Thank you Mr. C, that hook appears to do the trick. I changed the name of the function to social_share() and inserted the Facebook SDK script and my already prepared array of sharing buttons - and it showed right up at the top of the post where I needed it.

add_action('pagelines_loop_metabar_end','social_share');
	
	function social_share(){?>
	<?php if(is_single()):?>
	
	<!-- Facebok SDK -->
	<div id="fb-root"></div>
	<script>
	window.fbAsyncInit = function() {
	FB.init({appId: '127676347288747', status: true, cookie: true,
	xfbml: true});
	};
	(function() {
	var e = document.createElement('script'); e.async = true;
	e.src = document.location.protocol +
	'//connect.facebook.net/en_US/all.js';
	document.getElementById('fb-root').appendChild(e);
	}());
	</script>
	<!-- end Facebok SDK -->
	
	<!-- top sharing area -->
	<table style="margin-bottom:10px;">
	<tr>
	<td valign="middle" style="padding-right:15px;"><script src="http://www.stumbleupon.com/hostedbadge.php?s=2"></script></td>
	<td valign="middle" style="">Tweet<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></td>
	<td valign="middle" style="width:420px;"><fb:like action='like' colorscheme='light'
	layout='standard' show_faces='false' width='400'/></td>
	</tr>
	</table>
	<!-- end top sharing area -->
	
	<?php endif;?>
	<?php }[/code]

Do you foresee any problems with nesting the Facebook SDK in there? It seems to work alright: http://naturallyengineered.com/blog/cooking-thanksgiving-dinner-is-time-well-spent/

Share this post


Link to post
Share on other sites
bryan-hadaway

All looks good for now, you can of course run the site though W3C: http://validator.w3.org/ to be sure. Let us know if there are any problems. Also, for anyone reading this that finds doing this manually difficult, there are many many plugins for this and tutorials: http://wordpress.org/extend/plugins/search.php?q=facebook+like Thanks, Bryan

Share this post


Link to post
Share on other sites
davidcsonka

So, the following hook will add code to the top of a single post: add_action('pagelines_loop_metabar_end','fb_like'); -- Is there a similar hook for adding code to the bottom of a single post?

Share this post


Link to post
Share on other sites
catrina

You can try this custom hook: pagelines_before_sharebar (it's a hook belonging to the Content Sharing section that is placed at the bottom of single posts)


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
davidcsonka

Thanks, but I found where I can find all the hooks registered in the loop file. I'm going to use "pagelines_loop_post_end"

Share this post


Link to post
Share on other sites
johnflower

hi, i'm trying to add the facebook like button to my site, Silly Poetry, following this tutorial: http://www.hyperarts.com/blog/how-to-add-facebook-like-button-social-plugins-to-wordpress-posts/. now, i'd like to place a box after each single post with the like button in it, and some silly text i still need to come up with. of course, the box will be given some class so i can mess it up with my css. so, i tried adding the code (which follows) to the functions.php file. i'm using the base template. here's the code:

function pagelines_after_maincontent() {<div id="fb-root"></div><script>window.fbAsyncInit = function() {FB.init({appId: '177722492240937', status: true, cookie: true,xfbml: true});};(function() {var e = document.createElement('script'); e.async = true;e.src = document.location.protocol +'//connect.facebook.net/en_US/all.js';document.getElementById('fb-root').appendChild(e);}());</script><fb:like action='recommend' colorscheme='light'layout='standard' show_faces='false' width='200'/>}

it killed my site. it killed it so bad i had to ftp the file down to my lappy and remove the code. what am i doing wrong? css and html is no problem. php in my hands is a nightmare. thanks!

Share this post


Link to post
Share on other sites
johnflower

ok, i've changed the code in functions.php to the following:

	function pagelines_loop_post_end() { ?>
	<div id="fb-root"></div>
	<script>
	window.fbAsyncInit = function() {
	FB.init({appId: '177722492240937', status: true, cookie: true,
	xfbml: true});
	};
	(function() {
	var e = document.createElement('script'); e.async = true;
	e.src = document.location.protocol +
	'//connect.facebook.net/en_US/all.js';
	document.getElementById('fb-root').appendChild(e);
	}());
	</script>
	<fb:like action='like' colorscheme='light'
	layout='standard' show_faces='false' width='200'/>
	<?php }
	

the like button doesn't show up. is my code on the wordpress-platform-pro side of things correct?

Share this post


Link to post
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

Sign in to follow this  

×