PrettyPhoto rel attribute validation error

Question

The W3C validator seems to return a validation error for the prettyPhoto rel attribute for HTML5 pages. How to solve this error?

The prettyPhoto [gallery1] bad value for the rel attribute on element a: The prettyphoto [gallery1] keyword was not registered.

Thank you very much!

Answer 1

Using the rel attribute with non-suggested (and thus invalid) values ​​is invalid for HTML5 markup. prettyPhoto not in the list of suggested values. Thus, you may have difficulty getting your webpage with image gallery check.

Possible Solution:

• Open jquery.prettyPhoto.js (presumably not limited) and execute the search and replace function of your text editor: replace all occurrences of attr('rel') with attr('data-gal') .

• In your gallery code use:
  
  data-gal="prettyPhoto[galname]"
  
  instead:
  
  rel="prettyPhoto[galname]"

• Initialize your prettyPhoto with:
  
  jQuery("a[data-gal^='prettyPhoto']").prettyPhoto();
  
  And you're on the right track to get the code, really!

You can also read this article with this possible solution.

Answer 2

You can use the (undocumented) hook parameter as mentioned in the comments here .

Indicate your links as follows: <a href="img.jpg" data-gal="prettyPhoto[gal]"></a> and use $("a[data-gal^='prettyPhoto'").prettyPhoto({hook: 'data-gal'}); to initialize prettyPhoto.

Answer 3

You can also fix this by updating the settings to use the hook class:

 s = jQuery.extend({ ... hook: "rel", animation_speed: "fast", ajaxcallback: function() {}, slideshow: 5e3, autoplay_slideshow: false, opacity: .8, ... 

to:

 s = jQuery.extend({ ... hook: "class", ...