Try: Sticky headers: Add "none" as a HTML tag option for template parts #48471
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
|
Size Change: +22 B (0%) Total Size: 1.33 MB
ℹ️ View Unchanged
|
|
Flaky tests detected in 6c3421d. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/4279991932
|
|
Thanks for exploring this idea @carolinan! In principle I quite like the idea of being able to remove the template part wrapper, and I think I remember discussions elsewhere where folks were thinking about it, but I can't find the issue(s) at present.
I think this sounds like it could be a potential blocker, as there have been a lot of efforts made to ensure markup consistency between the editor and site frontend, and if users can't see the sticky positioning working as expected within the site editor, the mismatch between the two environments could be confusing. What do you think? |
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?
This is a test to see if we can make it easier to add sticky headers by allowing template parts not to have a HTML tag on the front of the website.
Why?
It is tricky to update an existing site header to be sticky because sticky groups do not work when nested inside a template part (They are stickied but only inside the closest parent).
Today, to make a header sticky, you need to create a new group, make it sticky, and move the template part inside the group. Then repeat that for every template.
If the template part had no HTML tag, the group would no longer be nested, and it would stick correctly to the browser window.
How?
By adding "None" as an option to the HTML tag selection in the Advanced panel in the block settings sidebar of the template part.
By not outputting the wrapping HTML tag and block wrapper attributes for template parts on the front of the website.
This works well if the site header follows a common pattern where a group is the first element inside the template part.
The caveat is that it only works for the front, the element in the editor must not be removed, so the front and editor do not match.
Testing Instructions
Save.
Screenshots or screencast