Recently I saw a post on Doug Belshaw’s Thought Shrapnel pointing to a nice 3 column layout for a blog.

Doug wondered :

If you’re reading this and know of a similar blog theme, on any platform, could you let me know?

I thought it would be possible to use the Site Editor on a WordPress block theme and left a comment.

I’ve been watching quite a few WordPress videos from Jamie WP. I especially like his Remaking Famous Websites playlist. So I thought it might be possible to make a WordPress site that looked a bit like garry.net.

Jamie does these in 30 minutes. This took me longer, but I’ve not a whole lot of experience with the site editor. I decided to use Glow Blogs. It is free and easy for me to set up a site there. I serve as part time product owner so this is good practise. The disadvantage is that I can’t install any extra plug-ins or add any custom css¹. Glow Blogs also runs a version or so behind WordPress.org.

I only did enough to see where I could go easily. I didn’t attempt to match styles or other features.

I got as far as Three Columns, this is not finished or polised but I managed:

1. 1. a home page with some static content and a left hand navigation.
2. a posts page with the same left hand column. A second column listing the posts and loading the latest post in the third column.
3. finally a single post page with the same first two columns. The post tapped or clicked in the second column showing in the third.

To do this I created three page templates². All are inside columns. All have the same first column. So I made that one as a pattern³. The second column is used twice, so I made another pattern for that. This stopped me having to fix the same thing in different places. I think this is the right approach.

I’ve ignored mobile and other possible pages. I didn’t touch archive, views for categories and tags for example . My aim was to spend a couple of hours on this.

I had trouble with a few things.

• I had edited the Front Page Template, which should be used for the posts page. This didn’t show up. When I edit the posts page and then edit the template I see my 3 column. Unfortunately the live page still uses the old template. So given my time limit I just made another page to act as the posts page and made an ‘All posts’ template for that. This has a query loop in the second column, acting as an index for the posts.
• The second column on the Posts & single post page should ideally scroll all of the posts. Probably inside a fixed height block with lazy load.
• I think I should have used Template parts when I used patterns. but the result seems the same.
• I am not sure how to hilight the posts selected in the second column. garry.net does this nicely.
• I enjoyed poking around in the site editor. I can see the potential for creating different types of site. I am not convinced that access to the Site Editor alone would make much differences to busy teachers with a lot on their plate. Most Glow Blogs stick with the default theme. I am beginning to see how patterns and templates could make things easier for folk.

1. WordPress multi-sites do not automatically support custom css. The Jetpack plugin used to do this but not anymore. I hope it will be added back in. ↩︎
2. Well I did that finally, I made lots of mistakes first. ↩︎
3. Again I did that a more than a few times. I think this should have been a template part rather than a pattern. ↩︎