Skip to content
This repository was archived by the owner on Jun 20, 2025. It is now read-only.

Try a few Twenty Twenty-Two child themes#292

Closed
kjellr wants to merge 11 commits intomasterfrom
add/tt2-child-themes
Closed

Try a few Twenty Twenty-Two child themes#292
kjellr wants to merge 11 commits intomasterfrom
add/tt2-child-themes

Conversation

@kjellr
Copy link
Copy Markdown
Collaborator

@kjellr kjellr commented Nov 12, 2021

ℹ️ WordPress/twentytwentytwo#213


This PR tries out some alternate color + font combinations for Twenty Twenty-Two, as mocked up in the theme's announcement post. These were originally intended to be a set of alternate color palettes and/or theme.json files, but I'm building them as child themes for the moment since Gutenberg does not include support for those features yet.

I don't expect that these will end up being child themes in the long term, but it works well for testing today.

141514397-979bf534-fc57-4e9f-8dd2-88493c041bfe

A few implementation notes:

  • I ran into an issue with Twenty Twenty-Two's default header image, and opened a PR to address it. You'll probably run into this issue while you test.
  • Font implementation is still up in the air. Ideally these would be fully defined in theme.json, but that's not possible yet. For now I took a hacky shortcut because it was easy and could plug into an existing Twenty Twenty-Two function. If for some reason these continue to be child themes, we should bundle the actual font files instead of referencing Google fonts.
  • Some themes include a slightly modified header-large-dark.html template part. These are identical to the original except they have different text and background colors assigned (for example, primary instead of foreground). This is to make the color changes a bit more noticeable on the homepage. It would be totally ok to lose this if we switch to a non-child-theme approach.
  • A few of these themes use fewer colors than are actually present in Twenty Twenty-Two. This is totally fine, except I had to declare these colors twice in order to ensure existing patterns mapped to them correctly. As a result, some colors are also listed twice in the UI, which isn't great.

⚠️ Since these are child themes, you must separately install Twenty Twenty-Two in order to test them.

@kjellr kjellr added the block-based theme A theme using HTML templates label Nov 12, 2021
@kjellr kjellr self-assigned this Nov 12, 2021
@LantosIstvan
Copy link
Copy Markdown

LantosIstvan commented Dec 10, 2021

Maybe the problem with my install, but if I enable the "Swiss" child theme, after the second refresh, the bird image is gone in the News page. Strangely, it's not effecting the "Blue" child theme.

I use this tree: https://github.com/WordPress/theme-experiments/tree/add/tt2-child-themes

I'm using the latest cloned repo from here: https://github.com/WordPress/twentytwentytwo

@kjellr
Copy link
Copy Markdown
Collaborator Author

kjellr commented Dec 10, 2021

That's odd — I'm unable to reproduce:

Screen Shot 2021-12-10 at 8 22 49 AM

@LantosIstvan
Copy link
Copy Markdown

I was able to reproduce only in Firefox. I tried in a private window also, without extensions. After refresh, the image is gone.

@LantosIstvan
Copy link
Copy Markdown

Something is definitely off, because my newly uploaded picture and the flying bird appeared in BW color until refresh. Then on the second refresh, it goes back to BW! Also in Chrome and Edge. At this point I can't verify, maybe my install causing it. The problem probably with the TT2 theme or WP 5.9 itself.

@LantosIstvan
Copy link
Copy Markdown

BTW this Black and white turning images probably a feature (it's also on your thumbnails and screenshot), but it should be documented how to turn off, because it can mess up child theme developers.

@kjellr
Copy link
Copy Markdown
Collaborator Author

kjellr commented Aug 2, 2022

Closing since versions of these launched in 6.0.

@kjellr kjellr closed this Aug 2, 2022
@kjellr kjellr deleted the add/tt2-child-themes branch August 2, 2022 16:22
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

block-based theme A theme using HTML templates

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants