Unable to Implement itemprop attribute into Refinery CMS - Rails 4

Question

If you're familiar with Refinery CMS - a CMS for Rails - is that I can't make schema.org attributes.

I open a page, go to edit, and state:

<figure itemscope itemtype="http://schema.org/Person">
    <img src="#" alt="Example"/>
    <figcaption>
          <span itemprop="name">Bobby Orr</span> - CEO of Example.com
    </figcaption>
</figure>

And it comes out as:

<figure>
    <img src="#" alt="Example"/>
    <figcaption>
        <span>Bobby Orr</span> - CEO of Example.com
    </figcaption>
</figure>

Does anyone know of a method to keep the schema in without Refinery removing them?

Answer 1

You can do this be adding the appropriate tags to the config.wymeditor_whitelist_tags hash in config/initializers/refinery/core.rb

This should work for your figure tag:

config.whitelist_tags = {'figure' => {'attributes' =>{ '1': 'itemscope', '2': 'itemtype'}}}

Please note that if you go this route, you will need to change how you are adding itemsope.

In your html, it will need to look like this:

<figure itemscope="itemscope" itemtype="http://schema.org/Person">

Specifically note it needs to be itemscope="itemscope" or else it will get stripped.

That is valid HTML5 according to this question: HTML5 valid itemscope

You can find more about the whitelist here: http://ugisozols.com/blog/2013/06/20/whitelisting-html-tags-and-attributes-in-refinery-cms-wymeditor/

If you have a lot of tags and you want to turn off the validation completely, you can copy over app/assets/javascripts/wymeditor/validators.js.erb into your app and comment out most of the getValidTagAttributes function like so:

  getValidTagAttributes: function(tag, attributes)
  {
    var valid_attributes = {};
    var possible_attributes = this.getPossibleTagAttributes(tag);
    var regexp_attributes = [];
    $.each((possible_attributes || []), function(i, val) {
      if (val.indexOf("*") > -1) {
        regexp_attributes.push(new RegExp(val));
      }
    });
    var h = WYMeditor.Helper;
    for(var attribute in attributes) {
      var value = attributes[attribute];
    //if(!h.contains(this.skipped_attributes, attribute) && !h.contains(this.skipped_attribute_values, value)){
    //  if (typeof value != 'function') {
    //    if (h.contains(possible_attributes, attribute)) {
    //      if (this.doesAttributeNeedsValidation(tag, attribute)) {
    //        if(this.validateAttribute(tag, attribute, value)){
    //          valid_attributes[attribute] = value;
    //        }
    //      }else{
              valid_attributes[attribute] = value;
    //      }
    //    }
    //    else {
    //      $.each(regexp_attributes, function(i, val) {
    //        if (attribute.match(val)) {
    //          valid_attributes[attribute] = value;
    //        }
    //      });
    //    }
    //  }
    //}
    }
    return valid_attributes;
  },

Please note turning off all the validation of tags like this is potentially very dangerous.