Allow custom CSS for theme.json elements #55614
Open
+33
−1
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
I am taking this out of #49396 while work continues on the block style variations separately. |
|
This pull request has changed or added PHP files. Please confirm whether these changes need to be synced to WordPress Core, and therefore featured in the next release of WordPress. If so, it is recommended to create a new Trac ticket and submit a pull request to the WordPress Core Github repository soon after this pull request is merged. If you're unsure, you can always ask for help in the #core-editor channel in WordPress Slack. Thank you! ❤️ View changed files❔ lib/class-wp-theme-json-gutenberg.php |
|
Size Change: -292 B (0%) Total Size: 1.71 MB
ℹ️ View Unchanged
|
|
Flaky tests detected in 4712384. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/7898030046
|
aristath
reviewed
Nov 8, 2023
Co-authored-by: Ari Stathopoulos <aristath@gmail.com>
bph
added
Global Styles
|
@aaronrobertshaw @tellthemachines |
|
Thanks for the ping 👍
If I understand it correctly, the addition of the custom CSS shouldn't be an issue. The selector it is added to the ruleset under though might just need a tweak to match what is settled on in #57841.
The goal is to land #57841 for 6.5 and this would only need a minor tweak I think if #57841 does get merged, so I don't know that it should be punted just yet. Happy to defer to @tellthemachines though 🙂 |
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
|
#57841 is not planned for 6.5. But his seems to have been removed from the 6.5 editor task board without comment, I suppose that confirms it is punted. |
|
Correction, the issue is moved to the 6.6 board: not the PR: |
Remove the unused stylesheet variable in get_block_custom_css_nodes() and use the block_nodes array.
|
@tellthemachines @aaronrobertshaw With the changes in #58991, The inline docs can be updated to reflect that it is not only block nodes that are returned; but for clarity and perhaps for future proofing, would it be better to use two separate methods? Or, if they don't need to be separate methods, can we make the if statements neutral to the type, and make one if statement work for both blocks and elements? |
|
@carolinan that's a great question! Based on @oandregal's recent feedback , I was considering refactoring those functions in |
|
@carolinan @tellthemachines what're the remaining blockers for this? Seems like a nice improvement to meet expectations on this front. |
|
What are the plans or expectations for custom CSS for elements when it comes to the extended block style variations within #57908? I expect we'll want them there too but given the complexity of that work already, do we have any leeway to hold off here until that lands? |
I suppose the expectation is that
Yes, let's land #57908. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What?
Enables CSS in theme.json styles > elements > CSS
Closes #48439
Why?
Custom CSS under theme.json styles.elements is not working, even though the schema says it works.
How?
Updates
class WP_Theme_JSON_Gutenbergwith a condition that checks if there are any items under styles > elements, locates custom css, and adds it to the custom CSS stylesheet.Updates the global styles output to loop through the elements, locate the CSS, and add the css to the styles array.
Testing Instructions
Activate Twenty Twenty-Three or Twenty Twenty-Four.
In theme.json, under styles > elements > heading, add the following as the first object:
"css": "border:3px solid orange;",Example from TT4:
Next, open the Site editor, block editor, and the front of the website and confirm that headings have an orange border.
Screenshots or screencast