Fade In… Gutenberg Blocks and Styles

Fade In

Int. Allyn’s Bedroom. Night

Allyn is laying in bed, his head resting on a stack of pillows, hands not just behind his head but beneath one of the pillows as well. The lights are out, though his bedroom is partially illuminated by a street lamp somewhere beyond the window. His eyes are closed. He appears to be sleeping.

His eyes snap open.



Screenplay! Are there screenplay formatting blocks for Gutenberg?

Allyn reaches to his Android phone, attached to its charging cord, on the nightstand. The glow of the screen illuminates his face as he calls up the browser and begins to tap at the screen.


Let’s see… “Screenplay blocks for Gutenberg.”

Allyn frowns.



(a beat)

Guess I’ll have to do it myself.

Allyn taps at his phone’s screen again.


Better leave myself a note on Twitter…

Int. Allyn’s home office. Morning

Allyn sits at his computer, a mug of coffee atop a stack of index cards he uses in lieu of a coaster. His browser is open to a search engine.


What to do? How to do it?

Allyn’s fingers fly across his keyboard.

A smile begins to cross Allyn’s face, and he nods slowly.


Ah. Yes. That will do nicely…

Hard Cut To…

…a regular old blog post.

Last night, in bed, I was struck with an idea. Was there a way to create a screenplay-like format in WordPress’s Gutenberg editor? It seemed to me that creating a screenplay structure was really just a matter of formatting, and then I thought about an article I read about six months ago about creating custom styles for the Gutenberg block editor. Type a paragraph, apply a style, and repeat.

The sample code looked like it was simple enough to work with. The key issues were figuring out how many styles I needed (six) and the margins (done in percentages, which is mobile-friendllier). Then it was a matter of defining the styles, writing the CSS, activating the plugin, and testing. After some CSS tweaks, I was satisfied that it worked exactly as I wanted. All told, it took about half an hour to modify the CSS and JavaScript and test it. The tool didn’t exist, so I had to make it.

Do I need the ability to make a screenplay post in my blog? That’s a trickier question. Probably not; I’m not a screenwriter.

But I can, should the need ever arise.

Published by Allyn Gibson

A writer, editor, journalist, sometimes coder, occasional historian, and all-around scholar, Allyn Gibson is the writer for Diamond Comic Distributors' monthly PREVIEWS catalog, used by comic book shops and throughout the comics industry, and the editor for its monthly order forms. In his over ten years in the industry, Allyn has interviewed comics creators and pop culture celebrities, covered conventions, analyzed industry revenue trends, and written copy for comics, toys, and other pop culture merchandise. Allyn is also known for his short fiction (including the Star Trek story "Make-Believe,"the Doctor Who short story "The Spindle of Necessity," and the ReDeus story "The Ginger Kid"). Allyn has been blogging regularly with WordPress since 2004.

Leave a Reply

Your email address will not be published. Required fields are marked *