A Deep-dive Tutorial on the New Style Book

[bph]

Discussed in https://github.com/WordPress/developer-blog-content/discussions/91

^{Originally posted by **tinjure20** March 9, 2023} As a response to [this call](https://make.wordpress.org/core/2023/01/12/can-you-help-with-topics-for-the-wordpress-developer-blog/), I would like to express my interest in the topic ideas for the Style Book. I have my sight on this new feature for while. Since, this is my first debut contribution, I thought it would be helpful to provide a brief intro here. I am a self-taught WordPress enthusiast and have been learning and using it over a decade. Recently, I started sharing my experiences as a [CSS-Tricks guest writer](https://css-tricks.com/author/ganeshdahal/) about [my journey to Headless WordPress](https://css-tricks.com/my-long-journey-to-a-decoupled-wordpress-gatsby-site/), [Gatsby headless site](https://css-tricks.com/creating-a-gatsby-site-with-wordpress-data/), [headless site with Frontity](https://css-tricks.com/mars-theme-a-deep-look-at-frontitys-headless-wordpress-theme/), and [several areas](https://css-tricks.com/tag/wordpress-blocks/) of block themes. Together with the CSS-Tricks editor [Geoff Graham](https://css-tricks.com/author/geoffgraham/), I recently authored [this 6-parts theme.json style guide](https://css-tricks.com/wordpress-block-theme-guide/). If the topic is approved, I would like to pick this up and present a workflow outline expanding from where I left off in [this article](https://css-tricks.com/defining-global-styles-in-wordpress/).

[bph]

@tinjure20 please comment on this issue, so the topic can be assigned to you. (GitHub is funny that way)

[bph]

Just received a note that Ganesh @tinjure20 is traveling until May 10th, 2023, and he will check in when he is back.

[tinjure20]

@bph Thanks for the topic approval and I will take up this.

Just got back from my trip and was away from the recent updates. I plan to take a week or so to catch up the latest updates that I might have missed, and then start putting together article outline for comments/suggestions.

[tinjure20]

@bph Just to update you. I am a little behind schedule, as I seem to have caught some bugs from my recent trip abroad and am just getting over them now. I

I hope to be able to share a rough draft for comments within a week or two.

[bph]

Thanks for letting us know @tinjure20 - Hope you get better quickly, and I am sending healing thoughts. Looking forward to the rough draft, of course, no pressure, though.

[tinjure20]

@bph Here is the first draft on Google Docs for comments and suggestions. (@justintadlock : appreciate if you could spare your time, thanks)

(https://docs.google.com/document/d/1pSb2kYX_cwidFq4qTeBFlEMI1dZNb_OCNAOn-7Ftzgc/edit#)

Please note:

• I have changed Title. IMO it probably better reflects the content than I had originally thought.
• I have not conducted thorough reference or link checks against published Dev blog articles
• Article guidelines have not yet been thoroughly checked

Since this is my first foray, I would greatly appreciate any comments:

• content: less or more, enough
• Examples: did I missed any?
• All screenshots are 1500 x 800. Are there any sections I should be highlighting in annotated form?
• Anything else???

[marybaum]

Review done! All my edits are suggestions, which means they're in green brackets that make things hard to read. But the upside is, you can pick and choose what to keep and what to drop. I did add some editorial of my own, based on the fact that I'm building a block theme at this very moment (and I'm sure it shows!)

[tinjure20]

@marybaum, I greatly appreciate your corrections to my non-native English and other edits/suggestions. I'm hoping to make an update to the article by later today or early tomorrow.

[bph]

Howdy @tinjure20 So great to see the progression of your article! Thank you so much! You might have shared it before, but I can't find it now: I would need your wp.org username so I can add you to the Authors of the Developer blog, and you can post your article on the site, once you are ready.

[tinjure20]

Update: The article has been updated with @marybaum editorial comments.

@bph : thank you. my wp.org user name is pauthake015.

[justintadlock]

@tinjure20 - Thanks for writing this.

I did a quick read through it and made some spacing and formatting suggestions. Some of the spacing was likely from the previous review and accepting suggestions (Docs sometimes adds an extra space).

[tinjure20]

Thank you @justintadlock, and very much appreciated. A Dropbox Paper user, still getting my way around with Google Docs.

[marybaum]

Docs sometimes leave an extra space, and so too does an ADHD reviewer! Sometimes.😜

[bph]

@tinjure20 You should have received an invitation to the blog as Author. "Invitation email sent to user. A confirmation link must be clicked for them to be added to your site."

[bph]

Thank you so much for the article. @tinjure20 I'll review it next week on Tuesday 6/13.

Also, thank you to @marybaum and @justintadlock for connecting with Ganesh on his first article for the Developer Blog!

If you want to get it ready for publishing. Here is a Pre-publishing checklist:

• [x] Post Title in Sentence case
• [x] Are Category or Categories selected?
• [x] Are Tags identifies?
• [ ] Is there an explicit Excerpt?
• [x] Props added? 🙌 Publish! 📗
• [ ] add Props for reviews to #props channel in WP Slack
• [ ] close the issue with a comment to link to the published post
• [ ] close the accompanying discussion with w link to the publish post.

Not all might make sense yet. Feel free to ping me with your questions

[tinjure20]

@bph Thank you. It's weird, but the link seems to have disappeared while I moved to check another email. Is it possible to resend me?

I am going to wait for further updates until you have completed your review.

Newbie question - Does it need to move to the next stage (first and second review) thereafter?

Ganesh

[tinjure20]

Updates: @bph Font cases in the site title updated. Partial props were added; others will be added later, after you get a chance to review the article. Thanks

[bph]

Great work @tinjure20 and I appreciate your patience while getting through my backlog after WCEU and traveling.

I have one suggestion in the Google Doc.

Once you are ready, post it as a draft on the Blog and create a public preview link

Here is a little screenshot where to find things:

We are working on it to make clear about the 1st and 2nd review in our guidelines: (issue)

In essence:

• The 1st review is a copy/editing review in Google Docs. Once you worked through those, you post the draft on the blog.
• That's where the second review happens. Mostly checking on publishing standards. Discussion feedback from the 2nd review happens in the articles GItHub issue. (At least until phase 3 of the Gutenberg Projects is a little further advanced)

Let em know when you feel you are ready publish, and I double-check the post, as this is your first post (of many, I hope) and then the process might be a little better understood and take less time.

I so appreciate your time and effort to educate WordPress Developers and I hope any of the other topics that are not yet assigned interest you for you next blog post.

[tinjure20]

The article is in public preview and is waiting for review. Are my categories and tags inputs correct?

[bph]

@tinjure20 you are almost there! 🥳

I made these changes:

• Changed template to Center Column
• Only one H1 tag = Title "Say Help to the Style Book" doesn't really need a heading formatting, could just be bold as an emphasis.
• Added a Table of Contents block
• "Going global: making templates and more with the Global Styles UI" added a space between global and making.
• converted the cited explanation from the GitHub ticket to a quote block
• Changed the link to Global CSS GitHub Ticket to the Dev Notes - a better reading experience. Some people get scared when entering the GitHub space. :-)
• Change the category of "Learning" to "Beginner"

Notes:

• for Q3, we would need to do an audit of categories and tags. It would be great if you want to be part of it._
• Heading are used Hierarchical for accessibility and search engine oomph. Only one H1 per post and that's the title. In other words, any heading section starts with H2.

What's left to do for you?

• [x] Is there an explicit Excerpt? and I noticed that one check was missing from the above list:
• [x] Do all images have an alt-text?

[tinjure20]

What's left to do for you?

• Is there an explicit Excerpt?
• and I noticed that one check was missing from the above list:
• Do all images have an alt-text?

Updates: I have made the following updates:

• Added a TOC block
• Added alt-text to all images
• There is no separate excerpt.

@bph, I presume I took care of all your suggestions. If I have missed anything, please let me know. Let me know. Thank you

[bph]

Would you please enter an explicit excerpt? It is mainly used in when the post is embedded in some other blog and on the All Posts page, to let people know what to expect.

[bph]

Scheduled for publishing Jun 21, 10 am UTC

Fantastic, @tinjure20 - Thank you!

[tinjure20]

@bph, Thank you very much. Sure, we can wrap it up post-publishing stuff on Thursday.

I enjoyed learning all the details from you and others, as this was my first contribution to the Dev Blog. I greatly appreciate your encouragement, especially!

[justintadlock]

@tinjure20 - Thanks for working with everyone through the process and getting the details down. The first post can be a learning experience. :) I look forward to seeing your post go live and seeing more from you in the future!

[bph]

the post publish tasks:

• [x] add Props for reviews to #props channel in WP Slack
• [x] close the issue with a comment to link to the published post
• [x] close the accompanying discussion with w link to the publish post.

[tinjure20]

Thanks a lot, @bph, @justintadlock, and @marybaum. The article has been published.