WordPress.org

Make WordPress Core

Opened 6 months ago

Closed 4 months ago

#45274 closed defect (bug) (fixed)

Bundled Themes: Added Gutenberg support should include theme support for responsive embeds

Reported by: laurelfulford Owned by: laurelfulford
Milestone: 5.0 Priority: normal
Severity: normal Version: 5.0
Component: Bundled Theme Keywords: has-patch has-screenshots commit dev-reviewed fixed-5.0
Focuses: Cc:

Description

All responsive default themes (Twenty Eleven up through Twenty Seventeen) need to include support for responsive embeds in their Gutenberg support. Otherwise, blocks like the YouTube embed block will appear as the wrong aspect ratio on smaller screens.

Support can be added with add_theme_support( 'responsive-embeds' );.

Attachments (15)

45274.patch (3.8 KB) - added by laurelfulford 6 months ago.
twentyeleven-youtube-embed-block-before.png (98.4 KB) - added by laurelfulford 6 months ago.
Twenty Eleven with a YouTube embed on an iPhone 6 - before
twentytwelve-youtube-embed-block-before.png (83.2 KB) - added by laurelfulford 6 months ago.
Twenty Twelve with a YouTube embed on an iPhone 6 - before
twentythirteen-youtube-embed-block-before.png (113.9 KB) - added by laurelfulford 6 months ago.
Twenty Thirteen with a YouTube embed on an iPhone 6 - before
twentyfourteen-youtube-embed-block-before.png (77.7 KB) - added by laurelfulford 6 months ago.
Twenty Fourteen with a YouTube embed on an iPhone 6 - before
twentyfifteen-youtube-embed-block-before.png (91.0 KB) - added by laurelfulford 6 months ago.
Twenty Fifteen with a YouTube embed on an iPhone 6 - before
twentysixteen-youtube-embed-block-before.png (102.3 KB) - added by laurelfulford 6 months ago.
Twenty Sixteen with a YouTube embed on an iPhone 6 - before
twentyseventeen-youtube-embed-block-before.png (76.6 KB) - added by laurelfulford 6 months ago.
Twenty Seventeen with a YouTube embed on an iPhone 6 - before
twentyeleven-youtube-embed-block-after.png (86.6 KB) - added by laurelfulford 6 months ago.
Twenty Eleven with a YouTube embed on an iPhone 6 - after
twentytwelve-youtube-embed-block-after.png (68.6 KB) - added by laurelfulford 6 months ago.
Twenty Twelve with a YouTube embed on an iPhone 6 - after
twentythirteen-youtube-embed-block-after.png (86.3 KB) - added by laurelfulford 6 months ago.
Twenty Thirteen with a YouTube embed on an iPhone 6 - after
twentyfourteen-youtube-embed-block-after.png (68.9 KB) - added by laurelfulford 6 months ago.
Twenty Fourteen with a YouTube embed on an iPhone 6 - after
twentyfifteen-youtube-embed-block-after.png (72.3 KB) - added by laurelfulford 6 months ago.
Twenty Fifteen with a YouTube embed on an iPhone 6 - after
twentysixteen-youtube-embed-block-after.png (70.2 KB) - added by laurelfulford 6 months ago.
Twenty Sixteen with a YouTube embed on an iPhone 6 - after
twentyseventeen-youtube-embed-block-after.png (75.6 KB) - added by laurelfulford 6 months ago.
Twenty Seventeen with a YouTube embed on an iPhone 6 - after

Download all attachments as: .zip

Change History (20)

@laurelfulford
6 months ago

Twenty Eleven with a YouTube embed on an iPhone 6 - before

@laurelfulford
6 months ago

Twenty Twelve with a YouTube embed on an iPhone 6 - before

@laurelfulford
6 months ago

Twenty Thirteen with a YouTube embed on an iPhone 6 - before

@laurelfulford
6 months ago

Twenty Fourteen with a YouTube embed on an iPhone 6 - before

@laurelfulford
6 months ago

Twenty Fifteen with a YouTube embed on an iPhone 6 - before

@laurelfulford
6 months ago

Twenty Sixteen with a YouTube embed on an iPhone 6 - before

@laurelfulford
6 months ago

Twenty Seventeen with a YouTube embed on an iPhone 6 - before

@laurelfulford
6 months ago

Twenty Eleven with a YouTube embed on an iPhone 6 - after

@laurelfulford
6 months ago

Twenty Twelve with a YouTube embed on an iPhone 6 - after

@laurelfulford
6 months ago

Twenty Thirteen with a YouTube embed on an iPhone 6 - after

@laurelfulford
6 months ago

Twenty Fourteen with a YouTube embed on an iPhone 6 - after

@laurelfulford
6 months ago

Twenty Fifteen with a YouTube embed on an iPhone 6 - after

@laurelfulford
6 months ago

Twenty Sixteen with a YouTube embed on an iPhone 6 - after

@laurelfulford
6 months ago

Twenty Seventeen with a YouTube embed on an iPhone 6 - after

#1 @davidakennedy
6 months ago

  • Keywords commit added; needs-testing removed

@laurelfulford Thanks for catching this! I tested, and the patch works as expected. Marking this ready to go.

#2 @pento
6 months ago

  • Keywords dev-reviewed added

👍🏻

#3 @laurelfulford
6 months ago

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

In 43868:

Bundled Themes: Add theme support for responsive embeds

Add add_theme_support( 'responsive-embeds' ); to all of the responsive default themes as part of their Gutenberg support. This makes sure any embeds coming from the new block-based editor maintain their aspect ratios at different screen sizes.

Fixes #45274.

#4 @SergeyBiryukov
6 months ago

  • Keywords fixed-5.0 added
  • Resolution fixed deleted
  • Status changed from closed to reopened

Reopening for trunk.

#5 @desrosj
4 months ago

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

In 44227:

Bundled Themes: Add theme support for responsive embeds

Add add_theme_support( 'responsive-embeds' ); to all of the responsive default themes as part of their block editor support. This makes sure any embeds coming from the new block-based editor maintain their aspect ratios at different screen sizes.

Merges [43868] into trunk.

Props laurelfulford.
Fixes #45274.

Note: See TracTickets for help on using tickets.