Hi, I've spent the day validating my site and it's been eye-opening and satisfying to remove errors one by one. However, one problem remains, and I just can't figure it out. I get the error...:
Error Line 1202, Column 8: entity end not allowed in processing instruction
plus 10 more which I'm 90% sure follow from the above. Via googling I found this advice:
Somewhere towards the beginning of the file, you have started a
processing instruction with the sequence "<?", *without* ending it with
the sequence "?>".
My guess is that you have a malformed xml declaration.
And sure enough, I do have some xml by my Facebook like boxes. (My co-admin put the code there.) I've tried to understand how to fix it, but I've given up. Can someone out there spot the problem for me?
Here is the page itself if the above link to the W3 validation output doesn't work.
This is outside my area of
This is outside my area of expertise, but try this at line 438:
<?XML:NAMESPACE PREFIX = FB ?>
Or, maybe it should be:
<?XML:NAMESPACE PREFIX = FB <FB:LIKE-BOX width="292" header="true" stream="false" show_faces="true" colorscheme="light" href="http://www.facebook.com/?ref=logo#!/pages/celebritytypescom/118151358256086"></FB:LIKE-BOX> ?>
Couldn't you simply use an iframe?
cheers,
gary
I tried both solutions and
I tried both solutions and unfortunately they both incur the wrath of the validator. Thanks for the suggestions all the same, Gary!
I have looked up the Facebook code myself now, and Facebook provides these two possibilities...:
1
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2Fcelebritytypescom%2F118151358256086&width=292&colorscheme=light&show_faces=true&border_color&stream=false&header=true&height=62" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:62px;" allowTransparency="true"></iframe>
2
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like-box href="http://www.facebook.com/pages/celebritytypescom/118151358256086" width="292" show_faces="true" border_color="" stream="false" header="true"></fb:like-box>
... neither of which work when I insert them into my code! I asked my coadmin (who is no more tech-savvy than I am):
Me: "So I see our Facebook like box code is different from what's provided by Facebook - what's up with that? Did you add the xml part?"
Coadmin: "I may have googled and tweaked it to make it work but it's been so long I don't remember."
Note that when he says 'work', he means work on our old, FrontPage-generated page the code of which is sure to keep you up at night so check it out at your own caution! We have never validated our code until now that I'm trying to code the site in CSS myself and have discovered that validating my code is necessary before e.g. posting a thread in this forum about why my lovely table looks deformed in Chrome and Safari.
So I guess I'm no closer to a solution than before. Any other ideas?
You been back to the
You been back to the Farcebook API developers pages to check thus should use one or other of the examples one of which must work but as for validating most API code is simply gibberish and farcebook more so than others forget validating it, most pages nowadays are simply never ever going to validate unless you cheat and use the so called HTML5 DTD which the W3C validator can't run against.
Other than that I enjoyed the page and was most distracted from matters at hand so many personalities that I have always held as people of note and importance.
Hi Hugo, my post above was
Hi Hugo, my post above was approved after you made yours. Happy to hear the site could distract you from your work!
I have tried inserting each of the pieces of code that Facebook provides, and neither one works. Here is the iframe code:
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2Fcelebritytypescom%2F118151358256086&width=292&colorscheme=light&show_faces=true&border_color&stream=false&header=true&height=62" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:62px;" allowTransparency="true"></iframe>
The unsatisfactory result can be seen here to the bottom right of John Adams in the third row of the table. I have googled for hours (and tried changing the 'allowTransparency' attribute to 'allowtransparency' and also tried removing it altogether; neither tweak worked) without figuring out how to get the box to render properly. What gives? (
The following works for me —
The following works for me — well, it does something, anyway. Like button?
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2Fcelebritytypescom%2F118151358256086" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:62px;" allowTransparency="true"></iframe>
cheers,
gary
Hi Gary, thanks so much for
Hi Gary, thanks so much for that better-than-nothing solution! I'm still hoping to be able to display the larger like box with the faces of some of those who like the page, but if I don't succeed, we'll be using this.
Not that I know anything
Not that I know anything about FB buttons; it looks to me like that's the size of the button. I mean, the iframe's source is their button plugin. If you can make the changes you want, it may be you have to do it at that end. You can change the size of the iframe, but making it show something beyond the button is another story, best told from the FB side.
Have you considered putting the iframe within the list item that includes the pic and text?
cheers,
gary
Oh! There are a few
Oh! There are a few features missing in your code that were in the iframe I posted though:
header=true
stream=false
showfaces=true
and a border attribute without a value (since I didn't select a border color)
I've tried to add the above attributes to the code you posted, but I didn't succeed in getting it to render. I would be very appreciative if you would show me where they go!
I have no idea where they go.
I have no idea where they go. The FB instructions showed only the ref url, and as you noticed, it breaks when added as you originally had it. Try them as iframe attributes. E.G.
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2Fcelebritytypescom%2F118151358256086" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:62px;" allowTransparency="true" colorscheme="light" show_faces="true" stream="false" header="true"></iframe>

Is there not a FB forum? This question is really very application specific. We have a social/cms forum for css questions (which this is not), but some FB specialists may hang out there. I am moving this thread to that sub-forum.
cheers,
gary
Hi Gary, thanks for your
Hi Gary, thanks for your benevolence! You're absolutely right; I should take this issue (alas, the code you provided shows only the small button still) to the Facebook forum. Sorry, I guess I was too fixated on getting to post this thread to remember where I was. : [Edit: Uh, that was supposed to be the blushing smiley...?] Ironically, this thread yielded more help than the other one (0 replies so far) which I do believe is actually appropriate for the forum!
Thanks again.