WordPress.org

Make WordPress Core

Opened 4 years ago

Closed 20 months ago

Last modified 20 months ago

#40103 closed defect (bug) (fixed)

Twenty Seventeen: Blockquotes aligned right are not behaving as expected

Reported by: laurelfulford Owned by: laurelfulford
Milestone: 5.1 Priority: normal
Severity: normal Version:
Component: Bundled Theme Keywords: has-patch commit
Focuses: Cc:

Description

When you align a blockquote to the right and have assigned sidebar widgets, Twenty Seventeen should be placing the blockquote fully in the right sidebar.

This currently isn’t working until you resize the browser window. There’s some JavaScript in the theme used to make sure the sidebar isn’t too long before moving over the blockquote - right not it looks like it's only firing on resize, but not on page load.

Here’s how a single post currently looks with an aligned right blockquote and a sidebar widget:

https://cldup.com/MudPXRobwl-3000x3000.png

When the browser is resized, the blockquote is moved to its correct location:

https://cldup.com/ygEYYBp6Bv-3000x3000.png

Attachments (1)

40103.patch (593 bytes) - added by laurelfulford 4 years ago.
Add fix so also fires JavaScript event that determines if blockquote can be moved on page load.

Download all attachments as: .zip

Change History (14)

@laurelfulford
4 years ago

Add fix so also fires JavaScript event that determines if blockquote can be moved on page load.

#1 @laurelfulford
4 years ago

  • Keywords has-patch added

#2 @davidakennedy
3 years ago

  • Milestone changed from Awaiting Review to 5.0

#3 @laurelfulford
2 years ago

  • Keywords needs-testing added

#4 @pento
23 months ago

  • Milestone changed from 5.0 to 5.0.1

#5 @laurelfulford
22 months ago

  • Milestone changed from 5.0.1 to 5.0.2

#6 @laurelfulford
22 months ago

  • Milestone changed from 5.0.2 to 5.1

#7 @desrosj
20 months ago

I'm having some issues testing this. Before applying the patch, I can't get blockquotes to move to the sidebar at all (even when resizing my browser window). The patch in my testing does not fix the alignment in either situation (on load or when resizing).

#8 @laurelfulford
20 months ago

Thanks for testing this, @desrosj!

It looks like the issue is that this ticket only covers the behaviour of the blockquote in the classic block or classic editor.

The quote block should ideally be styled/act the same though -- that's a good catch! I've created a new issue for that here: https://core.trac.wordpress.org/ticket/46049

Does the patch work when using the classic block?

#9 @desrosj
20 months ago

I tried creating a new post using the Classic Editor plugin and with the block editor using a classic block. Both produced the same results I detailed above.

#10 @laurelfulford
20 months ago

Thanks @desrosj!

In testing this again, I was flubbing the actual steps to recreate these styles -- it looks like they do work on the quote blocks, too.

For the classic editor/block, you have to add the blockquote, then edit the HTML to add class="alignright".

For the quote block, rather than aligning the text right (which I was doing too!), you have to add the class alignright to the "Additional CSS Class" field under the Advanced panel.

Let me know if this still doesn't work -- it's definitely not helping that I've confused the steps to recreate, too!

#11 @desrosj
20 months ago

  • Keywords commit added; needs-testing removed

@laurelfulford Gotcha! Ok, I am able to reproduce this now.

Your fix works as expected!

I did notice a separate issue that I will open a new ticket for. When using the Customizer, if a new widget is introduced into the sidebar, it is not rechecked for "emptiness".

#12 @laurelfulford
20 months ago

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

In 44679:

Twenty Seventeen: Update blockquote alignment on load.

The theme uses JavaScript to check if a right-aligned blockquote is below the sidebar content before pushing it outside of the content area. This was originally only firing on browser resize.

Fixes #40103.

#13 @laurelfulford
20 months ago

Thanks for the testing, @desrosj!

Note: See TracTickets for help on using tickets.