Tag Archives: fse-outreach-experiment

Brian Alexander 8:24 pm on August 31, 2023
Tags: fse-outreach-experiment,   

Test Chat Summary: 29 August 2023

On 29 August 2023 at 16:00 UTC, <test-chat> started in #core-test.

Announcements 📣

  • WordPress 6.3.1 Maintenance Release: This update fixes a handful of CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. and blockBlock 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 items, details of which can be found in the previous RC1 announcement.
  • 6.4 Release Parties Schedule and Hosts: The release squad is looking for volunteers to fill various roles required for each milestone’s <release-party>. Raise your hand, or be kind and share this post with folks you think can help out. Thanks!
  • The Future of WordPress & What’s Next for Gutenberg: Watch these presentations from WCUS 2023 to see what’s in store for 6.4 and beyond.

Focal Group Updates 🗣️

Handbook

There is an open PR to add a Test Team Rep page to the handbook. Reviews are welcome, which can be comments/reviews on the PR, or a pingPing The act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.” in #core-test if something needs more discussion.

Open Floor 💬

FSE Outreach Program Update

[This discussion started here.]

It has been proposed that the #fse-outreach-experiment begin the process of spinning down its user testing aspect (i.e. the program’s calls for testing) by the time WordPress 6.4 ships. In place of testing efforts, focus would shift to emphasize wider adoption of the Site Editor through hallway hangouts, dev documentation efforts, and other adoption-focused initiatives on the path toward wrapping up Phase 2 of the WordPress Project Roadmap.

Because the FSE Outreach Program has considerable overlap with Test Team efforts, program leadership has requested input from Test Team contributors with questions or concerns around the proposed shift. This follows other shared feedback from current program participants.

It was stressed that changes in the outreach program be handled carefully and slowly, and to capture opportunities for feedback. The next step is to compile initial feedback and thoughts around this change to share in a Make/Test post for wider input.

Calls for Testing

Current contributors in the #fse-outreach-experiment have expressed a desire to continue testing in a format adapted from or similar to the outreach program. Structured ad hoc calls for testing from within the Test Team are similar, and would provide an opportunity for continued contribution through testing. [Ed. note: the Test Team should also consider adopting things that worked for FSE CfTs to improve the experience for all testers.]

A possible source for CfT topics could be pulled from roadmap posts (for example), or otherwise collected in an ideas backlog (for example). Some pertinent links for CfTs can be found at:

Work is ongoing for documenting processes in the Test Team. The Handbook project can be found at https://github.com/wordpress/test-handbook.

Test Team RepTeam Rep A Team Rep is a person who represents the Make WordPress team to the rest of the project, make sure issues are raised and addressed as needed, and coordinates cross-team efforts. Nominations

[This discussion started here.]

The Call for Nominations for the next Test Team Reps is underway. Test Team members’ help is needed to nominate or volunteer for this role, to help represent the team to the wider project.

If you have a nominee in mind, or questions about the role, please comment on the post, ask in #core-test, or reach out directly to @ironprogrammer in SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

@ironprogrammer stepped forward with an offer to help mentor volunteers for this role. It was also noted that serving as a rep offers an excellent opportunity to gain a broader perspective of how Test Team interacts with other teams, and that while it isn’t a “lead” role, there are some leadership-focused skills that reps develop in the process.

Please submit nominations by Thursday, August 31 Friday, September 22, end of day (UTC).

Next Meeting 🗓

The next scheduled meeting is on 5 September 2023 at 16:00 UTC for <test-triage> in #core-test.

Are you interested in helping write Test chat summaries like this one? Volunteer at the start of the next <test-chat> and earn some props!

Props @annezazu for peer review of this post.

#fse-outreach-experiment, #meeting-notes

Brian Alexander 4:53 pm on August 17, 2023
Tags: fse-outreach-experiment,   

Test Chat Summary: 15 August 2023

On 15 August 2023 at 16:00 UTC, <test-chat> started in #core-test.

Announcements 📣

  • Test Team at WCUS 2023: The WCUS 2023 Contributor DayContributor Day Contributor Days are standalone days, frequently held before or after WordCamps but they can also happen at any time. They are events where people get together to work on various areas of https://make.wordpress.org/ There are many teams that people can participate in, each with a different focus. https://2017.us.wordcamp.org/contributor-day/ https://make.wordpress.org/support/handbook/getting-started/getting-started-at-a-contributor-day/. is less than a week away! Check out this post for information, and to share your questions and thoughts.
  • Admin Design Kickoff: The Design Team share early thoughts on how WP admin could be reimagined. Join the discussion to help shape this important part of WordPress.
  • What’s new in Gutenberg 16.4? (9 August): Download and test the latest feature updates in the pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party, and get a peek at what the future holds for editor updates to WordPress CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress..
  • FSE Program Testing Call #25: Let’s start from the beginning: Get in on this latest call for testing before the feedback window closes on August 23.
  • WordPress 6.3 “Lionel”: And finally, WordPress 6.3 was released last week. When submitting bug reports, please consider the official test report guidelines, and remember that the WordPress Beta Tester plugin has a handy “Report a Bug” button that works even if you’re running the 6.3 release version 🎉.

And we received one participant-submitted announcement:

Open Floor 💬

WCUS 2023 Contributor Day

Volunteers were asked to step forward to help facilitate the Test table, both in person and remotely on SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/.. @ironprogrammer volunteered to help lead in person at the event, but at the time of this writing there was no clear lead for coordinating contributors online in Slack. Contributors wishing to help are asked to comment below or raise their hand in Slack.

The remote session for Contributor Day is scheduled to begin at 2023-08-24 10:00 EDT in the #contributor-day channel. For more details, see the Test Team at WCUS 2023 post.

Test Team RepTeam Rep A Team Rep is a person who represents the Make WordPress team to the rest of the project, make sure issues are raised and addressed as needed, and coordinates cross-team efforts. Nominations

It was shared that the nomination process for the next Test Team Reps would begin soon, and team members were encouraged to help identify and nominate individuals who might be a good fit for the role (even themselves). [Ed. note: the 2023-24 call for nominations has been published.]

Next Meeting 🗓

The next scheduled meeting is on 22 August 2023 at 16:00 UTC for <test-triage> in #core-test.

Are you interested in helping write Test chat summaries like this one? Volunteer at the start of the next <test-chat> and earn some props!

