Error parsing XML : The reference to entity “version” must end with the ';' delimiter [duplicate]

Question

This question already has an answer here:

• The reference to entity “foo” must end with the ';' delimiter 1 answer

I'm fairly new to this, so sorry if this is a simple question.

I'm trying to install the FB like box onto my website www.thehungryeurasian.com

However, when I try inserting the Javascript SDK:

<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/sdk.js#xfbml=1&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

The following error comes up:

Error parsing XML, line 884, column 64:
The reference to entity "version" must end with the ';' delimiter.

Answer 1

It looks like something is interpreting your document as XML rather than HTML. XML is much stricter than HTML - one of the rules is that ampersands (&) have a special meaning. They mean "here comes an XML entity", which is a special character. For instance, you can type " to insert ", or > to insert > into your document.

In this case, your code is interpreting &version on line 6 as the start of one of these entities. If you update line 6 as follows:

js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.0";

Then you should find that error disappears.

Answer 2

Just had this issue myself. The answer above did not fix the problem. The Facebook buttons do not load. Below is the fix I implemented to resolve both the 500 error presented on the server and then allow for proper loading of the Buttons.

The problem is that if you are using something like Thymeleaf which uses XML. The HTML added to a page must be properly formed. The & will cause the page load to fail with a 500 error if the current version is used within a page.

Current method of including the Javascript SDK for a button. Follow Us, Like etc...

    <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/sdk.js#xfbml=1&version=v2.3";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

Enhancement needed to work with the more strict XML checking. This enhancement will allow for the proper escaping of the XML data and commenting the CDATA works for older browsers.

<div id="fb-root"></div>
<script>
/* <![CDATA[ */
    (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/sdk.js#xfbml=1&version=v2.3";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
/* ]]> */
</script>

Answer 3

Did you place the code right under the tag? Because thats where it needs to be placed.