pressbooks-book
pressbooks-book copied to clipboard
"Style" element and "Scoped" attribute in image gallery feature prevents EPUB files from successfully validating
Prerequisites
- [x] Can you reproduce the behavior you wish to address with all plugins except Pressbooks deactivated?
- [x] Are you running the latest version of Pressbooks, the latest version of McLuhan, and the latest version of WordPress?
- [x] Are you experiencing the issue while using this book theme?
- [x] Did you perform a cursory search to see if your bug or enhancement is already listed?
Description
Pressbooks allows users to create image galleries using WordPress's built-in image features. Users can create a gallery from the editor by clicking Add Media and then Create Gallery from the lefthand menu in the Add Media window.
The gallery feature should function and display in all supported formats, but currently causes validation errors when exported as an EPUB. The "style" element and "scoped" attribute used to create the galleries are not valid per IDPF standards. Below is a copy of the error report that occurs when image galleries are exported to EPUB format:
ERROR(RSC-005): /srv/www/textopress.com/releases/20191220163828/web/app/uploads/sites/325/pressbooks/exports/Gallery-EPUB-Validation-Error-1576865290.epub/OEBPS/chapter-001-image-galleries.html(15,42): Error while parsing file: element "style" not allowed here; expected the element end-tag, text or element "a", "abbr", "acronym", "address", "applet", "b", "bdo", "big", "blockquote", "br", "cite", "code", "del", "dfn", "div", "dl", "em", "h1", "h2", "h3", "h4", "h5", "h6", "hr", "i", "iframe", "img", "ins", "kbd", "map", "noscript", "ns:svg", "object", "ol", "p", "pre", "q", "samp", "script", "small", "span", "strong", "sub", "sup", "table", "tt", "ul" or "var" (with xmlns:ns="http://www.w3.org/2000/svg") ERROR(RSC-005): /srv/www/textopress.com/releases/20191220163828/web/app/uploads/sites/325/pressbooks/exports/Gallery-EPUB-Validation-Error-1576865290.epub/OEBPS/chapter-001-image-galleries.html(15,42): Error while parsing file: attribute "scoped" not allowed here; expected attribute "dir", "lang", "media", "title", "xml:lang" or "xml:space"
Example: https://galleriiiiiiiies.textopress.com/
Steps to Reproduce
- From the chapter editor, click Add Media
- Select Create Gallery from the lefthand menu of the Add Media Window
- Select existing images or upload new images to your gallery, then click Create a New Gallery button
- Save chapter and export to EPUB format
Expected behavior: Gallery feature can be used in all supported formats Actual behavior: Gallery feature causes validation errors in EPUB format
Additional info: when a gallery is created in WordPress, it uses a shortcode, e.g. [gallery ids="21,22,23"]
The HTML output for galleries is typically a div with a description list inside of it containing dl, dt, and dd elements. However, it also creates and includes a separate inline style sheet :-(, e.g.
<style type="text/css">
#gallery-2 {
margin: auto;
}
#gallery-2 .gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 100%;
}
#gallery-2 img {
border: 2px solid #cfcfcf;
}
#gallery-2 .gallery-caption {
margin-left: 0;
}
/* see gallery_shortcode() in wp-includes/media.php */
</style>
In the EPUB export, these inline stylesheets also receive a scoped="scoped"
attribute.
I think this is the root of the problem here, but the issue could use further research. See https://developer.wordpress.org/reference/functions/gallery_shortcode/ and https://code.tutsplus.com/articles/the-wordpress-gallery-shortcode-a-comprehensive-overview--wp-23743 for more details.
See also https://www.isitwp.com/remove-inline-style-from-gallery-shortcode/