Props @boniu91 for peer review of this post.

#fse-outreach-experiment, #meeting-notes

Brian Alexander 5:29 pm on May 23, 2023
Tags: fse-outreach-experiment,   

Test Chat Summary: 23 May 2023

On 23 May 2023 at 16:00 UTC, <test-chat> started in #core-test.

Announcements 📣

  • Core Editor Improvement: Smoother Site Editing: See some of the latest updates to the editor, including revisionsRevisions The WordPress revisions system stores a record of each saved draft or published update. The revision system allows you to see what changes were made in each revision by dragging a slider (or using the Next/Previous buttons). The display indicates what has changed in each revision. history for styles, templates, and template parts.
  • WP Briefing: Episode 56: What to Know About WordPress Playground: Learn more about experiments surrounding the ever-growing WordPress Playground, and what coding and testing accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) opportunities this exciting project is making possible.
  • What’s new in Gutenberg 15.8? (May 17): Get the latest scoop on what’s recently shipped in GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/.
  • WordPress 6.2.2 Security Release: This rapid-response security release addresses a shortcodes regression from 6.2.1, and further improves security around this feature.
  • FSE Program Testing Call #23: Rapid Revamp: Follow along with this #fse-outreach-experiment to test features planned for the 6.3 release. With clear instructions on setup and what to test, both experienced and new contributors to testing will find this an interesting way to test and explore new features.

And last, but not least:

  • WordPress’s 20th Anniversary: WordPress turns 20 this Saturday, 27 May! Celebrate this historic milestone with others from around the WordPress world!

@oglekler also invited everyone to take part in the Day 15: #WP20 From Blogs to Blocks campaign.

Open Floor 💬

wp-now Package

@ironprogrammer drew attention to the recent release of wp-now (npm package), part of the WordPress Playground project. He noted that wp-now works with Node.js, and could be a possible replacement for wp-env. He gave an example of having navigated to a pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party source directory and running wp-now start, which quickly launched a new WordPress site to test the plugin.

@ironprogrammer mentioned that the utility could be a fast way for contributors to get set up for testing or development, and referred to WCEU as a possible testing ground for test contributors to try it out.

@oglekler provided a link to a MeetupMeetup All local/regional gatherings that are officially a part of the WordPress world but are not WordCamps are organized through https://www.meetup.com/. A meetup is typically a chance for local WordPress users to get together and share new ideas and seek help from one another. Searching for ‘WordPress’ on meetup.com will help you find options in your area. event that featured Playground, occurring shortly after Test Chat.

@ironprogrammer then shared his plans to draft wp-now setup instructions to propose for addition to the Test Handbook, and asked the team to try out the utility and report any blockers or challenges they encounter.

@boniu91 asked if PRs and patches could be applied to sites running on wp-now. @ironprogrammer confirmed having tested with plugin repos, but that testing with the wordpress-develop repo would be important before recommending it for broader Test Team use.

Next Meeting 🗓

The next scheduled meeting is on 30 May 2023 at 16:00 UTC for <test-triage> in #core-test.

Are you interested in helping write Test chat summaries like this one? Volunteer at the start of the next <test-chat> and earn some props!

Props @costdev for peer review of this post.

#meeting-notes

annezazu 8:00 pm on May 4, 2023
Tags: fse-outreach-experiment,   

FSE Program Build a Block Theme Summary

This post is a summary of the Build a Block Theme exploration for the FSE outreach program, the twenty-first effort. As always, I want to highlight those who helped to bring others along with them in this latest effort: 

  • InstaWP for allowing the outreach program to use their tooling for free, enabling more folks to jump into this call for testing and for more creativity in what we are able to test. 
  • @nomadskateboarding for sharing videos and bugs from a mobile only perspective throughout the exploration in the #fse-outreach-experiment channel. 

Shout out to @jameskoussertari @soivigol @gaambo as first time contributors for this exploration. Expect a badge on your WordPress profiles for your contribution! 

As a reminder, explorations are more open-ended ways of exploring the Site Editor and gathering feedback, sometimes involving work in progress features and very early prototypes. In this case, we used the Create BlockBlock 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. Theme pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party to augment the Site Editor into even more of a block theme building tool in order to test the limits of what’s possible and find gaps.

Watch the experience

@paaljoachim  and @nomadskateboarding both took videos sharing their experiences that you can watch below:

High level summary

Using the Site Editor alongside the Create Block Theme plugin supercharges the experience, mainly by filling in gaps around font management and offering more nuanced creating/exporting options. With these added features, the Site Editor is both left to shine as a theme building tool and the current known pain points impacting regular site building come to the surface, like needing more clarity around where layers of styles are coming from. In general, feedback fell into three categories: Create Block Theme plugin pain points, missing options in the Site Editor (font management, synced patterns, desire for more styling options with certain blocks), and UXUX UX is an acronym for User Experience - the way the user uses the UI. Think ‘what they are doing’ and less about how they do it. considerations for the Site Editor that match the site building experience. This all underscores how addressing key points of current feedback about the base experience of the Site Editor, including on mobile, will cascade to improve broader use cases, like using it as a theme building tool. To make the feedback easier to understand, anything specific to the Create Block Theme plugin has been marked as such.

Since I’m not a designer but would love to have a proper spacing layout, good hierarchy of headings, and a harmonious color palette, I then copied some of those elements from a couple of themes. For spacing values (spacing.spacingSizes and styles.spacing.blockGap), I copied them from the Frost theme and adopted the predefined font size values of headings & paragraphs from the Beaumont theme. As for the color palette, I sought a monochromatic color scheme, which I generated from W3School’s color schemes.I previously wrote custom CSSCSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site. to set the site-title & post-title’s text-decoration to none, but later found out that it can be done in theme.jsonJSON 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.. So my theme doesn’t use custom CSS anymore.

@franz00 in this comment.

I did previously a Block Theme with code and created some sections with the Site Editor and copy/paste the code. But this advance is grateful! It’s incredible, can create a Block Theme no writing any code 🙌

@soivigol in this comment.

Bugs

Most of the bugs found related to the experience of using the Site Editor on mobile web with basic options like undo/redo buttons not being visible, with a few additional bugs across the broader Site Editor experience and Create Block Theme plugin.

