Developing the redesigned Home and Download Pages

There is a new post on +make.wordpress.org/design/ announcing the redesign of the home page and download page.

Development work is already underway on a block-based theme implementing that design. The work so far has been on the basic structure and tooling. Now that the designs are ready we can begin implementing the layout. A recent copy of the theme is running on a temporary staging site. You can see an early, obviously incomplete version of the front page there already.

Most of the code development will take place in the theme repo: https://github.com/WordPress/wporg-main-2022/

That repository contains the theme, some plugins, and a full local development environment. Using Docker and a few other prerequisites, it’s possible to run a local copy for development and testing. The setup scripts will even sync a current copy of the content from the staging site.

The plan for the new theme is that as much as possible of the content and page layout will be created and managed using the editor, as opposed to code in SubversionSVN Apache Subversion (often abbreviated SVN, after its command name svn) is a software versioning and revision control system. Software developers use Subversion to maintain current and historical versions of files such as source code, web pages, and documentation. Its goal is to be a mostly compatible successor to the widely used Concurrent Versions System (CVS). WordPress core and the wordpress.org released code are all centrally managed through SVN. https://subversion.apache.org/.. Other than the 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 footer, almost everything you see on the front page of the staging site is the contents of a page, edited with 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/.

A screenshot showing a portion of the current in-progress front page, built in the WordPress editor.

This means that, going forward, most changes to the newly redesigned pages on WordPress.orgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org/ can be done directly by the folks who handle content, without requiring a code change.

Implementing the full design will require building some custom blocks and customizing existing coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. blocks. That work will take place in the GitHub repo.

The development plan is to roll out a MVPMinimum Viable Product "A minimum viable product (MVP) is a product with just enough features to satisfy early customers, and to provide feedback for future product development." - WikiPedia of this theme with the new front page and download page designs:

  • Build the required blocks and other customizations needed for the designs.
  • Rough out the designs in the editor on the staging site.
  • Iterate on the fine details in the editor.
  • Fix issues in code as needed.
  • Involve the Design team in making refinements as needed.
  • Test for a11yAccessibility 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), SEO, and best practices.
  • DeployDeploy Launching code from a local development environment to the production web server, so that it's available to visitors. the theme live when it’s ready.
  • Continue to iterate on the design and content in the editor after launch.

Given the complexity of making this work on Rosetta sites, we expect to initially roll out the MVP on the main WordPress.org page only, and roll out translated sites as a later iteration.

If you’d like to see how the new pages are being built using post content and a 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, you can check out the theme repo and staging site here:

X-post: Project Update: WordPress.org Homepage and Download page mockups

X-post from +make.wordpress.org/design: Project Update: WordPress.org Homepage and Download page mockups

Pattern Previews for Themes in the Directory – Beta

Since WordPress 5.5 it’s been easy for themes to include bundled patterns. That’s proved to be a popular and powerful feature. But there has been no easy way to view the patterns included in a theme without installing it. As a result of those discussions, we have deployedDeploy Launching code from a local development environment to the production web server, so that it's available to visitors. code that adds a “Patterns” section for themes that have registered patterns.

Here is an example of TwentyTwentyTwo:

Clicking on a pattern opens it in the theme:

What’s Next?

This is an early 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.. There are plenty of things to improve iteratively. We’ve turned this on so others can see it and participate. If you have ideas, feedback or find any issues, please file a meta ticket!

Theme Authors: 

From a technical standpoint, the pattern preview screenshots are generated by adding patterns into whichever template handles “page” rendering. If you think the pattern preview isn’t rendering properly, try adding the pattern to a page in your theme (as a user would). If the screenshot differs significantly from what you see, please open a meta ticket so we can take a look.

Thanks!

Props: @courane01 @kafleg @poena @adamwood @mtias @tellyworth

X-post: Project Kickoff: WordPress.org Homepage and Download page redesign

X-post from +make.wordpress.org/design: Project Kickoff: WordPress.org Homepage and Download page redesign

X-post: Contributor Teams: Submit WCUS 2022 Table Leads Signup Form by July 29

X-comment from +make.wordpress.org/community: Comment on Contributor Teams: Submit WCUS 2022 Table Leads Signup Form by July 29

Exploration: improving DevHub

Recently some of us on the MetaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. team did some experimenting with hypothetical changes to the WordPress Developer Docs, especially the function reference. As developers and frequent users of the docs, we’re aware of its shortcomings and potential for improvement. In order not to risk breaking anything and give ourselves freedom to make significant changes, we forked the codebase into an experimental repo.

