Welcome to the Gutenberg Editor

Of Mountains & Printing Presses

The goal of this new editor is to make adding rich content to WordPress simple and enjoyable. This whole post is composed of pieces of content—somewhat similar to LEGO bricks—that you can move around and interact with. Move your cursor around and you’ll notice the different blocks light up with outlines and arrows. Press the arrows to reposition blocks quickly, without fearing about losing things in the process of copying and pasting.

What you are reading now is a text block the most basic block of all. The text block has its own controls to be moved freely around the post…

… like this one, which is right aligned.

Headings are separate blocks as well, which helps with the outline and organization of your content.

A Picture is Worth a Thousand Words

Handling images and media with the utmost care is a primary focus of the new editor. Hopefully, you’ll find aspects of adding captions or going full-width with your pictures much easier and robust than before.

Beautiful landscape
If your theme supports it, you’ll see the “wide” button on the image toolbar. Give it a try.

Try selecting and removing or editing the caption, now you don’t have to be careful about selecting the image or other text by mistake and ruining the presentation.

The Inserter Tool

Imagine everything that WordPress can do is available to you quickly and in the same place on the interface. No need to figure out HTML tags, classes, or remember complicated shortcode syntax. That’s the spirit behind the inserter—the (+) button you’ll see around the editor—which allows you to browse all available content blocks and add them into your post. Plugins and themes are able to register their own, opening up all sort of possibilities for rich editing and publishing.

Go give it a try, you may discover things WordPress can already add into your posts that you didn’t know about. Here’s a short list of what you can currently find there:

  • Text & Headings
  • Images & Videos
  • Galleries
  • Embeds, like YouTube, Tweets, or other WordPress posts.
  • Layout blocks, like Buttons, Hero Images, Separators, etc.
  • And Lists like this one of course 🙂

Visual Editing

A huge benefit of blocks is that you can edit them in place and manipulate your content directly. Instead of having fields for editing things like the source of a quote, or the text of a button, you can directly change the content. Try editing the following quote:

The editor will endeavor to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.

Matt Mullenweg, 2017

The information corresponding to the source of the quote is a separate text field, similar to captions under images, so the structure of the quote is protected even if you select, modify, or remove the source. It’s always easy to add it back.

Blocks can be anything you need. For instance, you may want to add a subdued quote as part of the composition of your text, or you may prefer to display a giant stylized one. All of these options are available in the inserter.

You can change the amount of columns in your galleries by dragging a slider in the block inspector in the sidebar.

Media Rich

If you combine the new wide and full-wide alignments with galleries, you can create a very media rich layout, very quickly:

Accessibility is important — don’t forget image alt attribute

Sure, the full-wide image can be pretty big. But sometimes the image is worth it.

The above is a gallery with just two images. It’s an easier way to create visually appealing layouts, without having to deal with floats. You can also easily convert the gallery back to individual images again, by using the block switcher.

Any block can opt into these alignments. The embed block has them also, and is responsive out of the box:


You can build any block you like, static or dynamic, decorative or plain. Here’s a pullquote block:

Code is Poetry

The WordPress community


If you want to learn more about how to build additional blocks, or if you are interested in helping with the project, head over to the GitHub repository.


Thanks for testing Gutenberg!

👋

I’m Blue: My Next Chapter

Today is my last day at Boston University, a place that I have worked at for nearly two years. I am extremely excited to start my new full-time job on Monday as a WordPress Core Contributor at Bluehost.

Contributing to WordPress is very important to me. I believe in what WordPress represents and the doors that it opens for millions of people. I am excited that I can now focus entirely on contributing to and making WordPress better.

As I reflect on my time at Boston University, there are things I won’t miss about working here (*cough* traffic *cough*), but there are many more things that I will miss. My department, Interactive Design, and the University as a whole is full of amazing and inspiring people. If you are in the Boston area and are looking for work, I highly recommend that you reach out.

I was encouraged to grow by attending conferences, including being sent to Paris in 2017 to attend the WordPress Community Summit (one of my proudest professional moments) & WordCamp Europe.

I think about some of the projects I had a hand in:

  • Questrom School of Business
  • College of Arts & Sciences
  • Of Hoops & Healing (Winter-Spring 17 Bostonia feature)
  • I helped re-engineer the internal (soon to be open sourced) theme framework that runs a large percentage of BU websites to make it easier to build on.
  • I helped implement a pull request/peer review workflow that included coding standards checks using CodeClimate.
  • Created a banner plugin called BU Banners that will be activated on every new site moving forward (also soon to be open sourced).

And these are just the things that come to mind as I write this.

After today, the scarlet will fade to blue, but I’ll always be thankful for my time and experiences at BU. ♥️

WordPress Boston – March

Last night, I gave a short talk at the monthly Boston WordPress meetup about what plugins I use. Below is the list, in case you wanted to look into them and try them out.

And finally, my absolute favorite, must have plugin.

Query Monitor – John Blackbourn

What are your favorites? Comment below!

WordCamp RI 2017

Today, I will be giving a talk at WordCamp Rhode Island. Even though I am an organizer for WordCamp Boston and the WordPress Boston meetups, I have always considered WordCamp Rhode Island as my home WordCamp. I have spoken every year since its inception (previously WordCamp Providence).

This year, my talk is titled “Coding Standards: What They Are and Why You Should Follow Them”.

Slides

You can follow along during my talk with my slide deck if you would like.

Slide Deck

Below, is a list of links to things mentioned in my talk.

