Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Footnotes: Fix writingMode (text orientation setting) on the front #54345

Closed
wants to merge 3 commits into from

Conversation

carolinan
Copy link
Contributor

@carolinan carolinan commented Sep 11, 2023

What?

Closes #54344
Adds the missing inline styles for the writing mode (text orientation typography setting) on the front.

Why?

The setting works in the editor but not the front.

How?

Checks if the attribute for the writingMode block support is set and adds the inline styles to the block wrapper.

Testing Instructions

Activate a block theme.
The writing mode setting is disabled by default; set it to true in theme.json settings > typography > writingMode:

	"settings": {
		"typography": {
			"writingMode": true
		}
	}

Create a new post or page, and add a footnote.
Select the footnote and enable the vertical text orientation option in the typography panel.
Save and view the front.
Confirm that the text is now vertical on the front.

Screenshots or screencast

In the video, I am setting the text orientation setting to vertical:
https://github.com/WordPress/gutenberg/assets/7422055/e8a514bf-bf4a-44af-bcd1-6ebfb4502779

@carolinan carolinan added [Type] Bug An existing feature does not function as intended [Block] Footnotes Affects the Footnotes Block labels Sep 11, 2023
@carolinan carolinan marked this pull request as ready for review September 11, 2023 10:05
@carolinan carolinan marked this pull request as draft September 11, 2023 12:32
@carolinan carolinan marked this pull request as ready for review September 12, 2023 03:02
@t-hamano t-hamano self-requested a review September 17, 2023 13:22
Copy link
Contributor

@t-hamano t-hamano left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

My understanding is that, like other block supports, writing-mode style should also output inline styles automatically via the get_block_wrapper_attributes() function. Therefore, this code in the Post Navigation Link block should not be necessary in the first place.

After investigating the problem, I found that the fundamental problem was that the writing-mode was removed by the safecss_filter_attr() function in the style engine's filter_declaration method.

The safecss_filter_attr() function currently does not allow the writing-mode property.

Therefore, the ideal approach I believe would be the following:

  1. Create a lib/compat/wordpress-6.4/kses.php file and add a hook to allow the writing-mode property on the Gutenberg plugin side (For backward compatibility with WordPress versions supported by the Gutenberg plugin). Like this. However, the writing-mode support should have been added in WP6.3, so the wordpress-6.3 directory might be more appropriate.
  2. Confirm that the problem has been resolved in the Footnotes block.
  3. Remove this code in the Post Navigation Link block and verify that the problem does not occur.
  4. In the core, submit a patch to allow safe_css_filter_attr() function to allow the writing-mode property (and add unit tests).

@ramonjd @tellthemachines
I know you are all very familiar with this kind of work, so if you have any problems with these steps, please comment 🙇

@ramonjd
Copy link
Member

ramonjd commented Sep 17, 2023

@t-hamano Thanks for the ping.

Yep, those steps sound right and are consistent with past approaches, e.g., #43004 👍🏻

@t-hamano
Copy link
Contributor

Thank you for checking, @ramonjd!

@carolinan I would be happy to help you with these steps if needed 👍

@carolinan
Copy link
Contributor Author

carolinan commented Sep 18, 2023

@t-hamano Thank you. I was not happy with needing to add it this way to the PHP files, but could not figure it out. You solved it!
I read your comment yesterday but I have not had time to start working on it, so if you are able to do that, that would be great.

@t-hamano
Copy link
Contributor

  1. Create a lib/compat/wordpress-6.4/kses.php file and add a hook to allow the writing-mode property on the Gutenberg plugin side (For backward compatibility with WordPress versions supported by the Gutenberg plugin). Like this. However, the writing-mode support should have been added in WP6.3, so the wordpress-6.3 directory might be more appropriate.
  2. Confirm that the problem has been resolved in the Footnotes block.
  3. Remove this code in the Post Navigation Link block and verify that the problem does not occur.

I have submitted #54581 which achieves these three things, so I would like to close this PR.

@t-hamano t-hamano closed this Sep 19, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Footnotes Affects the Footnotes Block [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Footnotes: writingMode (text orientation) is not visible on the front
3 participants