This post is part of a wider series that provides answers to questions gathered through the FSE Outreach Program. This round of questions was started on March 16th and ended on March 30th. Thank you to everyone who submitted a question so our knowledge can grow together! Stay tuned for future rounds and join the FSE Outreach Program if you’re keen to both learn more about these features and help shape how they evolve.
1) I would love to know the clearer roadmap for WooCommerce and Full Site Editing. It’s currently difficult to know which features will be available at what time frame.
This is a great question for the WooCommerce team. For now, it’s recommended to stay tuned on their developer blog as they share insights there from time to time.
2) I don’t think it’s obvious that in FSE the settings refer to the individual blocks in the template or template part, while the Styles refer to “global” changes (typography, colors, layout). Shouldn’t this be made more clear?
The distinction between what changes are global vs local (for lack of a better term) has repeatedly come up in various ways in calls for testing, whether it’s understanding that a change to a template impacts everything that uses that template or the example provided in this question. It should be clearer and work is being done to get there. There are a few related efforts to address this including ideas like colorising global entities for reusable blocks and template parts and explorations around changing the information architecture to provide more separation around Styling, Templates, etc from document based items. Expect this to be a focus and to continue to evolve.
3) Will we be able to make page templates within FSE WP 6.0?
Currently, you can create page templates via the Post Editor but not the Site Editor! With WordPress 6.0, the options will soon be far more open with the ability to add the following: Author, Category The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging., Date, Tag Tag is one of the pre-defined taxonomies in WordPress. Users can add tags to their WordPress posts along with categories. However, while a category may cover a broad range of topics, tags are smaller in scope and focused to specific topics. Think of them as keywords used for topics discussed in a particular post., Taxonomy A taxonomy is a way to group things together. In WordPress, some common taxonomies are category, link, tag, or post format. https://codex.wordpress.org/Taxonomies#Default_Taxonomies.. Stay tuned for even more options in the future! Tied to this, expect patterns to be better integrated into the experience to make it easier to get started when you do create a new template.
4) Will WordPress 6.0 FSE have full responsive settings? & Why are media queries completely absent from the block Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. editor and fse projects? Why is responsive web design being ignored?
Rest assured that responsive options are baked into the initial plans for 6.0 and beyond. This is an area that requires very careful considerations since whatever is implemented will need to be maintained and adopted. Right now, work is underway to add fluid typography, allow for custom units for the more user friendly spacer block (available in 5.9.1), add more dimension controls to various blocks, and generally to embrace intrinsic web design principles. To address the media queries question, here’s a quote from a previous post ahead of 5.9 that touches on this:
“The block model is a good case to apply some intrinsic design principles, since a block can occupy a place in many different layouts and containers, for which prescriptive media queries that don’t take context into account are inflexible.”
For more context, it’s recommended to read through the responsive blocks and intrinsic web design overview issue. Of note, I merged two questions into one for this answer to offer a more streamlined response. For 6.0 specifically,
5) Can we expect the ability to create our own block patterns and export full block themes?
In terms of patterns, the option to create your own has existed for a few releases! Here’s more information to get started:
As a reminder, you can also create your own and submit them to the Pattern Directory for all to benefit from.
In terms of exporting block themes, this is now possible directly from the Site Editor thanks to Gutenberg 12.9, which will be included in 6.0. I recommend chiming in on this overall discussion issue for anyone interested in shaping the future here since there’s more work to come. There are also a number of PRs to explore:
6) Is it possible to create a vertical header The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. with FSE?
Yes! It’s a bit “hacky” right now but it is possible thanks to various tools like the Row block, Columns block, orientation options, and more. To better show how this is possible, I created a quick video showing how I did this. At a high level, here’s the process:
- Create a new template (front page) or edit current homepage template.
- Add columns block and set to two columns.
- In the first column, add a template part block and assign it an HTML HTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites. element of
<header>. - Add a navigation block with vertical orientation (or just set it to show as mobile).
- Add in whatever else you’d like to the column itself!
In the future, I expect patterns to play a great role here in providing more variations of this sort when creating a new template or editing a current one.
7) I can’t find what are the advantages or differences between two block themes.
In many cases, block themes will differentiate themselves based on built in patterns, style variations, templates, what options are available via theme.json JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML., and more. This is going to require a switch in thinking as classic themes had more of a focus on internals/logic whereas block themes will differentiate themselves with design and aesthetics.
8) Is there any way to allow theme authors to add code in global styles (as we can do in Customizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings.)?
Generally speaking, the aim is for block themes to use and need as little CSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site. as possible. However, there is an open issue considering the ability to add Custom CSS through Global Styles.
In full transparency, I emailed the person who submitted this question to ensure I answered this fully and will update this post if that changes.
9) Is there a way to identify the smaller column as “complementary” to signal to assistive technology Assistive technology is an umbrella term that includes assistive, adaptive, and rehabilitative devices for people with disabilities and also includes the process used in selecting, locating, and using them. Assistive technology promotes greater independence by enabling people to perform tasks that they were formerly unable to accomplish, or had great difficulty accomplishing, by providing enhancements to, or changing methods of interacting with, the technology needed to accomplish such tasks.
https://en.wikipedia.org/wiki/Assistive_technology (screen readers) or the Google Bots (indexing for SEO) that the content should be skipped?
The best way to do this at this point would be to add in a new Template Part block to wrap the sidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. content in and assign it an HTML element of <aside>.
10) The thing I still cannot figure out how to do is layer navigation over a slideshow, any slideshow!
I emailed this person to get a bit more context as I’m not quite sure what they are using to display the slideshow. Either way, the slideshow block would need to allow for inner blocks, like the navigation block, to be added. Because this person did indicate an interest in layering in general though, I offer up this issue on adding the ability to have multiple background images in case anyone else is too!
#fse-answers, #fse-outreach-program