WordPress Coding Standards
WordPress Core Trac Tickets
Code Linting Resources
Services

Space Exploration is Awesome

Space exploration has always been fascinating to me, both manned and unmanned. There is something about the unknown vastness of space that provokes endearing curiosity. The Cassini-Huygens project has fed that curiosity for years, but will stop doing so later this week.

The New York Times posted a great article last week detailing the impending demise of the Cassini-Huygens spacecraft, an unmanned space probe that has been pestering Saturn and its moons over the last 13 years. While the Huygens part of the craft (a probe designed to separate and land on Titan, one of Saturn’s moons) has been dead since 2005, the Cassini part of the craft has been weaving in and out of Saturn’s rings and moons collecting data, photos, and even sounds for over a decade.

So Long. Farewell

On Friday, September 15th at approximately 7:53am EDT, Cassini will descend towards Saturn where it will transmit its last messages and disintegrate into the atmosphere. The article’s video does a great job of detailing the whole project and illustrating the final descent of the elder spacecraft.

Rest in peace.

Be sure to check out the original article.

vvv-custom.yml Files – Show Me Your’s, I’ll Show You Mine

Update 5/18/18: Added entries for 4.8 and 4.9. Also, configure the highest version of PHP officially supported for each version.
Update 6/9/17: Added entry for 4.7.

With version 2.0 released of the Varying Vagrant Vagrants project, it is now much easier to configure your local VVV environment to your liking. Adding additional sites that are created and configured with a single command is easy breezy.

Tom Nowell wrote a great breakdown of what is new in version 2.0, and the documentation on the VVV website goes into great detail on the different configuration options available to you. I also recommend reading through the README file for the Custom Site Template repository (which your custom site definitions will most likely use for provisioning instructions). I am not going to cover the changes or the different options or settings in this post, so feel free to read through these links to get up to speed.

My vvv-custom.yml File

Recently, during the 4.7.4 release process, I was helping to test the built package files generated for the maintenance release. In addition to the 4.7.x version being updated, some changes were backported all the way back to the 3.7 branch (currently, the oldest maintained version of WordPress).

I realized that I did not have anything set up for testing older versions of WordPress when I started testing the builds. So, I spent a few minutes expanding my vvv-custom.yml file to accommodate this need.

Here is my current vvv-custom.yml file with some of my personal and work sites removed. In addition to the two default sites (wordpress-default and wordpress-develop), I include a multisite environment, and each WordPress version back to 3.7.

Share Yours

What does your vvv-custom.yml file look like? Do you have any cool tricks worked into yours? Share them below!

Why I WordCamp: A Reflection

I had an experience at a WordCamp in 2016 that I wanted to take a moment to share. It was unexpected and made me reflect on my involvement in the WordPress community and why participating is so important to me.

Let’s travel back to 2014. I was teaching a workshop called Plugin Development from Scratch at WordCamp Providence (now WordCamp Rhode Island). This would be my third year in a row speaking at this WordCamp, but it was my first time running a workshop. Participants would learn how to build a plugin using basic WordPress action and filter hooks, APIs and best practices.

As I was going around the room to answer the questions people had, there was one person that had many more questions than the others. I spent as much time with her as I could while continuing to run the workshop. I could tell something was not quite making sense to her yet and did my best to explain things to her.

The workshop went on and eventually came to an end. The participants slowly filed out of the room until there were only two people left: the person with all the questions, and myself. She had a few more to finish off the day, so I spent some more time with her to ensure she had the pieces she needed to continue on her own.

WordCamp ended, and I went on with my daily life. When the next WordPress meetup came around, the person from my workshop showed up. She had more questions related to the material in the workshop and told me that she was determined to get her example plugin to work.

This went on nearly every month for a year. She continued to show up with questions ready to learn. WordCamp RI 2015 & 2016 came around and she volunteered, helping to organize both years.

At the speaker’s dinner for WordCamp RI 2016 I had a chance to catch up with her. It had been several months since our paths had crossed at a meetup, and she, of course, had a handful of questions for me. This time was different, though. Her questions were far more advanced than the last time we had talked.

“I am really impressed, Karen. You’ve come a long way!” I told her.

“It’s all because of you. Your workshop changed how I saw everything. Because of the way you explain things, something clicked. And all of a sudden, everything made sense.”

When I was driving home I reflected on what she said to me. It caught me off guard. I always contribute to WordPress and speak at WordCamps because I enjoy it. But I had never thought about what impact the things I said would have on the people who attended my talks.

Because I took the time to teach a workshop (that I was afraid no one would receive any benefit from) and answer some questions, someone received a level of clarity that helped them understand WordPress better. And this improved their ability to make a living on WordPress.

I started to think back. I was once that person. We all were. Even though we may not be able to trace our own eureka moment back to an individual person’s instruction at a workshop, the collective pointers that we receive from the people we interact with in the community play just as much a part of our skill sets as the long hours spent at the keyboard combing through the files in WordPress Core.

No matter what level your skills are at, there is always someone who can learn from you. Don’t be afraid to offer help. Open source a project you have been working on. Answer questions in the support forums. Attend local meetups. Speak at WordCamps. Translate plugins & themes. There is a way to contribute to the community for every person.

This is why I love the WordPress community. The number of people willing to take the time to teach, mentor, give guidance. Everyone belongs, everyone has a right to be there. WordCamps pull all of these people from all walks of life together to collaborate, to help, and to learn about WordPress.

This is why I WordCamp.