Yalla Download

Created by James Koster, (@jameskoster)

As the name suggests, the WordPress Design Library is a library of WordPress design assets, enabling anyone to quickly create design prototypes for WordPress UI in Figma.

These tools are useful for designers when creating new UI and for anyone looking to contribute ideas, enhancements, or even solutions to bug reports. Sometimes pictures really do speak a thousand words.

In this post, we’ll talk about some key features of Figma before diving into a practical example that demonstrates some of the WordPress Design Library utilities.

What Is Figma?

Figma is a collaborative design tool that members of the WordPress project’s design team have been using for several years to work on and share design concepts. It offers a variety of handy features such as: in-browser access, rich prototyping tools, component libraries, code inspectors, live embeds, inline commenting, plugins, and much much more.

Perhaps best of all, it is totally free to sign up and start playing around. If you join the WordPress.org Figma organization (instructions below), you’ll gain access to the WordPress Design Library enabling you to design WordPress UI in no time.

What Is the WordPress Design Library?

In Figma, you can share components and styles by publishing them, transforming your file into a library so that you can use instances of those components in other files.

Figma.com

It may be easiest to think of the WordPress Design Library as a visual representation of all the javascript components that compose UI in the WordPress codebase. As an end user of the library, you can use those components in a self-contained environment to create new interface designs. It’s kind of like a big LEGO box containing all the UI pieces (buttons, form inputs, etc.) that you can use to create and try out new designs.

Creating designs with these assets enables rapid ideation on new interfaces by removing mundane processes that one would ordinarily have to work through. Nobody wants to repeatedly double-check that the button they made perfectly matches the buttons rendered by the code! And on the flip-side of that coin, anyone sharing a design with others will generally endeavor to make specific elements (like buttons) match what exists in the code as closely as possible. The WordPress Design Library solves both these headaches and more.

An additional benefit to these assets visually matching what exists in the codebase is that any designs you create with them will inherently make use of the latest WordPress design language and consequently feel like WordPress with almost no effort required. Passing such designs on to developers makes them easier to interpret and implement too.

Figma Fundamentals

Before getting into the practical section of this post, let’s quickly cover some of the fundamental features of Figma libraries. This will help prepare us for working with the WordPress Design Library.

Components

As we touched on above, the library consists of “components” that serve as visual counterparts to their code-based equivalents. That is to say, there is a Button component in Figma, and a matching Button component in the WordPress codebase.

But what is a Figma component?

Components are elements you can reuse across your designs. They help to create and manage consistent designs across projects.

help.figma.com

Let’s quickly explore some of the properties of Figma components to understand the ways they help when working on our next design.

Variants

Some Figma components offer variants. One example is Button(s) which all have the following states:

• Resting
• Hover
• Focus
• Disabled

These can be manipulated via the variants interface in Figma:

Other examples of components with variants are form inputs and menu items. Variants are a new feature in Figma, so we’ll be adding more over time.

Overrides

Although any components you insert are intrinsically linked to the master component in the library, it is possible to override some properties.

While working with an instance of the Button component, you can change things like the label, or even the background color, while maintaining the link to the master component in the library. If you’re familiar with git workflows, this is kind of like creating a local branch. Any changes you make can easily be reset in a couple of clicks.

Overrides made to your local instance will persist even when the master component is updated. So if your design calls for a button with a green background, you can apply that override safely with the knowledge that even if the master component is updated, your button can inherit those updates and remain green.

---

We’ve only really scratched the surface of components here. So I would recommend the official Figma documentation for more advanced information.

Figma Styles

In addition to components, styles are also published as part of the WordPress Design Library. They have similar properties to components in that a master style exists in the library and can be utilized in your local Figma file. Just like Components, Styles will receive updates when changes to the library are published.

Styles are used to define colors, typographical rules, and effects like drop-shadows present in the WordPress codebase. They enable you to apply things like text or background colors that will match other UI parts.

Using Styles from the library, you ensure that your creations match existing UI elements, making it easier to implement.

---

To learn more about styles in Figma, I recommend the official documentation.

Views and Stickers

“Stickers” are simply arrangements of Components and Styles that have been combined to represent common UI elements. They are not good candidates for full componentization due to their frequent customization needs. Examples of Stickers include the Inspector sidebar and the block inserter:

Their utility is simple: find the sticker you need, peel (copy) it from the WordPress Design Library, and stick (paste) it into your local file before customizing as needed.

Stickers are not Figma features like Components and Styles, but any stickers you copy to a working file will stay up to date by virtue of their underlying assets.

Views are arrangements of components, styles, and stickers.

Designing a Block Using the WordPress Design Library

Okay, now that we have a handle on the basics of Figma libraries and their features and the utilities of the WordPress Design Library like Stickers and Views, let’s work through a practical example – designing the UI for a brand new block.

Getting Started