When arranging the site title and site tagline next to each other with the Row variation, there’s no setting for the CSS property align-items, which with the value baseline would allow the smaller site tagline to be nicely aligned with the site title. I can add an extra class for this and it works in the backend, but in the frontend my class is overwritten by the default is-layout-flex class, which has align-items: center. In the backend, the order of the classes is correct, while in the frontend the custom classes load too early and are overwritten by the WP default classes, so I have to use !important here.

@luminuu in this comment.

Feature Requests

Outside of major missing features, like the ability to sync patterns globally or modify interactive states for blocks, most folks either expressed a need for more advanced features catering to power users, including the ability to disable templates or set fallback fonts, and additional options for individual blocks to broaden stylistic possibilities. 

New: 

Previous

How the heck do I delete pre existing templates? Such as Two Page templates Page (Large HeaderHeader 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.) and Page (No Separators). As well as the extra Single Post (No Seperators) template.

@paaljoachim in this comment.

Patterns are a fantastic way to provide clients and users prebuilt layouts for rapid website creation. Unfortunately though, they lack one important feature, which would take them from being great to absolutely amazing. This missing feature is the ability to sync and edit patterns globally, without altering the content within them.

@jameskoussertari in this comment.

When I saved and returned to the previous screen a “System font” was added as well. How would I go about specifying a fallback font? Eg I normally use “Helvetica, Arial, sans-serif” as fallbacks for font-family – I guess this is only possible via custom CSS?

@soivigol in this comment.

What I found confusing is that for typography, there’s the preset font sizes (S, M, L, XL) but there’s no interface to change those preset sizes globally from the editor. Same for the defaults of Padding, Margin, Block Spacing and similar items.

@luminuu in this comment.

General usability

Outside of issues related to the Create Block Theme plugin, usability concerns all touched on currently known patterns of feedback, from improved grouping of templates to needing to reimagine the Styles information architecture to improve the baseline intuitiveness. In particular, styling challenges were the most common as folks sought to create something new from scratch and ran into points of confusion around the hierarchy of styles, how to quickly use the Styles interface, and current gaps in the experience. 

New: 

Previous:

I add a Header pattern and now I have one official Header template part where I see it has the Header template part label. The other newly added Header pattern does not have the Header template label but is in a Row. How do I make the new pattern become the Header template part?

@paaljoachim in this comment.

After examining the troubled templates and patterns, I found that the image path was going to the theme’s root assets/images folder. Copying the required images to the said folder solved the problem. Learning from this, I wondered if the image copying could be done during the CBT overwriting process and whether the overwriting process of templates that used coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.’s patterns could output the result to the HTMLHTML 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. template only instead of the HTML + PHPPHP PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML. https://www.php.net/manual/en/preface.php. pattern to minimize confusion. 

@franz00 in this comment.

I like the link to Global Styles in the Appearance > Editor menu.

@antigone7 in this comment.

Styling buttons (the block and elements) is split into “typography” and “colors”. This hierarchy may make sense and it’s a way how many plugins in the past implemented in the customizerCustomizer 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.. Still another way may be “I want to style buttons, now show me all controls to style buttons”. At the moment one has to go into typography for text and then into color for colors.

@gaambo in this comment.

I didn’t have to use the Custom CSS. But for this, I have wrapped the featured imageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. in a group block to give it margin. I think that it is a good idea to can insert Custom CSS, why in this case, it is a better practice to set an Additional Class in the Featured Image Block and give it style with a few CSS lines. It’s interesting to have this option, but the location is difficult to reach. I had a frustration until to I found.

@soivigol in this comment.

Top level typography styles: The icons for the different entries sometimes communicate current state (eg the background color on the button item), but other settings (eg removing text-decoration underline from link) does not change that. So the list is kind of mixed of current styles and base-styles. The text Aa icon seems to have a different font (the one i defined?) than heading and captions (allthough heading / captions do inherit that font).

@soivigol in this comment.

I had adjusted the font size under Styles -> Typography -> Text to be higher than the default one, however it would not apply to all blocks in the content. I had to manually update Post Date, Categories and Tags. For the Post Author and Post Content blocks changing the font size to a custom of 21px did not have any effect on the block. For the post content block, the font size is set at the surrounding div, but does not apply to the paragraph child elements, as there’s a default CSS p { font-size: 16px }, which came from a the font size setting in the Paragraph block, as I found out after some testing. I wonder where the 16px from came from, either from the Create Block Theme or some default setting in WP?

@luminuu in this comment.

#fse-testing-summary

annezazu 1:05 am on June 2, 2022
Tags: , fse-outreach-experiment,   

Hallway Hangout: Discussion on Full Site Editing Issues/PRs/Designs (1 June)

This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. Thank you to everyone who joined in!

Attendance:

@ndiego @annezazu @elmastudio and a Marcy joined us for a time.

Video Recording:

Topics

Briefly touched on two recent blog posts to be aware of:

Block Font Sizes and Fluid typography
High Level Feedback from the FSE Outreach Program (May 2022)

What’s missing and what’s stopping people from switching to blockBlock 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. themes

  • Responsiveness continues to come up with Ellen sharing how she built their own system to handle this for now, knowing that they can always switch over. She believes this is one of the main reasons people are holding back from switching to block themes.
  • We chatted briefly through intrinsic responsiveness ideas related to this and how that’ll ease much of these tensions in time.
  • Onboarding to the FSE experience was brought up, particularly around how confusing it is that the BetaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process. label still exists since that seems to imply it’s not usable. There’s an open discussion around removing the beta label (in time) on this exact topic.
  • The question came up around “How do we get folks to use block themes if there’s a beta label?” and how difficult that can be.
  • @poena has a post on switching over to a block theme, Ellen is working on a post for a 10 step process, and there are clear areas that can be improved to ease this process from a technical point of view in CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. (see “Ease switching to a block theme/between block themes” in this post).
  • People are very confused about when to switch in general though, even if folks like Ellen are building things that are ready to go for production sites.