The changes we came up with turned out to be quite solid and sensible, and I think most of them are good enough for production. Since they were made as unilateral experiments, we’d like to hear feedback from the +make.wordpress.org/docs/ team and community in general as to what should happen next. You’ll find an outline of some of the most notable changes below.

A local development environment

We started by setting up a fresh repository with a fork of the necessary code, including the Handbook 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, phpdoc-parser, and the current theme. The repo contains a complete local Docker environment, so you can run a copy on your local machine to develop and test changes. The local environment imports function reference content by parsing phpdocs just like in production; and it also imports some handbook content from GitHubGitHub GitHub is a website that offers online implementation of git repositories that can 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/. It doesn’t import all handbook content, but there’s enough for testing purposes.

Visible changes

Here’s a typical function reference page you’ve probably seen before: get_posts(). I’ve highlighted some of the more visible things we changed:

Before
After

And below the fold on a function like wp_authenticate():

Before
After
Continue reading

#devhub, #docs

Gutenberg Landing Page Launched

As mentioned in Gutenberg Landing Page: Kick-Off, we’ve been working on implementing a redesign of WordPress.org/gutenberg led by @beafialho.

These updates are now live!

Apart from Editor modifications to make the 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 accessible on the front page, it was built almost entirely with 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/ 🥳.

I invite you to read more about the project in Redesign of the Gutenberg Page, and if you have any feedback, find any issues, or want to get involved, head over to the theme repository.

Thanks to all those who participated:

@beafialho, @annezazu, @juanmaguitar, @mkaz, @dansoschin, @kellychoffman, @anjanavasan, @webcommsat, @ndiego, @rmartinezduque, @jpantani let me know if I missed anyone 🙂

X-post: Announcement: Incident Response Training

X-comment from +make.wordpress.org/updates: Comment on Announcement: Incident Response Training

Theme Review Improvements

Over the course of the last year, community members from the metaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. team and the theme review team have been working together, testing new ways to make theme reviews quicker and easier without compromising the quality of themes in the directory. We improved existing tools, added new tools, opened up direct SVNSVN Apache Subversion (often abbreviated SVN, after its command name svn) is a software versioning and revision control system. Software developers use Subversion to maintain current and historical versions of files such as source code, web pages, and documentation. Its goal is to be a mostly compatible successor to the widely used Concurrent Versions System (CVS). WordPress core and the wordpress.org released code are all centrally managed through SVN. https://subversion.apache.org/. commits, and audited theme review rules. As a result, the average time for themes to be reviewed has decreased:

PeriodAvg Days to ReviewChange
2020 January129
2021 January6053% Decrease
2022 January590% Decrease

Note: Changes in theme upload numbers are not really statistically relevant.

What’s next?

Improving developer experience and simplifying the theme review process is an ongoing process and requires active participation from theme authors and contributors. If you are interested in contributing, follow the theme blog, join the slack chat or participate in the appropriate code repository (listed below).

Also, in order to make better, data-driven decisions, we have created a theme review stats page that will help us track how long it’s taking for theme reviews to complete and some other related theme information.

I want to thank @poena @kafleg and all the members of the Theme Review team who participated!

Repositories:

Proposal: Make WordPress Team or Project Updates

To get a quick overview across all teams, WordCamp CentralWordCamp Central Website for all WordCamp activities globally. https://central.wordcamp.org includes a list of upcoming and past camp with links to each., WPTV, HelpHub, DevHub, and more, it would help to have a single location to show what activity is happening.

A simple starting example is at https://github.com/courtneyr-dev/make-wp.

A GitHub readme file with actions to auto-update a bulleted list for every WordPress team and related sites.

Ideally, this should live natively on WordPress.orgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org/ in a visible location. Make WordPress Team Updates could be a good home, as well as Project Updates, as this encompasses the entire WordPress project. or creating a unique site could work as well.

Using 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 to import the RSS would make quick work of deployingDeploy Launching code from a local development environment to the production web server, so that it's available to visitors. this idea.

@dd32 has helped create a prototype at https://make.wordpress.org/overview/. There is a limitation of the listed items being the past 25 items in the RSS.

Questions:

  1. Are there any sources missing?
  2. What site should this live on? Should it continue to live on /overview?
  3. Where should this appear in any navigation?
  4. Should this be promoted by the Marketing team as a public resource?