All you need to get started is a Figma account added to the WordPress.org Figma organization.

Once you’ve signed up at Figma, simply join the #Design channel on the community Slack and request an invite. Include your Figma username, and a friendly community member will help get you set up in no time.

Now the fun begins!

To create a fresh new design file in Figma, visit the Gutenberg project and click the “+ New” button.

Now let’s include the WordPress Design Library in our working file so that we have access to all the goodies we’ll need:

1. Open the “Assets” panel and click the little book icon to view the available Team Libraries.
2. In the modal, toggle the WordPress Design Library on. You can leave the others off for now.

After closing the modal, you’ll notice a number of components become visible in the assets panel. To insert them, they can be dragged on to the canvas:

It’s kind of like inserting a block

Creating a Pizza Block

I love to eat pizza, so for fun, I’m going to design a new block that simply allows the user to display a delicious pizza in their posts and pages. I want the block to include options for a total number of slices and different toppings.

Work Out the Flow

I always like to concentrate on individual flows when designing blocks. That is to say, the linear steps a user will take when working with that block. In this case, I want to create visualizations of the following steps/views in our Figma file:

1. Inserting the block from the Block Inserter
2. The Pizza Block placeholder state including options in the block, its Toolbar, and the Inspector
3. The configured Pizza Block settings
4. The end result – a delicious pizza sitting comfortably on the canvas

Sketch the New States

Thanks to the WordPress Design Library, I’ll be using as many existing UI components as possible, but I still need a rough idea of how they will be composed in the new interfaces that my Pizza block will require. I normally find it helpful to sketch these out on paper.

Here’s the placeholder state which users will see when they first insert the block. This should be all I need:

Prepare the Views and Stickers

Helpfully, there are Views in the WordPress Design Library I can use for each of the steps in the flow outlined above.

I open the library, navigate to the Views page, find the views I need, copy them, and paste into my working file.

It is very important to copy (not cut) Views from the library so that they remain intact and other people can still access them. If you cut them, they’ll be gone forever, so please don’t do that

I’m also going to need a block placeholder sticker, so I navigate to the Stickers page, copy the one that most closely resembles my sketch from before, and paste it into my working file.

As with views, please only copy stickers; do not cut them.

Gather the Components

Referring back to the placeholder state I sketched out on paper (it can be helpful to import this into your Figma file), I can see that I’m going to need some form elements to realize the design.

I navigate to the Assets panel, locate the components I need, and drag them into my file:

Helpful tip: Once a component has been inserted, you can transform it into another component via its settings panel. Sometimes it is easier to copy/paste a component you already inserted and transform it this way, rather than opening the assets panel over and over.

Arrange the Views, Stickers, and Components to Create a Coherent Design

Now that we’ve gathered all the individual pieces we need, it’s simply a case of arranging them so that they resemble each of the steps of the flow we outlined before. This is done with simple drag and drop.

If you’re familiar with software like Photoshop, Sketch, and others, this should feel very familiar.

Once everything is in place, our flow is complete:

I still find it incredible that we’re able to do this in just a few short moments.

Hook up the Prototype

With each step of our flow created, the last piece of the puzzle is to connect them and form a clickable prototype.

I switch to the Prototype panel and create click behaviors by selecting a layer, then dragging the white dot to the corresponding frame.

There are a variety of behaviors that the Figma prototyping tools support, such as a hover, drag, and click. It is even possible to create smart animations. Perhaps that’s something we can explore in another tutorial, but for now, I will refer you to the Figma documentation for more advanced prototyping.

Now that I’ve connected all the appropriate elements, I am able to take my prototype for a test drive by clicking the Play icon:

You can try it too; just click here.

That’s All, Folks!

I tried to keep this tutorial fairly simple and concise; even though we only really got to grips with the basics here, you can see the power of Figma and the WordPress Design Library when it comes to trying out new designs.

The second major release of the year is right around the corner. You might have heard a bit of buzz about full site editing around your WordPress circles, so this post will give you some big picture things to know as well as a few wayfinding links for anyone who wants to know more.

For Site Owners and Operators

If you own and operate a WordPress site, updating to version 5.8 should be a seamless experience, just like any other update. All the conversation around full site editing is very exciting, but shouldn’t be alarming—everything in the next release that relates to full site editing is opt-in. To experiment freely with it, you need a theme that is built for it. Check the links at the end to see a few examples!

For Agencies and Theme/Plugin Developers

If you extend the functionality of the WordPress CMS for clients, updating to version 5.8 should also be seamless. As always, it’s smart to spot-check custom implementations in a staging environment or fully test when the release candidate is made available. Want to test your products and get everything client-ready? Check out any of the testing options below.

For Contributors and Volunteers

