Facebook分享错误

Question

I'm trying to create a facebook share button in each of my post, and the share content will be dynamic, which mean I will be able to customize its thumbnail, title and description for each of the post.

below is the code that I use(I'm using advance custom field plugin in wordpress by the way):

<a onClick="window.open('http://www.facebook.com/sharer.php?s=100&amp;p[title]=<?php the_field(videotitle); ?>&amp;p[summary]=<?php the_field(video_description); ?>&amp;p[url]=<?php echo get_permalink(); ?>&amp;p[images][0]=http://img.youtube.com/vi/<?php the_field(youtube_thumb); ?>/maxresdefault.jpg','sharer','toolbar=0,status=0,width=548,height=325');" href="javascript: void(0)" rel="nofollow"></a>

///////////////////////////////////////////////////////////////////////////////////////////////////////

Below is the php that will echo out my content from my CMS:

<?php the_field(videotitle); ?>
<?php the_field(video_description); ?>
<?php echo get_permalink(); ?>

The code works fine, but I noticed when I enter the the title/description too long or use special characters in my post the button stop working.

How should I overcome this? I'm still very new to php, please explain in layman's term if possible and thank you in advance.

Answer 1

The problem is most likely caused by passing in unescaped special characters into a direct javascript call.

Right now, you have the following javascript executing when the link is clicked:

window.open('http://www.facebook.com/sharer.php?s=100&amp;p[title]=<?php the_field(videotitle); ?>&amp;p[summary]=<?php the_field(video_description); ?>&amp;p[url]=<?php echo get_permalink(); ?>&amp;p[images][0]=http://img.youtube.com/vi/<?php the_field(youtube_thumb); ?>/maxresdefault.jpg','sharer','toolbar=0,status=0,width=548,height=325');

You are passing in several PHP variables, which may alter the format of your javascript. For example, let's say the_field(videotitle); returns Maria's Video. If you note, your string has a quote in it due to Maria's.

Now, you if pass this title into your javascript, you're going to have an un-escaped quote, causing a JS error, because it will output like this:

... [title]=Maria's Video ...

To address this, you must format out PHP output to ensure that it will not affect the JS code. In my example, you can encode the outputted strings using the urlencode function included with PHP, like this:

<?php urlencode(get_the_field(videotitle)); ?>

Just remember that passing PHP variables into javascript CAN alter the syntax of your javascript function. If the final javascript function contains syntax errors caused by the PHP output, it will not run.

You can see the javascript errors on the page you are debugging by hitting F12 in your browser and viewing the Console tab.