Communicating the value of FSE

  • Nick has done some hardcore testing with folks who are new to the site editor and when watching them go into the experience and they change the typography of paragraphs but then can’t with headings! Why? We need to take a look at consistency across the tools we’re providing people. People get very frustrated and confused when one block has controls and another doesn’t. 
  • Block themes truly is a better experience for getting a design into WordPress but the confusion added is a bit sad for the project that it gets a rough reputation.
  • Right now, it feels like more of a communication issue to the end user around what they should actually do and what they can do with consistent communication. Figma does this well.
  • This has come up in DevRel for WP Engine. When you’re talking about the basics of how to do XYZ, this should be on Learn and in docs. When you’re talking about the cool, cutting edge stuff, we need more of that. “Here’s how to learn the basics of creating a block theme but here’s how to take it to the next level.” 
  • We discussed how if we can standardize block settings across all core blocks but allow agencies to turn on/off easily that’ll be huge for the user experience.

Patterns and opening up tooling

  • We spent some time chatting about issues for unifying the pattern modals and patterns as sections work since having consistency in the interfaces for patterns and in the larger editor can really help folks take advantage of what’s possible.
  • In many ways, it feels like users can rely on patterns and/or learn by doing over time as they explore more tools. As a result, exposing those tools doesn’t feel as risky as a pattern can guide the experience and, if they do want to dive in more, they can have access to the tools outright.
  • We discussed how valuable locking is when it comes to patterns as a way to curate and guide the experience more.
  • We went back and forth on the question of “How do we get people excited about what’s possible rather than worrying about folks breaking things?”

Difficulty with terminology

Naming of bock themes and the theme directory

  • We talked about how there have been different names for block themes, like “full site editing theme” or “block-based theme”. This is causing confusion and also differs from what shows up in the Theme Directory.
  • We discussed how difficult it is to find block themes in the directory since the tag you have to use is “full site editing” , which both isn’t intuitive and hard to find.
  • This led to questions around having a separate menu item for themes or improving the filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output..
  • Ellen shared how it’s unattractive to put free themes in the directory – “who clicks on FSE to filter?” Discoverability is so low – it’s not featured enough. She shared that they don’t put any effort into free themes. 
  • We all felt that the entire theme directory was due for an overhaul but were curious about what some quick solutions could be for now to make it more attractive and interesting to add block themes there.
  • Perhaps there could be a block label in the section below:
Image of the theme directory filtering showing the number of themes, a popular, latest, and feature filter label.

Limitations of the pattern directory

  • In talking about the theme directory, we discussed how neat it would be to find patterns associated with different themes, partially as a way to entice people to download that specific block theme and improve the user experience.
  • Ellen brought up how it’s not possible to add patterns to the pattern directory that use third party blocks. This sometimes prevents submissions for block themes who have specific blocks for their theme. 
  • We discussed how the pattern directory is overwhelming for users yet also limited: you can’t use named variables for color palette + can’t use third party blocks + no curation. 
  • The crux of the problem is t hat block themers are creating blocks to fill gaps with core right now which then limits what can be added to the pattern directory.
  • We discussed how there perhaps could be a filter to allow for third party blocks vs Core blocks. For those who want to venture into needing third party blocks, they could then opt in by filtering to show those.
  • @shaunandrews recently shared a post about pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party dependencies so some of that thought/design could likely be re-used there.
  • Nick shared how for the new feature in 6.0 where block themes can feature specific patterns from the directory, it’s still not granular enough. It would be nice to be ale to disable all patterns but then bring in a few from the directory to feature. There’s an issue open for this topic already!
  • We ended the call talking about how these dynamics often fragment the community  – people building premium themes or patterns rather than using the Core pathways. This then moves everything away from Core distribution channels and harms the community/branding/experience of WP.
  • Ellen described it as feeling like you’re building against something.
  • We ended the call talking about how important it is to share feedback, engage in discussions, and help influence the direction of where things go so we can get to where we need to.

#fse-hallway-hangout, #fse-outreach-experiment, #fse-outreach-program

annezazu 9:52 pm on November 8, 2021
Tags: fse-outreach-experiment, , ,   

FSE Program Testing Call #11: Site Editing Safari

This is the eleventh call for testing as part of the Full Site Editing Outreach Program! For more information about this outreach program, please review this FAQ for helpful details. To properly join the fun, please head to #fse-outreach-experiment in Make Slack for future testing announcements, helpful posts, and more. 

As a reminder, if you’d like to suggest an idea for a call for testing, it’s very welcomed and all ideas will be weighed against current project priorities to figure out what makes the most sense to pursue. You can share ideas directly in the slackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. channel or via DM to me (@annezazu). 

Overview

Feel free to jump straight to the testing steps if you’d prefer to get started right away.

This is the final call for testing before WordPress 5.9, which makes it a wonderful and high impact one to be involved in as it’ll help improve the experience for a large portion of the web before it ever launches. In order to get the most out of this call for testing, the instructions are going to change as the test goes on and as we move forward in the release cycle. For example, at the start of this test, folks will be encouraged to use TT1 and, by the end of the test, Twenty Twenty-Two will be recommended. For now, here’s a high level overview of what is going to be tested:

BlockBlock 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. theme template and template part editing UIUI UI is an acronym for User Interface - the layout of the page the user interacts with. Think ‘how are they doing that’ and less about what they are doing.

While certain calls for testing have ventured into the Site Editor, that experience as you’ve known it is shifting for 5.9 in order to offer a more refined and scaled down experience to manage templates and template parts within a block theme. With a condensed browsing tool and a new placement in wp-admin under Appearance, this might feel more like a taste than the full experience of the Site Editor as you’ve come to know it.  

Styles Interface

While 5.8 laid the groundwork for a cohesive style system, 5.9 sees the introduction of a beautiful user interface that allows folks to interact directly with various style properties. You might have heard of this work under the project name “global styles”! While we’ve had calls for testing around theme.jsonJSON 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., one of the mechanisms related to the overall Global Styles project, this is the first time Styling itself is being explored. Currently, this interface displays two large groups of design focuses: blocks and elements. Elements represent things that can be styled globally and across blocks (such as “text”, “links”, “captions”, etc). This is a fancy way of saying you can easily change the typography of your entire site or the unique coloring of your buttons block all from the same interface. 

Patterns Explorer

With block patterns on the rise, a new explorer modal has been shipped to make it easier to navigate between patterns and find the exact one you want to use. This sets the groundwork for future integration with the Pattern Directory. This test will briefly explore this new experience.

Twenty Twenty-Two

Twenty Twenty-Two is the latest in a long line of default themes with a twist — it’s a block theme first and foremost built for the various site editing tools. As a result, midway through this call for testing, folks will be encouraged to test using this theme and report back their findings. Read more about this groundbreaking default theme here. 