If you contribute time and expertise to the WordPress project, you can join us in the interesting work leading up to the WordPress 5.8 release and update your site with the deep satisfaction of a job well done. There is a lot that goes into every release—from design and development to documentation and translation; if you’ve got some time to spare, and want to help support the project that supports the tool that supports your site (whew!), check out the links below.

Resources

• A few block themes: TT1 Blocks, Hansen, Block-based Bosco, Q
• A few focus areas: Gutenberg plugin focuses
• A few ways you can test: Gutenberg plugin, Beta testing plugin, Gutenberg Times nightly build
• A few pieces of documentation: Full Site Editing Overview

In this episode, Josepha discusses the importance of co-development and testing for the continued growth and maintenance of the WordPress project. 

Have a question you’d like answered? You can submit them to wpbriefing@wordpress.org, either written or as a voice recording.

Credits

• Editor: Dustin Hartzler
• Logo: Beatriz Fialho
• Production: Chloé Bringmann
• Song: Fearless First by Kevin MacLeod

References

• 2.5 Usability Testing Report 
• WordCamp Europe 2021
• Pune Work Along (Self Study) Meetup
• French Mini-Translation Day, April 30, 2021
• April 14, 2021, Full Site Editing Go/No-Go Demo Recap
• Full Site Editing Go/No-Go Next Steps
• Test WordPress.org

Transcript

0:10

Hello, everyone, and welcome to the WordPress briefing, the podcast where you can catch quick explanations of some of the ideas behind the WordPress open source project and the community around it, as well as get a small list of big things coming up in the next two weeks. I’m your host, Josepha Haden Chomphosy. Here we go!

0:39

Prior to Gutenberg, our current multi-year project that is changing the way we see WordPress, another multi-year project changed the way we saw WordPress. Starting in 2008, substantial changes to the WordPress interface came in a series of major releases, starting with WordPress 2.5. That was before my time in the project; I’ve only ever worked with the current dashboard in WordPress. But, from what I’ve read, the user testing that would have gone into it was a huge undertaking and very well coordinated. Now, WordPress has not taken on that type of robust testing project since, but starting around 2014 or 2015, a community testing practice was started. I’ve shared these calls for testing frequently, both on Twitter and in this podcast. But you may not really know why I find the testing program so valuable. So today, I’m going to explore with you the concept of co-developers in open source.

1:52

Open source software, like WordPress, is built by the people who show up. There are a few obvious groups when you think of software, the developers, designers, technical writers, folks who monitor the forums, and really, all the teams you find in our WordPress project. Co-developers or co-creators, if you’ll join me in making our tent a little bigger, refers to the users of an open source product who actively engage and contribute to the work by using the software and sharing any bugs that they find.

2:25

I mentioned this group in the episode about how WordPress improves. Specifically in that episode, I underlined that if you consider users to be part of the collaborative process, as long as people use your product, those people will have opinions about your product’s needs. And today, I’m extending that thought a bit further to say that, as long as there are opinions, there are opportunities.

2:51

When you know what isn’t working, you can focus your attention on a solution, you can focus on making sure that you can make it work. The existence of co-creators is one of the great things about open source. No designer or developer or product owner has to know every sort of user to be able to get feedback from them. If they show up, test the software and get their thoughts written down, then you can start to see patterns and common pain points. It is also, unfortunately, one of the great difficulties of being an open source project. After all, if users don’t show up, or don’t test, or don’t write down their feedback, it’s impossible to know what worked for them and what didn’t. And on top of that, with such a large percentage of the web being supported by WordPress in this case, not every problem is part of a pattern. And not all patterns are part of the current priorities.

3:54

Looking beyond that double-edged sword. Let’s say that this idea of a co-creator makes sense to you. And more than that, you feel like it describes you. What does it mean for you to show up in WordPress? There are lots of good ways to offer this sort of feedback and contribute to those patterns that can help us see through the fog. So I have for you a mini list and, of course, a bunch of links in the show notes for you. 

So some good ways. First, you can participate in any of the dedicated calls for testing. They are short and frequently have a guide. I participate in them and generally find them fun. I say generally because sometimes I also find them frustrating. That’s really okay too; the frustrations helped me to identify that I found a problem. And if I can find a problem, then I have saved someone else from finding that problem in the future. The second thing you can do is file a bug report with information about what happened when you ran into a problem and how someone like me could make your bug happen on their site. Bug

5:00

Reporting is one of the things I’ve grown to really love in my time and open source; I did not love it. At first, I was really scared to do it. I mostly used to send videos of the bugs that I found to other people and ask them to file the bug reports for me. But then, of course, I never knew whether they got fixed or not. So I was scared to do it at first. But once I figured out what makes a “good report,” I felt like I was helping circle hidden treasure on a map or something. I realized also not everyone’s excited about finding hidden treasure on a map. But I play video games and finding hidden treasure on maps is, like, a thing.

5:43

