WordPress is set to receive a brand new editor, some time this year with WordPress 5.0. Along with this new editor are some new features that themes can opt into. This post will cover what those new features are.
If you only ever read one thing about Gutenberg and themes, though, know this: there is no "Gutenberg theme", and as a theme builder, there's nothing you have to do, to be compatible with the new editor.
As with all things, there may be more features you can opt into in the future. But the editor that will ship with WordPress 5.0 will not require you to make any changes.
While you don't have to do this, you can opt into supporting wide images. Gutenberg specifically supports two new image sizes: wide, and fullwide. Here's a fullwide image:
You can use these alignments on nearly all blocks. Here's the wide alignment applied to a gallery:
When a theme supports wide alignments, blocks get access to two new alignments on the toolbar:
The two last buttons are wide and fullwide respectively. The way your WordPress theme opts into these two alignments, is to paste the following snippet into your functions.php:
add_theme_support( 'align-wide' );
Adding that will make the two new alignment buttons show up, and it will add .alignwide and .alignfull to blocks which have been given these alignments.
The next step to take is to ensure that we have the necessary CSS in place to handle these new classes. The reason you have to opt-in to these alignments, is because the code to do that is slightly more complex than what you need to simply float an image left or right.
What this code does is say every immediate child of the .site-content, except elements with classnames .alignwide or .alignfull, should have a max-width and be centered horizontally. This essentially lets us specify max-widths of 100% for fullwide (use ALL the screen!) or 75% for wide images. You could also specify pixel-widths here.
But what about floats?
The usual way to float an image is this:
Simple. But in a layout with an unconstrained main column, this float would burst out of the main column, and place itself snugly to the extreme left of the viewport. Not what we want. What we want is for it to float alongside the left margin as defined by the main-column max-width we defined previously.
But images in Gutenberg come with extra markup we can leverage. Here's the markup:
The figure here is the same width as the main column, because it was not excluded from the max-width we applied earlier. That means this element is both centered, and has the same margins as the adjecent text. Which means we can just float the image inside this element:
Subtle change, but an important one. We're simply floating the image inside the constrained and centered container. This makes the figure element collapse into a zero-height element, and lets subsequent text float around the image. Just like how we want it.
There are many other ways to support wide images in Gutenberg, but it's important to remember that you don't have to support these alignments, and if you don't do anything, the buttons won't show up in the editor. Hope you'll enjoy using wide images! By the way, this website is now using a theme that supports wide images out of the box, and you can snatch it on Github.
Update, February 24th: The Codepen examples linked in this post have been tweaked slightly, and captions have been added to floated images.
One Automattic "hack day" many years ago, I released Genericons, a font containing a bunch of little icons useful for blogs and websites. For this years hack day, I created a new version, Genericons Neue. It's visually more coherent and icons are better weighted against each other. The set comes with minified SVG files ready for use, as well as an icon font if you want to use that (buyer beware). If you're a fan of Node, there's a module you can install. It's super easy to use, and I encourage you to use the set, fork it, customize it, and bundle it with your themes.
The original Genericons set was created for the WordPress Twenty Thirteen theme. A goal for that theme was to be colorful, and in order for that to work, icons for tags, categories and comments had to be easily re-colored using only CSS, something which PNGs did not allow. SVG support wasn't impressive at the time, and so Genericons became an icon font. Inspired by The Making of Octicons, Genericons were pixel-perfectly drawn in Glyphs Mini. It was quite an arduous process.
Genericons Neue is focused fully on icons, so all logos have been removed — more on that in a bit. The set now use grunt to build everything from the minified SVGs to the icon font. The build process is like a black box: you feed it a folder of SVG icons you drew, and it outputs formats ready to be used in your themes and web projects.
If you're coming from Genericons, do note that there are no logos in Genericons Neue. Because Genericons was so early to the icon-font game, it more or less became a kitchen-sink for icons and logos. First just a few logos — "the most important ones" — then slowly it grew into too many. There were a bunch of little dingbats and one-offs, like triangles for CSS speech-bubbles today better done using just CSS alone. It was useful at the time, but it diluted the focus on being a great and consistent set of icons. On top of that, logos present unique challenges. Aside from having to be kept up-to-date with rebrandings, how should they be sized? Every logo is drawn on a unique grid, they don't all fit well on a tiny pixel-perfect grid.
If you would like to upgrade from Genericons to Genericons Neue, you can use logos from a different set, such as Social Logos. If you are only using the icons also present in Neue, it's a drop-in replacement as the icon font will map to the same codepoints.
One thing that’s always boggled me is the increasing fascination with drinking coffee out of cardboard cups. Part of my fascination stems from the fact that it seems like a huge waste of resources — you could be making virtual reality goggles from that cardboard! But most of my curiosity has to do with the indisputable fact that coffee tastes worse out of cardboard.
I consider that truth to be self-evident. The delicious nectar that is coffee deserves better than to be carried in laminated paper and guzzled through a tiny hole in a plastic lid.
I get it, I get it, you can take a cardboard mug with you on your commute, or as you’re walking down the street, or as you’re waiting in line, and coffee through a plastic lid is better than no coffee at all.
But I’ve seen things you people wouldn’t believe. I’ve seen people in non-commute non-transit situations pick cardboard over glorious porcelain — intentionally and of their own volition and not while under duress (I checked to make sure).
Usually I can even all I need to. But when it comes to coffee, and porcelain is an option, and you still choose cardboard… I’m all out of evens. At that point, I can’t even.
One time I stopped a good friend as he was doing it, and like a concerned parent I asked him why he would pick the cardboard over the porcelain when both options were right there in front of him, in plain sight, literally on the table. He answered:
I like the idea that if I need to go somewhere, I can take the coffee with me.
Okay, that’s actually a fair point.
I mean, I’d just gulp down the coffee from the porcelain and then go ahead and grab another one in cardboard to bring along, but sure, the above is a cogent argument.
Still, I can’t help but feel like cardboard coffee is becoming a status symbol outside of just mobility: “Look at me, I’m on the move!” And that makes me sad. It makes me even sadder than it does when people add sugar to their coffee.
It was a day like any other, and it was an innocently looking article like any other. But on this one day, this one particular article and this one paragraph in particular that just missed my good side entirely:
Jim Carrey brought us our first live-action taste of Count Olaf from A Series of Unfortunate Events, but Netflix's upcoming TV series adaptation is (thankfully) going in a different direction.
It's an article from The Verge. It's nothing out of the ordinary, and I like this publication perfectly fine. I hold no grudges against the author either — this could've been published in any fine recent publication. All's good on that front. I'm also not a particular Jim Carrey fan these days, that doesn't change a thing. It's just, this one day, that last sentence got to me.
but Netflix's upcoming TV series adaptation is (thankfully) going in a different direction
On this day — it'd been snowing, by the way, it was rather pretty outside — this one sentence reminded me of everything I loathe about modern online discourse. I read this sentence — and I invite you to correct me, gosh I hope so much that I'm wrong about this — as an off-hand dismissive critique of the older film Lemony Snicket's A Series of Unfortunate Events, starring Jim Carrey, Emily Browning and Liam Aiken. The sentence seems to suggest that this older film is so atrociously bad that the new Netflix series (which I welcome) thankfully goes in a different direction. THANKFULLY! THANKFULLY!!
It's fun how bright the day can look when snow covers the ground. Yet inside of me, my heart held only darkness.
The 2004 movie is one of my favorite movies of all time. I dare you to watch the following deleted scene, and not at least have a tiny appreciation for the music and the visuals. Gorge on those trees.
This scene ends on a simple note: There's always something. And this film has just that: something. I heartily recommend it to you. Watch it tonight, I'm sure you can stream it.
While I mourn the lack of a sequel, I'm not objecting to a Netflix remake, I welcome it. It's a wonderful story, I'd love more. What I mourn is that we can't respect creative work for what it is. Today we apparently have to hate something that wasn't a runaway box office success and the beginning of an endless franchise.
There are no levels on which I don't adore this film. It's okay if you don't.
Lately it just feels like everyone hates everything. Because it's easier to dismiss something, than to like it. Because if you like something, you put yourself out there. You reveal to the world what makes you happy, what makes you cry, what makes you reflect, cope with, or just enjoy life. Someone might make fun of you for loving something, so it's easier to hate it. It's breeds a culture of antagonism, and while it might protect you from occasional ridicule by people not worth your time, it also insulates you from possibly discovering something amazing.
If only we could see past arbitrary notions of what's cool to like, and judge movies and music and books on their own merits. Because there's always something.
It happened. My 4 year old has found a franchise to latch on to. It’s not ideal: the one thing I’m the most allergic to in the world is horses. But if she’s into ponies she’s into ponies and there’s nothing I can do about that except embrace it. She’s got the toys, she’s got the bed-blanket, she’s got the t-shirt, and her favorite pony is Rainbow Dash. It’s a thing.
As an overprotective curling-dad, I consider it my solemn duty to learn about this thing that’s absorbing her attention. So I have been watching the show with her, trying to soak up the pony lore, learn of the details that make out this equestine construct.
The show follows Twilight Sparkle, a purple unicorn, as she visits “Ponyville” — the shining gem of the land of Equestria. You know… from equo in latin? Horse-land? Get it?
Twilight makes friends in Ponyville. Several of them. And she’s taught that though they are all different in appearance, interests, personality and even race, their friendship is the most important thing there is. When they’re all together, their friendship is literally magic. It’s in the tagline.
Sounds good right? It’s perfectly fine that my daughter watches such a diverse, female-positive and all-embracing show, right?
One of my favorite episodes of Lost — bear with me — is the one where wheelchair-bound John Locke cries “Don’t tell me what I can’t do!” and then goes on a walkabout. This is at the core of the values I want my daughter to learn: if she can dream it, she can do it. For that reason I already know the answer to questions she might one day pose to me: “Can I be an astronaut, dad?” YES. “Can I be at the Olympics, dad?” YES. She’ll learn eventually that it might not be a walk in the park, but there’s no reason she should have some sort of arbitrary mental block put in place by me, preventing her from even trying.
Which brings me to Equestria. In Ponyville, there are three races of ponies. The ponies you know, unicorns who have magical powers, and pegasi who can fly and make it rain. They all live and work together seemingly in perfect glittering harmony.
How does this even work? How aren’t the only-ponies perpetually jealous of the other two races?
Ponies are literally born with predisposed skills. Unicorns have magic powers, one of them being that they can write. Pegasi can fly. Sorry Applejack, I suppose you have to manually pluck those apples for selling on the market to make ends meet. If only you were a unicorn you could just use magic, but hey, life’s tough right? Applejack is basically caste-blocked from ever advancing beyond her racially defined place in society.
The fact that only unicorns can write has its own problems. History is written by those who can, well, write… right? I hope everyone trusts the unicorns to be truthful. Better not upset them.
Ever noticed how My Little Ponies have back-tattoos? Applejack has apples, Pinkie Pie has balloons. Those are literal coming-of-age tattoos. Puberty isn’t mentioned, but it’s implied that once a pony reaches that age, whatever “talent” they have is stamped on their back. Forever. A visual indicator of what you are.
The stamps are called cutiemarks.
Back-tattoos aside (some of those are really lovely, I’m sure) I don’t know that I appreciate the idea that you even can have a talent as such—how about those 10,000 hours? What about multiple “talents”: which one gets stamped on you? And why does your one talent need to be permanently advertised to the world? What if your talent is not showering? If you’ll indulge me as I recall a history lesson about mechanical vs. organic societies, this “know your place” undercurrent that permeates Ponyville is a trait I do not find attractive. Also, if I am to ever get a back-tattoo I want it to be something I choose to get. Probably a japanese glyph I think means “fire” but in fact means “toast”. Something I can laugh at years down the line, not something that forever defines my place in the world.
Another observation was that every single pony in Ponyville is either beautifully styled and coiffed at all times. Or an unsightly donkey dragging a cart with a grumpy look on their face. In fact I don’t think I’ve seen a single handsome donkey on the show. They’re like morlocks.
One of the dude-ponies was called “Shining Armor”. A bit on the nose, eh, Lauren Faust? Also, why weren’t there any any girl knights? My daughter happens to love playing knights and princesses. She’s the knight, I’m the princess.
I don’t know what the lesson is. I think I wanted to vet the show, but having now watched one too many episodes with my daughter on the couch, I’m not sure there’s really a lesson to learn here.
Selma likes ponies, she likes watching them on the television with me. Perhaps she doesn’t have to learn about societal norms and expectations and caste systems and harmful stereotypes through a kids show about magical ponies, at age 4. She likes Rainbow Dash, and I think it’ll start and end with that.
A popular brand uses this as their tagline, and it’s always annoyed me terribly.
I was brought up to know that as a human I have inherent value. I try to raise my daughter the same way, so I keep reminding her how much she means to me, bolster her heart to protect her against inevitable douchebags. In that vein, everyone is worth it.
Is worth what, exactly?
This brand sells … perfume? Face cream? I can’t even recall, and I don’t even care. The point is, their tagline is pointing out that you deserve to spend your money on their product. Well what if I can’t afford the product? Does that mean I’m not worth it?
We’ve been over this. The human condition is tough. Things don’t always go as planned. Some people get a particularly short end of the stick of life. There’s no justice to it, just wanton cosmic random chance. Whether you end up able to afford the face cream you’re worth is entirely up to a unique combination of the absence of bad luck, decades of hard work, and growing up in a place where such hard work pays off as it should.
I don’t usually watch TV, so I’m mostly spared zapping by beautiful models parrotting off the tagline in a bubbly tenor. Thankfully, because I think I’d go insane. In a world with people who would take medicine, antibiotics or clean water over a goddamn face cream, the phrase cuts me like a knife on a blackboard.
Everyone is worth it. I believe it’s in a charter somewhere.
All human beings are born free and equal in dignity and rights. They are endowed with reason and conscience and should act towards one another in a spirit of brotherhood.
If blocking becomes widespread, the ad industry will be pushed to produce ads that are simpler, less invasive and far more transparent about the way they’re handling our data — or risk getting blocked forever if they fail.
That's a load of manure.
A big part of the problem is how slow the ad industry itself has been to adapt. To this day most ads are still big squares (300×250) or giant skyscrapers (120×600). They're not hi-DPI, they're not responsive, and they're usually ugly blinking GIFs. With all the technology we have available to us today, you'd think we'd be able to see better ads at this point.
Ads don't offend me. Well some specific ads do, but the idea of exchanging my attention for a free service such as reading news on the web, that doesn't offend me. I'm an adult, I can make an informed decision as to which services I will leave my data with, whether those services are free through ads or are entirely paid.
The problem creeped up on us slowly: the more attention you could sell, the more money you could get. Ads became bigger and more plentiful. First came popups, then they were blocked. Now we're dealing with full take-over ads, interstitials, lightbox ads, and if you dare browse the mobile web, you'll be looking through blinds in the form of social sharing links at the top, and "dismiss" buttons that don't actually work. It's pretty bad, and it makes browsing websites slower.
In the end, it only takes a few horrible ads to poison the well, and adblocking would eventually become inevitable. It's like television, and Ghostery is the Tivo of the web. With iOS 9 content blockers, adblocking is going to be mainstream fast, and this is where the pullquote above falls apart: ad networks aren't going to get better, probably the opposite.
Today it's possible to make a living running a site that's free to read, solely because of ad revenue. Some can even make a good living. As adblocking grows more widespread, ads are going to be more intrusive to get around this, more guerilla, and even bigger, all in a fight to make the same income off the dwindling flock that still aren't blocking ads. It'll happen to good people that run these sites. Despite their best intentions, their staff have families to feed, and if they just use this slightly larger ad and add an interstitial, things can stay the same for a while and no-one has to be fired.
It would be unfair to blame them. It's human nature: millions and millions of sites aren't suddenly going to see the light at the same time and change their ways all at once. Even if they did, it's unlikely everyone would suddenly stop using adblockers because of this. Once the adblocker is installed, once web-ads have been poisoned by years of bad practices, ads aren't coming back.
John Gruber tweets:
I feel your pain, John. It's the same pain GigaOm felt when they died this year. It's not pretty. And I like Deck ads. They're nice. I agree they shouldn't be blocked. But they're still ads, and adblockers block ads. It's not your fault, it was that monkey ad, remember? Shoulder to shoulder, we stand. Love is a battlefield.
There is no ethical adblocker which blocks only the bad ads and leaves the "good" ads. I'd like to feel like an activist fighting for pure content when I install Marco Arments $2.99 "Peace" ad blocker. I want to believe that by blocking ads, I help force positive change on the advertising companies (and the livelyhoods that depend on them), force them to adapt.
But that's a beautiful illusion. What's more likely is that web ads are going to get way worse, adblocking is going to go way up, and at some point in this arms race, after the death of many a media company, eventually some will indeed have adapted. The big question is whether you'll like the alternatives. It can be apps. It can be inside Apple's Newsstand (featuring unblockable ads). It can be inside Facebooks instant articles. It can be subversive native ads. It can be paywalls. Think in-app purchases: "Pay $1 for this article, or pay by watching a video."
Nature will find a way. But we aren't suddenly going to wake up to rainbows and unicorns. No matter how cool that would be.