Testing Environment 

This will adjust as the test goes on and the release cycle progresses to ensure folks are testing the latest and greatest. 

Here are the steps to follow to properly set up your testing environment for this specific all for testing. If you’re already ready to go, jump to the testing steps below.

  1. Use a test site with the latest version of WordPress. Right now, that’s 5.8.2. It’s important this is not a production/live site. 
  2. Install and activate the GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party from Plugins > Add New. If you already have it installed, make sure you are using at least Gutenberg 12.0.
  3. Install the TT1 Blocks theme by going to Appearances > Themes > Add New. Once installed, activate the theme. 
  4. Create a few posts with featured images of your choosing. Alternatively, you can download and import the demo Gutenberg content created previously for these kinds of tests via the WordPress importer under Tools >  Import. You can also follow this lesson for how to use demo content.
  5. Go to the website’s admin.
  6. You should now see a navigation item under Appearance titled “Editor (betaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process.)”. If you don’t see that, your environment isn’t correctly set up. If you get stuck here, just comment on this post or ask in #fse-outreach-experiment for help!

Generally speaking, please use the latest versions of each part of the setup and keep in mind that versions might have changed since this post was shared.

Testing steps

Personalize your homepage

1. Go to Settings > Reading and set “Your homepage displays” to show “Your latest posts”.
2. Once set, go to Appearance > “Editor (beta)”. This will open up to show a template that displays your homepage.
3. From there, change your homepage to your liking! This could mean adding in a navigation block, changing the font size of your Post Title Blocks, adding a duotone filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. to your Post Featured ImageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. blocks, removing blocks, adding blocks, and more. 
4. Once you’ve adjusted everything to your liking, click “Save” and go through the saving experience. 

Set your styles 

5. From there, click on the Styles icon in the upper right corner to access the Styles interface. 
6. Once open, personalize the four sections as much or as little as you’d like: Typography, Colors, Layout, and Blocks (to customize individual blocks). For example, you can click on Colors > Palette > Use the + sign to add your own custom color option for use throughout your content. 
7. Once you’ve adjusted everything to your liking, click “Save” and go through the saving experience. 

Add a buttons pattern and use layout controls

8. From there, open up the Inserter and switch to the Patterns tab.
9. Select the “Explore” option, navigate to the Buttons section, and pick the “Simple call to action” pattern.
10. Once added, use the + option to add in a second button. 
11. From there, select the overall parent Buttons block and open the sidebarSidebar 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. settings to customize the layout to your liking. Here’s a quick video in case you get stuck.
12. Save the changes. 

Add a duotone filter to your Archive template

13. Click on the W menu in the upper left hand corner > Under Editor select “Templates” > Select “Add New” > Select “Archive” (currently not possible to create a General template from here).
14. In the content, add in the Post Featured Image block and add in a duotone filter. 
15. Add in any additional blocks you’d like and save the changes when you’re ready. 
16. Head back to your dashboard by clicking on the W icon in the upper left corner before heading to Posts > All posts. 
17. Edit one of your posts with a featured image and assign your updated “Archive” to this post. Here’s a quick video in case you get stuck.
18. Save and view the post to see the filter applied!

Edit your HeaderHeader 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.

19. Return to Appearance > Editor (beta) and, using List View if you need to, select your Header template part. 
20. Select the three dot menu in List View or in the block toolbar and select “Edit Header”. This will take you to the focused template part mode. 
21. From there, make a few changes to the template part (add items to the navigation block, change the size of your Site Title, etc) and use the horizontal drag handles to see how your header will look at different sizes! 
22. Save the changes.

What to notice:

  • Did the experience crash at any point?
  • Did the saving experience properly save your changes? 
  • Did you find any features missing? 
  • What did you find anything particularly confusing or frustrating about the experience?
  • What did you especially enjoy or appreciate about the experience? 
  • What would have made this experience easier? 
  • Did you find that what you created in the editor matched what you saw on your site?
  • How did your content look on a smaller device or screen size? 
  • How do you think this will impact your current workflows? 
  • Did it work using Keyboard only?
  • Did it work using a screen reader?

Leave Feedback by December 7th, 2021

Please leave feedback in the comments of this post. If you’d prefer, you’re always welcome to create issues in this GitHub repo directly for Gutenberg. If you leave feedback in GitHubGitHub GitHub is a website that offers online implementation of git repositories that can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/, please do still comment below with the link. If you see that someone else has already reported a problem, please still note your experience with it below, as it’ll help give those working on this experience more well-rounded insight into what to improve.

Props to @kellychoffman for helping review this call for testing.

Changelog

Nov 10th: updated instructions to use Gutenberg 11.9 RC4.
Nov 12th: updated instructions to use Gutenberg 11.9.
Nov 13th: updated instructions to use WordPress 5.8.2.
Nov 24th: updated instructions to use Gutenberg 12.0, to change the phrasing around the browsing component, and to update the due date.

#fse-outreach-program, #fse-testing-call, #full-site-editing

annezazu 8:59 pm on October 21, 2021
Tags: fse-outreach-experiment, ,   

FSE Program Pattern Party Summary

This post is a summary of the tenth (!) call for testing for the FSE outreach program. Per usual, I love an excuse to celebrate so here are some fun stats to continue the party:

  • There have been Italian translations for nearly every single call for testing thanks to @piermario. This consistent hard work has allowed folks from the Italian community to better stay up to date and involved in these efforts.
  • There have been numerous Japanese translations and group calls for testing through WordCampWordCamp WordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more. Japan thanks to @mimitips @ippei-sumida @atachibana (and likely others!). Similar to the Italian translations, it’s wonderful to see a pathway created here for the Japanese community to be involved.
  • @paaljoachim has responded to every single call for testing with comprehensive feedback each time! It’s wildly helpful to have someone be so consistent in exploring each test over time.
  • There have been 69 badges given to folks who have responded to the various calls for testing with an average of 1.6 replies per person (meaning most folks don’t just contribute once). 

Thank you to every single person who has come along for the first ten calls for testing. Here’s to at least ten more (Twenty more? Thirty more?). 