A third really great way to contribute like this is that you can join any community meeting to learn more about what’s happening now and in the future, or just to see what makes WordPress work. As a heads up, these meetings go really fast. And they’re all in text. And there’s sometimes, but not all the time, a little bit of jargon that you have to head to your favorite search engine to find. But I sit in on about half of them myself and get a lot of really good information about things that I’ve been wondering about, things that looked broken, but actually are functioning exactly the way that they should. And I just didn’t want them to function that way. And more often than not, I found out that something that I thought was broken, was already identified and being fixed. Those are three great ways to show up and help give feedback that helps make WordPress better and more functional for more people. 

There are also a few other ways that we see people trying to share that feedback that don’t work quite as well. And I’m going to touch on a few of them just because it’s important to know, as you’re trying to figure out how to get started with this. The first one is just tweeting your frustrations, and I get it like that’s literally what Twitter is for.

7:03

But also it’s hard to create a block from “I am frustrated, behold my hateful rhetoric.” Not that any of you, my dear listeners, ever tweet hateful rhetoric. Still, that is really hard for anyone to figure out what was actually wrong in that moment. Another thing that is not the most functional way to give feedback is review brigading. The Internet rewards this kind of behavior, but I have found at least for WordPress, those false positives and false negatives can be really confusing for our new users. And the third way, that’s not our best way, and probably is the least best way, is just by giving up and not telling anyone what broke for you.

7:45

I know that I already said it’s not possible to fix everyone’s problems. But while it’s not possible to fix everyone’s problems the moment they get shared, it’s also truly impossible to fix any problems that no one knows exist. And so giving up and not sharing an issue so that we can identify it as part of a pattern of problems is probably the least effective way to help us help you get your problem solved.

8:13

This brings me back to the question of the value of WordPress users as co creators in the development process. As WordPress grows, both in usage as a CMS and in participation as a community, it’s important for us to shed the idea that software creation is only about what literally can be done to code or what literally can be done to core or what literally can be done to the CMS. It’s also important for us to constantly remind ourselves that the best outcomes are the result of collaboration with the people who use WordPress the most. I know that not every type of user we have is showing up to give us feedback about where WordPress doesn’t work for them. And I would love to see more feedback that helps us to figure out where our patterns are.

9:03

So the bottom line is this without user feedback that has some clarity of what was expected versus what happened, the work to make a good choice involves a whole lot of guessing. So since open source software is built by the people who show up, I hope this gives you an idea of how you can show up and help improve the tool that powers your sites.

9:32

That brings us to today’s community highlight every episode or so I share either a great story of WordPress success or a great story of a WordPress contributor who helped some folks along the way. Today’s community highlight comes from @trishacodes who shared one of her early to WordPress mentors. She says “@RianRietveld was such an encouragement and helped me find the courage to speak up.” I have had myself many conversations with Rian, and that rings true for me as well. 

10:00

That brings us to the moment you’ve all been waiting for, the small list of big things. It’s actually kind of a medium list. Today, I’ve got four whole things to share with you all. The first thing on my list is that WordCamp Europe is coming, that will be June 7th through the 10th. It’s a multi-day online event. I will share in the show notes a link to the main website; there you can get an idea of what will happen, the schedule, and get your hands on some tickets so that you can get it in your calendar and prepare yourselves. 

The second thing I want to share is for all of our polyglots out there. The French team is planning a translation day coming up on April 30. I will share a link to that as well so that you can get an idea of what that takes if you’re feeling like you want to do some translation work. The third thing I want to share is that the Indian community in Pune actually started a new meetup series. It is a translation work along self-study – also for all of our polyglots out there. I would love to see as many people as are interested in both learning about how to do translations and certainly translating WordPress get registered for that. A final thing I want to share with you all is that if you are curious about what full site editing features will be included in the 5.8 release, that’s the WordPress release that’s coming out in the middle of July, you can check out my recap and recording of the demo that was held with Matt, Matias, and the rest of the team. There’s are also a number of other posts of next step ideas that I will share in the show notes as well.

11:51

That, my friends, is your small list of big things. Thank you for joining in today for the WordPress briefing. I’m your host, Josepha Haden Chomphosy. I’ll see you again in a couple of weeks!

Copy by Anne McCarthy (@annezazu) and Design by Mel Choyce-Dwan (@melchoyce)

In WordPress circles (whether it’s your local meetup, a trusted publication, or your networking group), you may have heard terms like Core Editor, Gutenberg, and the Block Editor used interchangeably over the last four years. And if you’re following contributor work on the project itself, you may also have heard some additional nuances—Gutenberg plugin, Gutenberg, or Block Editor. 

It can get a little confusing, so let’s take a look at four terms that will help you find your way: 

• WordPress – WordPress refers to the open source software but also to the community that surrounds it. 
• Gutenberg – Gutenberg is the code name for a multi-year project to update editing areas for the WordPress software.
• Editor – The editor refers to a section of the software that allows you to update content on your site’s posts and pages. 
• Gutenberg Plugin – The Gutenberg plugin is where early work to update the editor is shared.

