WordPress.org

Make WordPress Core

Opened 4 years ago

Closed 4 years ago

Last modified 4 years ago

#26697 closed enhancement (fixed)

HTML5 Galleries

Reported by: obenland Owned by: nacin
Milestone: 3.9 Priority: normal
Severity: normal Version: 3.8
Component: Gallery Keywords: has-patch dev-feedback commit needs-codex
Focuses: template Cc:

Description

In 3.6 we made great strides with the introduction of HTML5 versions of the search form, the comment form, and the comment list. Let's add to this list by giving theme authors the option to add HTML5 support for image galleries!

Attachments (4)

26697.diff (1.5 KB) - added by obenland 4 years ago.
26697.2.diff (909 bytes) - added by obenland 4 years ago.
26697.3.diff (671 bytes) - added by jond3r 4 years ago.
Adding 'gallery' to the default array of types in add_theme_support()`
Kan+Xaji+qosol.jpg (11.6 KB) - added by xaajimaxaad 4 years ago.
Wordpress

Download all attachments as: .zip

Change History (29)

@obenland
4 years ago

@obenland
4 years ago

#1 @obenland
4 years ago

If we assume that HTML5 support is predominantly an issue of HTML tags, then providing that options to themes is fairly straight forward.

In 26697.diff and 26697.2.diff I proposed two ways we could achieve this, not sure which one would be more preferable. Maybe there's an even better, third, option?

#2 @lancewillett
4 years ago

  • Cc lancewillett added

#3 @SergeyBiryukov
4 years ago

  • Milestone changed from Awaiting Review to 3.9
  • Version changed from trunk to 3.8

26697.2.diff looks cleaner to me.

#4 follow-up: @DrewAPicture
4 years ago

I like 26697.2.diff better as well.

I'd like to see us remove the extract in the future too (I think there's a ticket around here somewhere for that).

#5 in reply to: ↑ 4 @SergeyBiryukov
4 years ago

Replying to DrewAPicture:

I'd like to see us remove the extract in the future too (I think there's a ticket around here somewhere for that).

See #22400.

#6 @nacin
4 years ago

  • Component changed from Themes to Gallery
  • Focuses template added

Cool :-)

#7 @DrewAPicture
4 years ago

  • Keywords commit added

This ticket was mentioned in IRC in #wordpress-dev by obenland. View the logs.


4 years ago

#9 @nacin
4 years ago

  • Owner set to nacin
  • Resolution set to fixed
  • Status changed from new to closed

In 27302:

Introduce HTML5 gallery support.

When a theme supports HTML5 galleries via add_theme_support( 'html5', 'gallery' ), figure and figcaption will be used instead of definition list markup.

props obenland.
fixes #26697.

#10 @jond3r
4 years ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

This is a great addition.

However, to make the feature somewhat more visible, consider adding 'gallery' to the default array of types in the add_theme_support() function.

By this change it would be possible to get HTML5 galleries by issuing add_theme_support( 'html5' ).

The drawback is that this would be detrimental to backwards compatibility. It is possibly a worth-while change anyway considering the increased visibility of the feature?

A patch is attached.

@jond3r
4 years ago

Adding 'gallery' to the default array of types in add_theme_support()`

#11 @jond3r
4 years ago

I just checked that twentythirteen and twentyfourteen use

add_theme_support( 'html5', array( 'search-form', 'comment-form', 'comment-list' ) );

so they are not affected by any backward-compatibility problems.

#12 follow-up: @nacin
4 years ago

  • Resolution set to fixed
  • Status changed from reopened to closed