For this specific release, I want to offer special thanks to @piermario for the Italian translation, Yoast for focusing attention on this call for testing for their latest contributor dayContributor Day Contributor Days are standalone days, frequently held before or after WordCamps but they can also happen at any time. They are events where people get together to work on various areas of https://make.wordpress.org/ There are many teams that people can participate in, each with a different focus. https://2017.us.wordcamp.org/contributor-day/ https://make.wordpress.org/support/handbook/getting-started/getting-started-at-a-contributor-day/., and @sparklingrobots for bravely walking through their experience for the call for testing on a hallway hangout.

Finally, shout out to the following folks as first time contributors to a call for testing: @evarlese, @oksankaa, @nynkedeblaauw, @suascat_wp, @mikes41720, @iamyvonne, @adetolah, @josevarghese, @ankurchauhan126. Get excited – you now have a testing contributor badge on your WordPress profile!

High level Feedback

Here’s what a few folks had to say about the overall experience that can help frame the following more specific feedback. Generally speaking, most folks found problems with more of the details of the experience rather than running into any major blockers with UXUX UX is an acronym for User Experience - the way the user uses the UI. Think ‘what they are doing’ and less about how they do it., crashing, bugs, etc that prevented them from doing what they wanted to do. Tied to this, much of the feedback centered around the desire to be able to go even further than what’s currently possible, which is reflected in the robust Feature Requests section.

While some things are still not totally intuitive to new users, I feel that GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ made more big steps ahead in just a few months. I enjoy creating content in it and some of the things I have in mind are easier to achieve.

@piermario 

It’s been fun testing out the ‘query loopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop.’ blockBlock 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. in FSE. No crashes or bugs. The saving worked properly. 

@mikes41720

Confirmed bugs

What follows are confirmed bugs that break expected functionality or the experience of different features. Thankfully, there were only a few of these items!

General Usability Feedback

Overall, most of the feedback for this section surrounded taking very specific actions or insights around how pieces fit together rather than a massive gap in the experience or a blocker to accomplishing a task. As a result, I’ve included more quotes than usual below to help give more context to what was shared. Of note, some are repeat items from previous tests and are labeled as such below. 

For the Query Block specifically, I’m not sure if this is expected, but I didn’t find a way to get back to the initial layout options if I wanted to change.

@evarlese

I had to open a new tab and go to Posts -> Categories and check out the names of the categories. It would be very useful with the multi select so that we can easily choose various categories from a drop down.

@paaljoachim

It makes sense that ‘Post Categories’ and ‘Post Tags’ blocks can only work within the Query Loop block and when editing a Post and each would display categories and tags associated with that post. However, when someone tries to insert those blocks on the Page outside the Query loop block would just drop the spinning icon. Probably, because as we know Page has no categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. and outside the Query Loop, it can’t query the category. ‘Categories’ block would however work.

@suascat_wp

Query Loop – the anchor link of ‘create a new post’ leads to creating a new post or page (depending on the post type chosen in the settings), but I felt like it would break interaction with full site editing since it leads you to create a totally new post or page using the block editor. 

@mikes41720

Post ExcerptExcerpt An excerpt is the description of the blog post or page that will by default show on the blog archive page, in search results (SERPs), and on social media. With an SEO plugin, the excerpt may also be in that plugin’s metabox. – there’s a section to ‘add “read more” link text‘ (which I’m not sure what it means?) that if you click on, it doesn’t show the blinking “|” which signifies that you can add text to it (although it does work and you can add text). If you click directly right after it, it’ll then show the blinking “|” and that acts as more of a sign that you can modify and add text. It might be a bit confusing for some users from a visual cue standpoint.

@mikes41720

I’m having a hard time adding the columns within the Query Loop block unless have to do it via the help of list view.

@iamyvonne

I was playing with the theme.json and added under the styles section on the file a font size for coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress./post-title for the page, that syle is applyed at the root level so every nested core/post-title will inherit this stile and it’s ok abviously, it’s a css behavior, this is something to pay attention because now with blocks we must take into account much more kind of indentation of blocks than before where we had well-defined structures.

@overclokk

I’m still misled by the WordPress button in the top left corner of the Site Editor. I know that its function toggles a menu open/close, but being the WordPress logo such a familiar affordance, I often click on it in auto-mode expecting to come back to the dashboard…way too many clicks if I just want to “escape” to the dashboard or the live site.

@piermario 

I often feel the “double” saving step slows me down and in 99% of the cases, the options provided in “Select the changes you want to save” are something I don’t want to check off.

@piermario 

Feature Requests

Generally speaking, at a high level, most feature requests in this section come down to two things: more design tool options and more settings for blocks. As with the previous section, some are repeat items from previous tests and are labeled as such below. 

I was also initially surprised by 1 item per page as the default, and it took me a moment to find the settings again to change it.

@evarlese

When selecting ‘Display settings’ one can set the number of items per page. But actually you pick the number of items in the column if you choose a layout with multiple columns. May be easier to understand if ‘items per page’ would be renamed to ‘items per column’ or something similar.

@nynkedeblaauw 

Site Logo – has a Rounded style but no border radius control. It would be helpful to add the various new controls also to the Site Logo block. Dimensions panel etc.

@paaljoachim

I wish I had a margin and padding setting on the Columns block level.  

@piermario

#fse-outreach-experiment, #fse-outreach-program, #fse-testing-summary

annezazu 2:19 pm on October 5, 2021
Tags: fse-outreach-experiment, ,   

FSE Program Block Theme Switching Summary

This post is a summary of blockBlock 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. theme switching exploration for the FSE outreach program. This was the first of its kind, enabling folks to share very early feedback on something that has yet to be robustly defined. Thank you to everyone who participated, whether through sharing feedback directly or sharing the exploration with others. 

Shout out to @richtabor @elmastudio @anariel-design who officially got badges for responding, despite having engaged with surveys the program has done in the past. 

Big thank you to @piermario for the Italian translation and @greenshady for the WP Tavern article, which both help bring the exploration to even more folks.

High level summary

Overall, the current experience proves to be frustrating and inconsistent, especially when taking into account custom block styles, keeping customized templates, etc. Thinking long term about what folks would want to be able to have across themes, there was mass consensus around being able to retain templates, template parts, and menus. There was somewhat mixed feedback around whether Global Styles should persist as some saw those as differentiating a theme. When it came to ideas for how to best manage the switching process, it quickly became clear that there’s a balance to strike between not adding too much friction to the process while also offering users options to pick and choose what can come with them when they switch. Ideally, there can be a simple and visual way to intuitively guide users and help them take advantage of the power of what block themes unlock without discouraging them with too many options. 