The Gutenberg Plugin

Now that we’ve cleared up the definitions, let’s talk about the plugin. When might you use it? What would you use it for? You can think of it as an early access program or a “WordPress lab.” The plugin is updated every two weeks, which means that bugs that have been reported are often fixed and that what you see changes rapidly. 

The Gutenberg plugin also contains features that aren’t yet ready for their WordPress debut but are ready for curious users to test and provide feedback. This is a common practice that allows stable features to make it to your site in WordPress releases while allowing experimental features to be tested and refined. To get a sense of whether using the Gutenberg Plugin might be something you want to explore to get access to earlier features, check out the “What’s New” release posts and the Core Editor Improvement post series. 

Do I Need the Plugin to Use Gutenberg?

It depends on your comfort level! Generally speaking, it is not recommended to use the plugin on a site that has launched and is actively in use unless you’re very comfortable with the code side of WordPress. Fortunately, each WordPress release comes ready to go with multiple versions of the Gutenberg plugin. 

But if you are a keen beta tester who loves reporting feedback, or you feel comfortable navigating how to opt-in/out of the experimental aspects of the plugin, here are a few reasons you might want to dig into what the Gutenberg Plugin has to offer:

• Test new features and give helpful feedback. For example, you can use the plugin to help test Full Site Editing. 
• Get early access to the latest & greatest while navigating when to opt-in or out of experimental features. 
• Prepare for the future whether you’re a theme author, plugin developer, agency owner, etc. 

Do you use the Gutenberg plugin and share feedback on GitHub? Thank you! This kind of feedback is what helps ensure stability in what’s shipped in WordPress releases. 

---

The WordPress mobile apps are the best way to manage your site from anywhere. If you’re already using the app, you might have noticed a new visual design that’s been rolling out. That rollout is complete in WordPress 17.1, which is available today for both Android and iOS. If you’re not already using it this is the perfect time to give it a try!

We add new features and improve the WordPress apps in every release, but our visual design hasn’t changed much in the last few years. Over the last few months we’ve thought about how to modernize the design of the apps. As we’ve implemented features like Dark Mode, we’re taking advantage of new components made available in the latest versions of iOS and Android.  

Bigger, bolder headers call out key product areas and create a distinction between the top level tabs and deeper levels of the apps. A new color palette pairs a more neutral background that lets your content shine with brighter blues that make interactive elements even more noticeable. A new serif typeface is a nod to WordPress’s roots in writing and publishing.

We hope you enjoy these updates as you use the apps and we’d love to hear your feedback. Reach out to us from within the app by going to My Site, tapping your photo on the top right, tapping Help & Support, and then selecting Contact Support.

Here’s a peek at the latest changes in the block editor — subtle-yet-practical enhancements that help you create beautiful posts and pages more efficiently:

• New page layout picker experience.
• Convert text and images into Columns block.
• Improved spacing options for social links and buttons.
• Streamlined behavior of the writing prompt.

Let’s dive in!

New Page Layout Picker

Page layouts are pre-designed templates that make creating beautiful pages a breeze. In this update we focused on improving the layout picker, making it easier to quickly browse different categories and select your layout.

Convert text and images into Columns Block

Transforming one block into another is a nifty trick that can greatly improve the editing experience. With the latest update, text (and images too!) can be automatically converted to a Columns block with the click of a button.

Select two or more blocks (these could be Paragraph, Heading, Image, etc.), click on the grouped block icon, and select “Columns” from the list of transformation options. The number of blocks selected will correspond to the number of columns.

Improved spacing options for Social Links and Buttons

Get creative with new ways to arrange your social links and buttons. This update brings you greater control over spacing and unlocks some neat layout ideas.

The correct alignment will be visible once you finish editing the Social Icons block.

Streamlined behavior of the writing prompt

You’re probably familiar with the writing prompt that greets you every time you start a new post or  page. Until now you’d also see it on every new line in your document. We’re happy to report that’s no longer the case! To streamline the writing process the prompt will now only appear once. There will be no subsequent prompts with every new line — just space for you to write your thoughts without distractions.

You keep building, we’ll keep improving

We can’t wait to see what you build with the improved block editor. In the meantime, we’ll keep new updates coming your way.

Happy editing!

WordPress 5.7.1 is now available!

This security and maintenance release features 26 bug fixes in addition to two security fixes. Because this is a security release, it is recommended that you update your sites immediately. All versions since WordPress 4.7 have also been updated.

WordPress 5.7.1 is a short-cycle security and maintenance release. The next major release will be version 5.8.

You can download WordPress 5.7.1 by downloading from WordPress.org, or visit your Dashboard → Updates and click Update Now.

