Wp-calypso: Full Site Editing: Estimate how long it would take to support FSE flows for template first themes [2]

Created on 26 Aug 2019  路  4Comments  路  Source: Automattic/wp-calypso

This is a task for estimation only! Please timebox this task to 2 days

Known Technical Tasks:

Tidying up Logic on eligible/active:

New themes to audit for needed header/footer content and fidelity between Edit/Publish views:

  • [ ] Shawburn (Launching on Aug. 29th)
  • [ ] Rivington (Launching on Aug. 29th)
  • [ ] Balasana (Launching on Aug. 29th)
  • [ ] Maywood (Launching on Aug. 29th)
  • [ ] Alves
  • [ ] Exford
  • [ ] Rockfield
  • [ ] Stratford
  • [ ] Coutoire
  • [ ] Morden
  • [ ] Stow
  • [ ] Hever
  • [ ] Leven
  • [ ] Brompton
  • [ ] Redhill
  • [ ] ( @iamtakashi feel free to edit if y'all have more planned)
[Goal] Full Site Editing [Type] Task

Most helpful comment

I've run a quick-ish audit of the Varia-based themes listed here and these are my findings.

Most themes look straightforward enough to make FSE-ready, with just some relatively minor tweaks on the styles (e.g. make sure the colors are correct, and the navigation menus look good in both header and footer) or the overridden files (we need to add some FSE code to render the template blocks instead of the original theme parts).
Some of them, marked with a 鈿狅笍, will be more challenging.

Many of these themes have an headstart folder. I don't know its purpose and have no idea of its implications with FSE, if any.

This said, without actually starting to add FSE support to these themes, it's quite hard to identify possible unforeseen complications (e.g. style overrides that could conflict with Gutenberg).

Maywood

  • Navigation Menu: only in the header.
  • Footer: only contains the site title.

Alves

  • Header: 2 columns responsive.
  • Navigation Menu: different in header and footer.
  • Footer: 2 columns.
  • Overrides: footer.php, but it looks identical to the Varia one, so we might be able to delete it.

Exford

  • Footer: 2 columns responsive.
  • Headstart: yes.

鈿狅笍 Rockfield

  • Header: 2 columns; inverted colors; inline site title and description which disappears on small screens.
    This might be hard to replicate in the editor.
  • Overrides: header.php and footer.php.
  • Headstart: yes.

Stratford

  • Header: 2 columns; no site description.
  • Navigation Menu: only in the header.
  • Overrides: header.php and footer.php.
  • Headstart: yes.

鈿狅笍 Coutoire

  • Header: 2 columns; no space between site title and tescription.
    They will look different in the editor: we can't remove the blocks' vertical margin as it would misplace the Inserter button.
  • Navigation Menu: different in header and footer.
  • Footer: 2 columns responsive.
  • Overrides: header.php.
  • Headstart: yes.

Morden

  • Header: 2 columns responsive; inverted colors.
  • Footer: 2 columns responsive.
  • Overrides: header.php.
  • Headstart: yes.

Stow

  • Navigation Menu: different in header and footer; in the header is full width with a pink background.
  • Footer: 2 columns responsive.
  • Overrides: header.php.
  • Headstart: yes.

Hever

  • Header: 2 columns responsive.
  • Footer: 2 columns responsive.
  • Headstart: yes.

Leven

  • Header: 2 columns.
  • Footer: 2 columns responsive.
  • Headstart: yes.

鈿狅笍 Brompton

  • Header: 3 columns responsive; inverted colors; colored borders.
    Has a circle larger than the container that overlaps both the content below and the padding above. I expect it won't be easy to recreate in the editor.
  • Navigation Menu: only in the header.
  • Footer: inverted colors; colored borders; only contains the site title.
  • Overrides: footer.php.
  • Headstart: yes.

Redhill

  • Navigation Menu: only in the header.
  • Footer: only contains the site title.
  • Headstart: yes.

All 4 comments

I've run a quick-ish audit of the Varia-based themes listed here and these are my findings.

Most themes look straightforward enough to make FSE-ready, with just some relatively minor tweaks on the styles (e.g. make sure the colors are correct, and the navigation menus look good in both header and footer) or the overridden files (we need to add some FSE code to render the template blocks instead of the original theme parts).
Some of them, marked with a 鈿狅笍, will be more challenging.

Many of these themes have an headstart folder. I don't know its purpose and have no idea of its implications with FSE, if any.

This said, without actually starting to add FSE support to these themes, it's quite hard to identify possible unforeseen complications (e.g. style overrides that could conflict with Gutenberg).

Maywood

  • Navigation Menu: only in the header.
  • Footer: only contains the site title.

Alves

  • Header: 2 columns responsive.
  • Navigation Menu: different in header and footer.
  • Footer: 2 columns.
  • Overrides: footer.php, but it looks identical to the Varia one, so we might be able to delete it.

Exford

  • Footer: 2 columns responsive.
  • Headstart: yes.

鈿狅笍 Rockfield

  • Header: 2 columns; inverted colors; inline site title and description which disappears on small screens.
    This might be hard to replicate in the editor.
  • Overrides: header.php and footer.php.
  • Headstart: yes.

Stratford

  • Header: 2 columns; no site description.
  • Navigation Menu: only in the header.
  • Overrides: header.php and footer.php.
  • Headstart: yes.

鈿狅笍 Coutoire

  • Header: 2 columns; no space between site title and tescription.
    They will look different in the editor: we can't remove the blocks' vertical margin as it would misplace the Inserter button.
  • Navigation Menu: different in header and footer.
  • Footer: 2 columns responsive.
  • Overrides: header.php.
  • Headstart: yes.

Morden

  • Header: 2 columns responsive; inverted colors.
  • Footer: 2 columns responsive.
  • Overrides: header.php.
  • Headstart: yes.

Stow

  • Navigation Menu: different in header and footer; in the header is full width with a pink background.
  • Footer: 2 columns responsive.
  • Overrides: header.php.
  • Headstart: yes.

Hever

  • Header: 2 columns responsive.
  • Footer: 2 columns responsive.
  • Headstart: yes.

Leven

  • Header: 2 columns.
  • Footer: 2 columns responsive.
  • Headstart: yes.

鈿狅笍 Brompton

  • Header: 3 columns responsive; inverted colors; colored borders.
    Has a circle larger than the container that overlaps both the content below and the padding above. I expect it won't be easy to recreate in the editor.
  • Navigation Menu: only in the header.
  • Footer: inverted colors; colored borders; only contains the site title.
  • Overrides: footer.php.
  • Headstart: yes.

Redhill

  • Navigation Menu: only in the header.
  • Footer: only contains the site title.
  • Headstart: yes.

Awesome, thanks @Copons for the investigation!

Many of these themes have an headstart folder. I don't know its purpose and have no idea of its implications with FSE, if any.

@iamtakashi, @michaeldcain, and maybe @obenland and idea of what these do?

Headstart is used to populate a new site that's created from the logged out Showcase and the activation bar at the top of the demo site. There might be more flows that use Headstart, and @michaeldcain or @davidakennedy can answer better than me.

Screen Shot 2019-08-29 at 00 16 31

Screen Shot 2019-08-29 at 00 17 12

2 weeks.

Was this page helpful?
0 / 5 - 0 ratings