On templates and template parts

There was mass agreement around the desire to keep customized templates and template parts across themes, with many expressing surprise and frustration at the current experience. This was previously documented and discussed here as part of an earlier call for testing.

I’m very surprised that any templates I’ve created are tied to the theme that was active when I created them. I’d expect that my custom templates should remain applied to pages when the new theme is active, instead of being disregarded. I’m not sure why templates are omitted when a theme is changed.

@richtabor in this comment.

I would like to be able to use templates and templates that I have created and saved, no matter which theme that is active. I know that I can view them under appearance templates/template parts, open them, copy the code and paste it into a new template, but I don’t think that is a good experience. It should be easier.

@poena in this comment. 

On menus

Similar to templates and template parts, this was another area that folks inherently expected would persist across changing block themes. 

An issue I’ve ran into now a few times when trying out different Full Site Editing themes is that losing menu data is frustrating. I think as a non-technical user it would be confusing, because you are prompted to “Add an existing menu”, which I would think would be my menu from the last theme I was using.

@timothyblynjacobs in this comment

I think it is important that navigation blocks that I have set up remains. The “Add existing menu” feature in the navigation block assumes that I have already created a menu in the navigation screen. If I only setup the navigation block as part of a headerHeader 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. template part in the previous theme, then I can’t re-apply or reuse that navigation block. Perhaps navigation blocks should also work the other way around? I mean why can’t I select a name for my navigation block as I create it in the editor, save that in isolation like I can save the site blocks in isolation, and have that navigation menuNavigation Menu A theme feature introduced with Version 3.0. WordPress includes an easy to use mechanism for giving various control options to get users to click from one place to another on a site. present on the navigation screen?

@poena in this comment. 

Keeping any menus created in the Site Editor available would be important, I think this is one of the biggest issues right now.

@elmastudio in this comment.

On Global Styles

Global Styles left folks a bit split with some seeing them as being theme dependent and others wanting the option to carry settings/styles across themes. There’s currently a discussion around what can and can’t be standardized which will impact how this could be implemented. 

I see Global Styles tied to the theme, but it could be helpful if some common settings are taken from one theme to the next.

@elmastudio in this comment.

Understandably global styles settings would adapt when a theme is changed (just like the customizerCustomizer 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.) – and I like how my custom GS settings persist when I change back to a theme (just like the customizer as well).

@richtabor in this comment.

When you export the demo and import it to the other installation, theme.jsonJSON 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. file styles are not imported. As a theme developer, I would love to develop one theme with different demos for example. When I export the demo file I would love that global and block type styles are exported too and imported to other installations.

@anariel-design in this comment

Have the option to keep Global styles modifications. Perhaps a kind of dialog box that shows up when entering the Site Editor listing adjustments I made to the previous theme, asking if I wanted to keep these adjustments or to start anew.

@paaljoachim in this comment. 

One question that keeps me up at night is how cross-theme compatibility will work on the content level. Default block output should translate from one theme to the next with little or no issues. However, custom block styles, font sizes, colors, and the full range of presets are already a problem area.

@greenshady in this WP Tavern article. 

On ideas for how to manage the process

Outside of a desire for the experience to be overall easier and more seamless, the following ideas were shared with a split in terms of folks who wanted decisions upfront vs after switching:  

  • Create a directory for templates and template parts, similar to block plugins or patterns, to make it easier to keep and reuse various templates/template parts.
  • Offer an option to pick and choose what you want to keep before switching themes.
  • Make switching easy upfront but, after switching, offer an option to import various items from the previous theme. 
  • Offer a side by side visual comparison of various parts of a theme before switching (templates, patterns, etc). 
  • Offer a way to import a color palette or template into your current theme so you don’t have to switch fully but can take advantage of different pieces. 

I have experimented with one theme but figured out along the way that it does not have the patterns or finished templates or something else I had hoped for. Instead of creating the patterns and templates myself I switch themes. When I click to switch a theme I get a warning message saying that switching themes will remove the adjustments I made to the current active theme, but I have an option to save these adjustments in a kind of twilight zone between one theme and another. I select to save changes I made, and notice that these carry over to the new theme that I activate. I check and notice that the changes do carry over. I am relieved that I am able to create adjustments in one theme and have these with me to the next time…In the Site Editor I can check out what the new theme offers and when I feel ready for it I can either say yes to bringing over the changes or no because I notice that the new theme has what I need.

@paaljoachim in this comment. 

I actually don’t want to be prompted with having to make several decisions as soon as I activate a new theme. I would find that stressful. I want to take my time. I want to understand what the differences are between the themes, and what changes I need to make. Perhaps there would be a side-by-side comparison of common page templates like page, single post, home? Like a revision? 

@poena in this comment. 

It needs to be easier for the users. They already needed to deal with the domain, hosting, choosing a theme etc.

@anariel-design in this comment

It could also be awesome to pull a color palette and drop it into an existing theme. Sort of like having a Colour Lovers directory to pick color schemes from but keep all the other bits. This could be fun for people who can recognize a palette that they like but would never be able to handpick all those colors. I’ve often seen color schemes that I’d love to use from other themes but didn’t like other things about them.

@greenshady in this WP Tavern article. 

On reasons for switching and the experience

Of the various questions folks could answer, some touched on both reasons for switching and the current experience. I’ve listed each response below since only a few folks addressed this area specifically. I’m also including images from @greenshady’s post where he took a simple blog post with some custom block styles, gradient colors, and font sizes and compared the output across three different themes highlighting current problems with theme switching.

To see prebuilt template layouts (could be done in a template mosaic view to where I can choose various prebuilt layouts instead of switching themes). To have a base that I want to start from. A design that I would like to use and modify.

@paaljoachim in this comment. 

I think the most common scenario is a missing functionality in one theme like WooCommerce support. Next would be outdated design and lack of updates and support from the theme author.  

@elmastudio in this comment.

When I switched to the Quadrat I mostly lost everything that I set up in the Clove theme. That means, About page doesn’t look anything similar, colors, fonts are now from the Quadrat theme and button style too. From the user’s side, this is very confusing. If u ever used Elementor for example, and many are using it they are used to the similar overflow. If I create a template and change the look and styles and switch to any other theme this template will look the same and it will remain available.