If you have sites that support automatic background updates, they’ve already started the update process.

Security Updates

Two security issues affect WordPress versions between 4.7 and 5.7. If you haven’t yet updated to 5.7, all WordPress versions since 4.7 have also been updated to fix the following security issues:

• Thank you SonarSource for reporting an XXE vulnerability within the media library affecting PHP 8.
• Thanks Mikael Korpela for reporting a data exposure vulnerability within the REST API.

Thank you to all of the reporters for privately disclosing the vulnerabilities. This gave the security team time to fix the vulnerabilities before WordPress sites could be attacked.

Props to Adam Zielinski, Pascal Birchler, Peter Wilson, Juliette Reinders Folmer, Alex Concha, Ehtisham Siddiqui, Timothy Jacobs and the WordPress security team for their work on these issues.

For more information, browse the full list of changes on Trac, or check out the version 5.7.1 HelpHub documentation page.

Thanks and props!

The 5.7.1 release was led by @peterwilsoncc and @audrasjb.

In addition to the security researchers and release squad members mentioned above, thank you to everyone who helped make WordPress 5.7.1 happen:

99w, Adam Silverstein, Andrew Ozz, annalamprou, anotherdave, Ari Stathopoulos, Ayesh Karunaratne, bobbingwide, Brecht, Daniel Richards, David Baumwald, dkoo, Dominik Schilling, dragongate, eatsleepcode, Ella van Durpe, Erik, Fabian Pimminger, Felix Arntz, Florian TIAR, gab81, Gal Baras, Geoffrey, George Mamadashvili, Glen Davies, Greg Ziółkowski, grzim, Ipstenu (Mika Epstein), Jake Spurlock, Jayman Pandya, Jb Audras, Joen A., Johan Jonk Stenström, Johannes Kinast, John Blackbourn, John James Jacoby, Jonathan Desrosiers, Josee Wouters, Joy, k3nsai, Kelly Choyce-Dwan, Kerry Liu, Marius L. J., Mel Choyce-Dwan, Mikhail Kobzarev, mmuyskens, Mukesh Panchal, nicegamer7, Otshelnik-Fm, Paal Joachim Romdahl, palmiak, Pascal Birchler, Peter Wilson, pwallner, Rachel Baker, Riad Benguella, Rinat Khaziev, Robert Anderson, Roger Theriault, Sergey Biryukov, Sergey Yakimov, SirStuey, stefanjoebstl, Stephen Bernhardt, Sumit Singh, Sybre Waaijer, Synchro, Terri Ann, tigertech, Timothy Jacobs, tmatsuur, TobiasBg, Tonya Mork, Toru Miki, Ulrich, and Vlad T.

Your website is a product of your hard work and passion. Therefore, when your site hits a milestone — it shouldn’t go unrecognized. To make it easier for you to keep track of your site’s achievements, we’ll be rolling out a new celebratory notification that will alert you when your site reaches or surpasses a certain number of views. 

We hope these celebrations are meaningful and motivational for you and that they inspire you to take time to pause, reflect, and celebrate. 

If you have the WordPress app on your mobile, we also have a little surprise for you each time you unlock a milestone! Be sure to update your WordPress app to the latest version. If you don’t have the app yet, download it for free on both Android and iOS.

We’d love to hear your feedback! Reach out to us from within the app by going to My Site, tapping your photo on the top right, tapping Help & Support,  and then selecting Contact Support.

WordPress is open source software, maintained by a global network of contributors. There are many examples of how WordPress has changed people’s lives for the better. In this monthly series, we share some of the amazing stories that are lesser-known.

Embrace Who You Are and Your Journey

In this People of WordPress contributor story, we chat to Tyler Lau from the US on his relationship building work in marketing and his WordPress journey.

Read on to discover his story which shows it is often what you have learned from negative experiences in your life that can make you a major asset to a product team.

An Entrepreneurial Mindset

Tyler recalls he always had a knack for spotting a enterprise ideas. As an industrious seven-year-old, he was already finding ways to make sales during the school breaks. 

While many entrepreneurs have similar stories, Tyler’s path took many turns before he discovered and thrived in the WordPress community.

He was drawn to both the software and the community that surrounds it from his search for personal and professional freedom. He ultimately was able to combine his various business interests and people skills into professional marketing work.

Using your skills to uncover your journey

Tyler’s current role is as a Marketing Relationship Builder, based in Kansas, USA. His responsibilities span across all digital properties and products, leveraging his broad set of business and people skills.

These skills are amplified by his creativity and adaptability. Tyler says that one reason he is always looking for new projects is his Attention Deficit Hyperactivity Disorder (ADHD), a diagnosis he received in 2005.

