Block Pattern Directory Update

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. Patterns are a way to set up layouts of blocks, through themes and plugins.  We’ve started work to create a Block Pattern Directory, similar to 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 Theme directories. This will let anyone create and share a Block Pattern with any WordPress user.

Current state

The Block Pattern directory is in progress at wordpress.org/patterns. Following @shaunandrews’s design post, we’ve been working on the pattern browsing flow. The grid view is in progress:

The landing page of the Pattern Directory.

When viewing a single pattern, you can see a live preview which can be resized to preview at different screen sizes. Copying and favoriting are not working yet.

Single pattern view

The editor for creating block patterns is still in progress, but the idea will be that you can create a pattern right on the Pattern Directory site, and submit it. Shaun’s initial design post has more details on the flow, including moderation steps.

Targets

We’re aiming to have an initial version of the pattern directory launched in conjunction with WordPress 5.8. For the initial launch,

  • Anyone will be able to browse through patterns on the directory web site, based on pattern categories, or by searching
  • Anyone can see a live preview of a pattern, and use it on their site by copying the block code
  • WP.org users will be able to create and share Block Patterns, view and manage their submitted patterns
  • Patterns will be able to pick from a set of curated images and media to use, but no uploading your own media
  • Submitted Block Patterns will go through some basic validation/automated moderation
  • The block editor will search and fetch coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. patterns from the directory

Once we have a working directory, these are some of the next ideas:

  • The directory will be in English at launch, but we are thinking about how to internationalize the directory and available patterns
  • Forking an existing pattern to iterate on it, or to translate it
  • Improve the media collection for use
  • Add 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. for searching and browsing third party patterns from the block editor

Where to contribute

The development work is all happening on 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/, WordPress/pattern-directory. If you want to help, or share feedback, comment on any of the GitHub issues (or create one). You can also find most of us in #meta 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/., or share your thoughts and suggestions in the comments below.

+make.wordpress.org/themes/ +make.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//design/

Thanks to @tellyworth for reviewing this post.