You are not logged in. Please login or register.
PHP Labware forum → htmLawed → Allowing Facebook mark-up
A client has asked us to implement features available within the Facebook SDK. As much as I'd rather not, it is necessary in this case.
I understand I will likely have to edit the source to allow such things as <fb:like></fb:like>. I'd like to know how this is done.
Thanks!
It won't be difficult. If you can tell me the rules regarding a couple of such custom tags, such as, whether they will have attributes, and what HTML elements (tags) can they exist within, I can post sample modification code with a bit of explanation that you can use for the rest of the custom tags.
Thanks for the quick response.
In some cases they are converted to iframes by the SDK once the DOM has been rendered. Since I still want to produce valid code, I figure they should be handled much the same as iframes are.
The Facebook syntax is as follows:
<fb:[function] attribute="value"></fb:[function]>
Where [function] is replaced by an a-z string. So yes, attributes are required.
More documentation is here:
JavaScript SDK: http://developers.facebook.com/docs/reference/javascript/
Social plugins: http://developers.facebook.com/plugins
Like buttons: http://developers.facebook.com/docs/reference/plugins/like
The Like button is a good example of the XFBML implementation. Yes, it's pretty awful when it comes to standards and what most would consider to be good, clean code.
I had a look at the usage of 'fb:like' on the Facebook site for developers. Below are suggested htmLawed code-changes to permit 'fb:like', with their logic explained. I have tested the modifications using only simple test inputs, so there might be glitches to fix. The modified codes and the relevant line-numbers in the latest version (1.1.9.4) of htmLawed are shown.
// 0. 'fb:like' is an 'empty' element, like 'img', but it requires a closing tag.
// It can't have a child element but it can have certain attributes
// (some of which are not in the HTML specification). It can be present
// within certain other HTML elements, with the parent-child nesting rules
// similar to those for 'iframe'.
// 1. Add 'fb:like' to the list of recognized elements by adding it to '$e' in line 20
$e = array(…'fb:like'=>1, …);
// 2. For adding 'fb:like' to nesting/balancing rules, modify function 'hl_bal' by
// adding 'fb:like' to two arrays in the function so 'fb:like' gets defined
// as an inline element with flow content-type; lines 147 and 157
$cF = array(…'fb:like'=>1, …);
$eI = array('fb:like'=>1, …);
// 3. In the same function, modify a reg. exp. pattern for element-name recognition
// to take care of the unusual colon (:) in 'fb:like'; in line 203
if(!preg_match('`^(/?)([a-zA-Z1-6:]+)([^>]*)>(.*)`sm', ...
// 4. For the same reason, modify another reg. exp. pattern in function 'hl_tag';
// in line 412
if(!preg_match('`^<(/?)([a-zA-Z][a-zA-Z1-6:]*)([^>]*?)\s?>$`m' ...
// 5. Modify element-attribute rules by altering the arrays in the same function;
// in line 432
static $aN = array(…'action'=>array('form'=>1, 'fb:like'=>1)…
'colorscheme'=>array('fb:like'=>1)… 'font'=>array('fb:like'=>1)…
'href'=>array('fb:like'=>1…)… 'layout'=>array('fb:like'=>1)…
'ref'=>array('fb:like'=>1)… 'show_faces'=>array('fb:like'=>1)…
'width'=>array('fb:like'=>1,…
// 6. In the same function, modify a reg. exp. pattern for attribute-name recognition
// to take care of the unusual underscore (_) in 'show_faces'; in line 459
if(preg_match('`^[a-zA-Z][_\-a-zA-Z:]+`', $a, $m)){Hey Greg,
I'm just curious, did that manage to fix your problem? I'm not really tech savvy, so I'd like to know if it works prior to messing around with the code.
I only just got around to implementing this -- but we're testing it over the next couple days. I'll include all the changes I made in my next response; I added all the Facebook social plug-ins, with exceptions for all of their various attributes.
PHP Labware forum → htmLawed → Allowing Facebook mark-up