In an industry built by programmers and developers who often have a strong sense of focus, Tyler felt that someone with ADHD wouldn’t be seen as a natural fit. He found the WordPress community to be a place where everyone can find the right spot for their unique skills. Tyler’s skill is people, and this has translated into many opportunities and responsibilities in his work life. His skills have also helped him give back to the WordPress community as a speaker and volunteer, and through multiple contributor days.

Relationship-building as a career

Most of Tyler’s experience was in the restaurant industry, and his resume did not exactly point to a career in tech. But the service industry actually prepared him well for everything he has taken on since.

When he is at work events, he meets people from across the world and builds connections with them. As an extrovert, he enjoys this and couldn’t imagine a job where he was isolated from getting to know others and relationship-building.

Understanding people and being able to operate in any setting are key competencies. Social skills and tact are useful for community building in the WordPress space too, and in Tyler’s life at different times it has been necessary for survival.

The true meaning of freedom

In the WordPress community, the concept of freedom comes up often. WordPress is built on GPL, free software, and open-source values. Practically speaking, anyone can work remotely or be their own boss to gain more freedom in work and life. Tyler feels that he never fitted into a traditional work mould. With his strong focus on freedom, he found this resonated with the freedom and opportunities he believes WordPress provides him and thousands of others.

Tyler describes how in 2013 his ‘inner opportunist’ got him into trouble. After dropping out of college following a brain aneurysm, he needed capital to fund his first startup. He shares that he found a quick but unlawful way to make money. Alongside this between shifts as a waiter, he worked on prototypes for his first product. The company was growing fast, and to protect his patents and take research and development to the next level, he had to work hard. Everything came to a halt when some of the actions he took resulted in being sent to prison.

He says that meeting other inmates reminded him that he was in a much better situation than most. He was educated, well-off, loved, and knew he had a future once he was released. He found that many inmates never graduated from high school and were computer illiterate. While inside, Tyler taught subjects like science, math, writing, reading, and social studies. He found that due to the lack of skills and support, many inmates would struggle upon release. He believes getting the mental health support and job training needed to thrive after prison is not easy for many.

“There’s more to freedom than just being on the outside. You also need a sense of agency and enfranchisement,” says Tyler. He considered his sense of purpose and support network were plenty to keep him going and was ready to take on his next (legal) business challenge as soon as he could.

Going forward positively 

The idea that your past doesn’t define you and you can choose to embrace it, is a key driver for Tyler.

He describes himself as an outlier in many ways. He recalls how politics influenced his life from the day he was born. Tyler’s father is a semi-dissident Chinese visual anthropologist, his mother is an art professor who left her home country of Japan to break free from traditional Japanese gender roles. Tyler feels he inherited a lot of this fearlessness.

“I’ve never fitted in, and yet this is what makes me able to adapt to most situations and relate to just about anyone. I embrace my eclectic, dissonant past and see beauty in the person those experiences shaped me to be,” says Tyler. 

Now, he’s able to put those skills to good use in the WordPress community and beyond. 

He says: “Regardless of your physical abilities, mental health struggles, upbringing, and even your run-ins with the law, no one is excluded from carving their place in the WordPress industry”.

Contributors

Thank you to Tyler Lau (@tylermaximus) for sharing his #ContributorStory.

Thanks to Larissa Murillo (@lmurillom), Surendra Thakor (@sthakor), Olga Gleckler (@oglekler), Meher Bala (@meher), Yvette Sonneveld (@yvettesonneveld), Abha Thakor (@webcommsat), Josepha Haden (@chanthaboune), Chloé Bringmann (@cbringmann) and Topher DeRosia (@topher1kenobe) for working on the People of WordPress series.

This post is based on an article originally published on HeroPress.com, a community initiative created by Topher DeRosia. It highlights people in the WordPress community who have overcome barriers and whose stories would otherwise go unheard.

Meet more WordPress community members in our People of WordPress series.

#ContributorStory #HeroPress

In this episode, Josepha explores the five groups within the WordPress ecosystem and provides a high-level example of how they interact and support one another. As always, stay tuned for the small list of big things and a contributor highlight.  

Have a question you’d like answered? You can submit them to wpbriefing@wordpress.org, either written or as a voice recording.

Credits

• Editor: Dustin Hartzler
• Logo: Beatriz Fialho
• Production: Chloé Bringmann
• Song: Fearless First by Kevin MacLeod

References

• Get to know WordPress TeamsFive Steps of Volunteer Engagement 
• Community Highlight 
• WordCamp Centroamérica 2021 Online (Schedule)
• So you want to make block patterns?
• Gutenberg Tutorial sign-up

Transcript

Hello, everyone, and welcome to the WordPress briefing, the podcast where you can catch quick explanations of some of the ideas behind the WordPress open source project and the community around it, as well as get a small list of big things coming up in the next two weeks. I’m your host, Josepha Haden Chomphosy. Here we go!