@anariel-design in this comment

I am not one for switching themes. Since I learned how to design for WordPress well over a decade ago, I have never moved from one theme to the next. At least not in the same way that the average user would. Instead, every time I have added a new coat of paint on my websites, I have simply switched over the foundation to whatever I had been working on at the given moment. WordPress themes, for me, were always just an iteration upon the last project…The first thing I do when testing any theme is to load a demo post. Lately, this has been the “Welcome to the GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ Editor” test post. The primary question: Can I read the content comfortably? If I do not get past this stage, I simply deactivate the theme.

@greenshady in this WP Tavern article. 

What’s next?

@critterverse is exploring how to approach these flows from a design perspective and has been following along as feedback has come in. You can expect to see a more in depth design exploration shared soon enough with some of these pieces of feedback and ideas integrated in! I’ll flag this in the outreach program channel when the time comes and will see how we can explore these experiences in future calls for testing. 

#fse-outreach-experiment, #fse-outreach-program, #fse-testing-summary

annezazu 1:39 pm on September 9, 2021
Tags: , fse-outreach-experiment, ,   

Hallway Hangout: on adoption pathways for full site editing

Date: 2021-09-16 16:00 UTC

Format: Zoom (recorded). A link will be shared in the #fse-outreach-experiment channel before the meeting time. Please join that channel if you’d like to participate!

Length: 45 – 60mins. This will not run longer than an hour.

Topic: This session will focus on adoption pathways with full site editing.

Facilitator(s): @mkaz @get_dave @annezazu

Goal: To have a broader discussion about adoption pathways, what’s working, what successes folks have had, what blockers people are running into, and what might help more folks participate. Beyond just the benefits of learning from each other, this information will ideally be used to help influence future resources and to give insights to the teams working on these items.

Intended Audience: Anyone who has adopted or is interested in adopting site editing related features (theme.jsonJSON 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., template editor, theme blocks, navigation editor, etc).

Agenda

This conversation is meant to casual, collaborative, and open ended rather than prescriptive about how one should approach adoption. With that in mind, we’ll start the session asking folks who are comfortable doing so to share what they’ve tried and how it’s gone. Once everyone who wants to go has done so, we’ll talk about successes, blockers, and what resources folks have used (along with what resources folks would like to see). We’ll see where the conversation takes us from there!

#fse-hallway-hangout, #fse-outreach-program, #full-site-editing

annezazu 1:54 pm on September 8, 2021
Tags: , , fse-outreach-experiment, ,   

FSE Program Exploration: Help with the future of Block Theme Switching

With the advent of blockBlock 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. themes in the WordPress ecosystem, new possibilities are on the horizon, from easier theme development for developers and designers to easier site creation for users. Rather than just examining the value of block themes in isolation though, it’s important to expand to think about what can be done across different block themes. For example, imagine a world where one could seamlessly take product review patterns from one theme, styling from another, and product display templates from an eCommerce focused theme to create a store. Or imagine being able to switch themes while retaining your favorite palette of colors and typography. Regardless, it’s imperative that the experience is reliable, intuitive, and expansive pushing beyond what’s been possible in the past. 

As a result, the focus of this exploration is on thinking from this longer term, “wishful thinking” perspective first by guiding you through a very basic theme switching process and then by asking each of you to creatively think about what you’d like to see happen. Since this is not quite a call for testing due to the lack of flows, focus less on finding bugs (although they are still welcomed) and more on thinking through things you wish would happen or would like to occur. The aim is to gather useful insights that will help inform how we design this experience. 

Note: this is intentionally just focusing on block theme switching only for now rather than, for example, switching from classic to block. 

Explore what’s currently possible 

The steps below are meant to be high level with the aim to have you set up initial block theme related items that you might want to keep upon switching themes. It’s not required to run through these steps for the sake of this test since many of the flows are not yet built. 

If you don’t have time to create quick content, feel free to import this demo content (open the link and select “Download) created especially for this test via the WordPress importer under Tools >  Import. You can also follow this lesson for how to use demo content.

  1. Set up a test site. Do not use a production/live site. You can follow these instructions to set up a local installLocal Install A local install of WordPress is a way to create a staging environment by installing a LAMP or LEMP stack on your local computer. or use a tool like this to set up a development site. 
  2. Install and activate the latest version of Gutenberg. 
  3. Install and activate a block theme from the options listed in the theme directory. 
  4. Create a custom template under Appearance > Templates > Add New. 
  5. Create a custom template part under Appearance > Template Parts > Add New. 
  6. Open the Site Editor and, using the Global Styles UIUI UI is an acronym for User Interface - the layout of the page the user interacts with. Think ‘how are they doing that’ and less about what they are doing., select a few custom block styles and overall default styles. Save all changes. 
  7. Head to Appearance > Themes and switch themes. 
  8. Review the Site Editor, Templates, and Template parts. 

Bonus: Try importing and exporting content from a current site you have to a test site to make the test feel more real and applicable, even if the site is not using a block theme. From there, switch to any theme, block or not. This is purely to get you in the headspace of thinking more about what you’d like to retain even if this is focused specifically on block themes. 

Describe what you’d like to see

Comment below after reflecting on the following questions. Remember to share what you’d like to see ideally rather than focusing on what’s currently in place. Answer one, answer all, answer none! These are merely to get you thinking in the right framework rather than boxes to check: 

  • What would you want to be able to do when switching themes?
  • What parts of a block theme would you expect to be able to keep when switching themes? 
  • What sort of confirmation prompts would you want to see? 
  • Share a time when you switched themes and something unexpected happened.
  • When you switch themes on your site, can you share your routine?
  • If you wanted to switch to a new theme today, where do you go or which places would you expect to be able to do this?
  • What are some reasons you have had for wanting to switch to a new theme?
  • Anything else? Think big!

Please share feedback by September 29th, 2021

As always, thank you for participating in this exercise. If anything is blocking you from doing so, just say so either in #fse-outreach-experiment, in the comments of this post, or over DM in slackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. to @annezazu (that’s me!). Keep in mind that not everything shared here will be implemented by the nature of this exploration but know that your ideas will ultimately help shape what is possible going forward. 

Thank you to @poena @kellychoffman @priethor @daisyo for reviewing!

#block-themes, #fse-exploration, #fse-outreach-program, #full-site-editing