add_theme_support( 'html5' ) was never supposed to be allowed, as it would prevent us from adding new things (it's not forwards compatible). You were always supposed to need to pass an array, but it was a mistake in 3.6. Maybe we can increase _doing_it_wrong() usage in add_theme_support() to cover that implicitness isn't allowed. That would be a new ticket, however.

#13 follow-up: @nacin
4 years ago

In 27396:

Do not output default gallery styles if the theme has opted into HTML5 galleries.

fixes #27045. see #26697.

#14 in reply to: ↑ 12 @jond3r
4 years ago

Replying to nacin:

That would be a new ticket, however.

See #27278.

#15 in reply to: ↑ 13 ; follow-up: @ScottSmith
4 years ago

Replying to nacin:

In 27396:

Do not output default gallery styles if the theme has opted into HTML5 galleries.

fixes #27045. see #26697.

I'm a little unclear on what changes should be expected for themes adding support for HTML 5 galleries in the wake of 27396. Should devs copy the gallery_shortcode function into their themes or is there a less drastic way of still utilizing the default styles?

#16 in reply to: ↑ 15 ; follow-up: @SergeyBiryukov
4 years ago

  • Keywords needs-codex added

Replying to ScottSmith:

Should devs copy the gallery_shortcode function into their themes or is there a less drastic way of still utilizing the default styles?

Theme developers should add gallery to the list of elements they want to use HTML5 markup for:

add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery' ) );

Just noticed that Codex needs an update to reflect this change:
http://codex.wordpress.org/Function_Reference/add_theme_support#HTML5

#17 in reply to: ↑ 16 ; follow-up: @ScottSmith
4 years ago

Replying to SergeyBiryukov:

Replying to ScottSmith:

Should devs copy the gallery_shortcode function into their themes or is there a less drastic way of still utilizing the default styles?

Theme developers should add gallery to the list of elements they want to use HTML5 markup for:

add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery' ) );

Just noticed that Codex needs an update to reflect this change:
http://codex.wordpress.org/Function_Reference/add_theme_support#HTML5

I recognize that, but how are theme developers anticipated to support gallery short code styling again, now that Core doesn't print the styles for free? Are theme developers supposed to copy the gallery_shortcode function, modify it, and put it into their themes? Or is there a more sane way of supporting galleries?

#18 in reply to: ↑ 17 ; follow-up: @cramdesign
4 years ago

Replying to ScottSmith:

I recognize that, but how are theme developers anticipated to support gallery short code styling again, now that Core doesn't print the styles for free? Are theme developers supposed to copy the gallery_shortcode function, modify it, and put it into their themes? Or is there a more sane way of supporting galleries?

WordPress will still print gallery styles as it always has. You won't need to copy the shortcode function to your theme. However, if you are using add_theme_support( 'html5', array('gallery')), the easiest way to support the gallery, that is to style it like a grid or whatever, will be to add the gallery styles to your css file.

If I understand this change to core correctly, you aren't required to use the html5 gallery and the old gallery shortcode will still output as it always has.

#19 in reply to: ↑ 18 ; follow-up: @ScottSmith
4 years ago

Replying to cramdesign:

Replying to ScottSmith:

I recognize that, but how are theme developers anticipated to support gallery short code styling again, now that Core doesn't print the styles for free? Are theme developers supposed to copy the gallery_shortcode function, modify it, and put it into their themes? Or is there a more sane way of supporting galleries?

WordPress will still print gallery styles as it always has. You won't need to copy the shortcode function to your theme. However, if you are using add_theme_support( 'html5', array('gallery')), the easiest way to support the gallery, that is to style it like a grid or whatever, will be to add the gallery styles to your css file.

If I understand this change to core correctly, you aren't required to use the html5 gallery and the old gallery shortcode will still output as it always has.

Right, but using CSS to layout the gallery would effectively break the user's ability to specify how many columns they want for their gallery. I don't think this ramification was taken into account before this functionality was removed.

#20 in reply to: ↑ 19 ; follow-up: @obenland
4 years ago

Replying to ScottSmith:

Right, but using CSS to layout the gallery would effectively break the user's ability to specify how many columns they want for their gallery.

Not at all, theme authors just need to style it correctly. See Twenty Thirteen for example.

And if they "don't have the time" to do it right, they still have the option to do the following to keep using core styles:
add_filter( 'use_default_gallery_style', '__return_true' );

#21 in reply to: ↑ 20 @ScottSmith
4 years ago

Replying to obenland:

Replying to ScottSmith:

Right, but using CSS to layout the gallery would effectively break the user's ability to specify how many columns they want for their gallery.

Not at all, theme authors just need to style it correctly. See Twenty Thirteen for example.

And if they "don't have the time" to do it right, they still have the option to do the following to keep using core styles:
add_filter( 'use_default_gallery_style', '__return_true' );

Fantastic. This assuages my concerns. Thanks for helping me out (and hopefully I'm not the only person wondering about this.)

#22 @nacin
4 years ago

In 27668:

Introduce HTML5 caption support.

When a theme supports HTML5 captions via add_theme_support( 'html5', 'caption' ), figure and figcaption will be used instead of div and p.

There's a bonus. But first, some history: Captions were introduced with an inline style set for the container. This remains, as it is there to force captions to wrap. But this inline style included an extra 10 pixels, which have vexxed theme developers for years. While these pixels were designed to ensure padding around floated images, modern themes handle this with grace. The additional pixels thus feel encumbering.

As the new HTML5 gallery support avoids outputting default gallery styles (again, irking theme developers for years; see #26697), the new HTML5 caption support will also ditch these 10 pixels of unwanted hand-holding.

The 10 pixels are also removed entirely in the visual editor (and more styles may also disappear here; see #26642), giving themes the power necessary to match the frontend styles.

The filter img_caption_shortcode_width added in 3.7 to work around this madness (see #14380) is skipped entirely when the theme supports HTML5 captions.

props obenland, azaozz.
see #26642. also fixes #9066.

#23 @lancewillett
4 years ago

In 27763:

Twenty Thirteen and Fourteen: implement HTML5 markup for galleries (see #26697) and captions (see #26642). Props obenland, closes #27502.

@xaajimaxaad
4 years ago

Wordpress

#24 @nacin
4 years ago

In 27914:

Remove <br> elements for HTML5 galleries.

props obenland.
fixes #27637, see #26697.

#25 @tar.gz
4 years ago

Simply awesome. Can we say this also fixes #10734 ?

Note: See TracTickets for help on using tickets.