In the first episode of this podcast, I said that there’s a lot that goes into WordPress, that’s really hard to see. One of the hardest things to see about the WordPress project as you get started is the overall structure. There is quite a bit of documentation that can clarify the basics: the names of teams, what they work on, and where, and when they meet. The way that they influence and support each other can really feel like a bit of a mystery. So today, I’m going to break down the WordPress community into five big groups; I want you to keep a couple of things in mind. 

Firstly, these are high-level and based on my observations. Each of these groups can be further broken down into subgroups. So while you may not feel represented in this exact five, you are included if you were to dig a little bit deeper. The second thing to keep in mind is that the makeup of these groups is pretty fluid. Many community members find themselves in more than one group, but generally not far off. Some group two folks end up in group three, depending on the situation, people in group four can also end up in group five, and so on. As with so many things that I share, I’m not trying to insist that one size fits all. I’m not trying to put the WordPress community into a box. This is just a basic framework to understand how it all fits together. Alright, are you ready? I’m ready. Let’s do it!

Okay, I have a broad definition of the community, which I have mentioned before. I believe that the community is anyone who has interacted with WordPress, whether they know it or not. So, I’ll start from way out there and work my way in that first group; we’re going to call our Visitors. 

Visitors are people who arrive at a WordPress site to gain information or engage in an activity. Sometimes they know it’s a WordPress site, but most of the time, they don’t. The second group are Users, people who use WordPress as their CMS. So, that’s website builders, website designers, small businesses, content creators, and the list goes on and on. The third group I like to refer to is the Extenders. Those are people who extend WordPress through the creation of blocks, themes, plugins, and more. There are also people who teach WordPress to others through WordPress podcasts, and newsletters and tutorials. The fourth group I refer to as our Contributors is the people who contribute to the open source software and the infrastructure supporting it, but not necessarily the same people who contribute directly to their own product. And then there’s group five, Leaders. Those are people who help drive the vision and strategy for WordPress; the most notable member of that group is of course, Matt Mullenweg. And I’m also in that group. 

Each of these groups directly influenced the groups on either side. For example, a WordPress user is affected by both visitors and extenders. Imagine a content creator who shares their passion for photography through a WordPress site; this photographer may have visitors that need to purchase photos. In response, the user now has a need to make it possible for visitors to purchase photos on a site. So they go to what we consider the extenders, people who have built a plugin that supports that need. And as a result, that user can install that on their site. And they have have satisfied the need of the visitors to their site, the people who now can purchase photos. 

There are a lot of examples like this in the WordPress project. Every small pattern that you see is mirrored in the larger patterns across our ecosystem. And every large pattern you see in the ecosystem can be seen among our teams. It’s pretty cool to look at really. So, why should this matter to you? From a very practical standpoint, this matters for anyone who’s trying to learn more about contributing to the WordPress project. These five groups mirror very closely the five steps of volunteer engagement that we see across the ecosystem and from a more philosophical standpoint, it’s just kind of nice to know who your neighbors are. Without the influence and support of the groups around us, it can be hard to know whether we’re on the right track or not. So take a look to your left and look to your right, and get to know your partners in this project.

That brings us now to our community highlight, the segment where I share a note about contributors who have helped others along the way, or WordPress success story. This week’s highlight is from @CoachBirgit, Birgit Olzem, a longtime contributor and a friend of mine. Her success story goes like this. 

WordPress has allowed me as a mother of five to leave a toxic marriage for good. 

Later, the community picked me up when I became seriously ill. 

So I can say from the bottom of my heart, that working with WordPress has saved my life.

And now our small list of big things. I’ve got three things for you this week. I think that they’re all very important. And I hope you check them all out. The first one is a reminder that word camp Central America is coming up on April 15 and 16th. If you have not registered for tickets, you still have time, I will share a link to the registration page and the schedule in the show notes below. 

The second thing on our small list of big things is that the Gutenberg 10.4 release is coming out later this week on April 14th. It’s an important release because it’s when we take a look at the current iteration of full site editing tools that we have, and decide if it’s ready to get into the WordPress 5.8 release. There’s a post that has a little more information about that which I will share in the show notes below as well. If you haven’t checked out the Gutenberg plugin lately, obviously I think it’s a good idea to do that in general, but definitely a good idea to check it out now. 

The third thing on our list today is a reminder to check out our most recent block pattern tutorial, I’ll share a link to that in the show notes. It’s this kind of tips and tricks, tutorial, the “show me how to do it,” kind of thing in the style of CSS-Tricks. If you or anyone that you know might be interested in sharing a similar style of tutorial, there’s a link to a form in that show notes as well so that you can share with us your name and the topic that you’re interested in. We’ll take a look and see if it’s something that we definitely need to make sure our users know how to do. So, that my friends is your small list of big things. 

Thank you for joining in today for the WordPress briefing. I’m your host, Josepha Haden Chomphosy. I’ll see you again in a couple of weeks!