Open sabernhardt opened 1 year ago
iframe
may be the root cause for that.I am adding the following CSS to adjust the kerning according to the language.
:lang(ja){
font-feature-settings: "palt" 0;
font-kerning:none
}
This CSS will be applied on the frontend and on non iframe editor, but not on iframe editor. I also hope the lang attribute will be added.
I started working on this in https://github.com/sabernhardt/gutenberg/pull/2/files
.rtl
class to override -rtl.css
stylesheets from the editor, so that body class should be copied to the frame.dir
attribute within the iframe
, the script needs to check whether the owner document has the attribute first.lang
attribute, the simple addition in that draft PR seems incomplete. The PHP uses the profile language for the owner document. When that matches the Site Language, inheriting the language would be correct, and language-related styles should apply just as they would for the non-framed editor. If they do not match, the iframe
might be more accurate in some situations right now.I found one set of conditions in which the mismatch between the languages for the user profile and the site (or individual post) may need special consideration when setting the lang
attribute:
lang
attribute to override those for specific languages (such as Twenty Nineteen).If the lang
attribute should wait for a better strategy, I still think the .rtl
class and dir
attribute corrections are worth making soon. If someone else could make a proper PR, I would appreciate it.
I'm reluctant to close this today as a duplicate of #52777, but the changes in #63883 hopefully will fix both issues.
Description
The iframe editor does not include a
lang
attribute, either for the site's language or for a post's language (which can be different from the main site language on multilingual sites).https://github.com/WordPress/gutenberg/blob/c7ff22ae513ecc0cdc0bda9c9fffedd53b2aee9b/packages/block-editor/src/components/iframe/index.js#L195
Accessibility Conformance rules may make an exception for embedded pages, but any styles for specific languages cannot be applied without the
lang
attribute inside theiframe
. This includes font selection in themes such as Twenty Seventeen and Twenty Nineteen (Twenty Twenty's inline style still works, though).Step-by-step reproduction instructions
html
element within theiframe
. If you do not find aniframe
, you may need to deactivate plugins. (And if you have the Custom Fields panel showing, you will need to hide that too.)html
does not have alang
attribute and thedir
attribute is empty (instead ofltr
).html
element within theiframe
again. Thehtml
does not have alang
attribute in this case either, but thedir
attribute can accurately bertl
if your profile is set to the site language.html
element within theiframe
there. As in the post editor, LTR languages have an emptydir
attribute, RTL languages havedir="rtl"
for the direction, and all lack thelang
attribute.Screenshots, screen recording, code snippet
With Twenty Nineteen, Arabic should be in Tahoma (sans-serif), but the iframe editor continues to use the serif typeface (shown in Garamond).
In left-to-right languages, the
dir
attribute is empty.Environment info
WordPress 6.3.1 with Gutenberg 16.5.1
Please confirm that you have searched existing issues in the repo.
Yes
Please confirm that you have tested with all plugins deactivated except Gutenberg.
Yes