Strange problem related to Facebook Like Button

eriklharper

I thought I'd go ahead and report this even though I'm going to work around it for now until you can tell me maybe why this is happening. Here's the scenario: I have a Fuel site that is currently up-to-date with origin/master. I have several pages in the application/views directory serving as the pages. I have a sidebar that is included in each page via a $this->load->view('_blocks/sidebar') reference in the custom layout file for my site, nothing unusual. This sidebar has a facebook widget inside of it to embed the like button. The code looks like this:

<!-- Facebook --> <div id="facebook" class="sidebar-box"> <a class="social-url" href="http://www.facebook.com/" target="_blank" title="Visit Us on Facebook"><img src="/assets/images/facebook-sidebar.png" alt="Facebook Icon" /></a> <div class="fb-like" data-href="http://www.facebook.com/" data-send="false" data-layout="button_count" data-width="255" data-height="22px" data-show-faces="true" data-font="segoe ui"></div> <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>

When I create the CMS page counterparts to these view files, the page immediately breaks when trying to view the newly created CMS page, giving this error:

( ! ) Parse error: syntax error, unexpected ')' in C:\wamp\www\chattanooga\fuel\application\cache\dwoo\compiled\31e010057439cc0c483170e14453a544.d17.php on line 171 Call Stack # Time Memory Function Location 1 0.0018 728160 {main}( ) ..\index.php:0 2 0.0063 809584 require_once( 'C:\wamp\www\chattanooga\fuel\codeigniter\core\CodeIgniter.php' ) ..\index.php:270 3 0.2258 8031632 Page_router->_remap( ) ..\CodeIgniter.php:284 4 0.3814 10136944 Page_router->_remap_cms( ) ..\page_router.php:54 5 0.3862 10180208 Fuel_page->cms_render( ) ..\page_router.php:88 6 0.4967 11085536 MY_Parser->parse_string( ) ..\Fuel_page.php:255 7 0.4967 11085584 MY_Parser->_parse( ) ..\MY_Parser.php:157 8 0.5210 12770824 Dwoo_Core->get( ) ..\MY_Parser.php:222

When I go to checkout line 171 of that cached file, I notice that it is bombing out on a particular line in the javascript that is part of the Facebook Like widget. Here is the entire code block that generates the Facebook widget to compare with the correct version I pasted above so that you can see what has changed:

<!-- Facebook --> <div id="facebook" class="sidebar-box"> <a class="social-url" href="http://www.facebook.com/bikechattanooga" target="_blank" title="Visit Us on Facebook"><img src="/assets/images/facebook-sidebar.png" alt="Facebook Icon" /></a> <div class="fb-like" data-href="http://www.facebook.com/bikechattanooga" data-send="false" data-layout="button_count" data-width="255" data-height="22px" data-show-faces="true" data-font="segoe ui"></div> <div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) <?php echo ();?> 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>

You'll notice on the second line of the javascript area it says "<?php echo (): ?>", instead of what it should be: "if (d.getElementById(id)) {return;}". This is a javascript syntax error, but my code (as shown at the top) is not producing that! For some reason this cached copy is loading an incorrect version of this javascript. Do you have any idea why this is happening?

This happens on every new CMS page that I create in Fuel and the only way I know how to get rid of the problem is to comment out this section, but then that disables the entire facebook widget entirely. It looks like Facebook has updated their widget as well since I last used the code above, and the new version doesn't allow for the small height that I need the bar to be for this website, so that is a problem as well.

For now I'm going to have to just leave this out and link to the facebook page statically until I can find out another solution, but thought I would run this by you to see why this cache problem is occuring.

FYI, I've tried clearing my cache several times, but to no avail.

Thanks,
Erik

eriklharper

I was able to fix this problem by moving just the javascript out into the main.js file and have it load that way instead of embedding it within the page. The strange thing about this is that I have another site that uses this exact same setup and it has no problems whatsoever, so I have no idea what is making this break and not my other site.

Any case, this was a head-scratcher for me, so if you have insight it would be wonderful to know maybe why this was happening for the future. I think it is best practice anyway to load all javascript via the js() function or have it load in the header or footer files rather than the main content portions anyway, but it would be nice to know why it didn't work this way too.

Thanks,
Erik

admin

Dwoo will sometimes bomb on javascript syntax unless it is escaped. Try wrapping the javascript with a {literal}....{/literal} so it won't try and parse it.