There’s nothing like a new coat of paint – or in this case, a clean new theme – to reinvigorate a blog. I’ve been using the same theme since I moved my blog to WordPress hosting sometime in 2016.
Don’t get me wrong, I appreciate my true-blue old theme, Scratchpad. It had the nice artsy vibe that I was going for and was easy to customize. But just as it always is when folks have a pool of themes to pull from, I see a number of other blogs out there using the same theme as I did – just maybe with a different color pallet.
I wanted my blog theme to be completely original, which is hard when you’re limited to only installing themes provided by WordPress.com. Well… maybe not anymore!
One thing I’ve wanted to explore and have kept my eye on is the concept of the Full Site Block Editing that WordPress has rolled out in beta. For a while, it was only available if you created a new site, but now it’s open to everyone, even those who are self-hosted.
This weekend, I decided to experiment by installing a new theme that supports full site block editing. I knew that doing that would be a large undertaking because gone with the wind would be my previous tried and true theme. I would need to learn on the fly how to use the new template system and build a new design while my blog was still live to the public.
After I installed such a theme – I just went with the WordPress-made Twenty Twenty-Two blue theme – I quickly decided to tear out all the existing template parts and rebuild the basic header and theme layout from scratch. This was a trial and error sort of thing – I wish I’d spent some time watching a video about it before I started. I’ve linked a good one with lots of tips below.
Add to that some spiffy new graphics, and I’m on my way to rebuilding the aesthetics of the site and giving it an overall updated feel. I’m really pleased with it so far!
Some thoughts on the block editor – this is not a drag and drop system. It’s a little trickier than I expected it to be. But once you mess around with it some and learn about things like the List View, Tool Bar, and Styles Menu (I wandered around wondering how to change my site’s background color for hours), then you’ll be better equipped to tackle the job of building a layout that is completely your own.
Being able to assign completely original templates to not just pages, but also posts, means that you can technically build an entire section within your blog that looks totally different from your main blog, including the posts! The possibilities are really incredible, especially for someone like me who likes to create individual sites about different topics.
Despite being able to assign a page/post with its own template, they will share universal things like background color – I don’t think there’s a way to change that or to assign individual templates background images… yet. Keep in mind that this is just the first public roll-out of this feature set – I expect more blocks and customizations to be on the way.
I think that I can work around most of those limitations, and the ability to give posts and pages their own look and feel individually really tempts me to bring back my Ukulele and Fiddle content to this site – with their own special-designed sections.
Just hoping for more blocks to be added in the future – there were a few things from my previous sidebar I couldn’t recreate because they didn’t exist. These missing blocks included a Links widget (where I can just easily display a blogroll) and the widget that used to allow people to follow your WordPress blog at a click. But hopefully, we’ll see these added in time.
I’m also having trouble with the HTML block displaying code properly. It displays okay in the preview but then just spits out the code on the live site. So, hoping this is a bug.
I am far from finished with redesigning my blog’s theme, and I’m super excited with where this might go in the future. I love that this puts the complete site design into my hands, even if there are some present limitations that I’ve found.
22 responses to “Blog Redesign – Exploring WordPress Full Site Block Editing”
Oooo, fun! 🙂 Looking good so far I’d say.
LikeLiked by 1 person
Thank you! I’ve got the foundation of the site where I want it, but have ideas on how to fancy it up some from here!
LikeLike
Nice work so far, Aywren! Seeing WP roll out its own native fullsite block editor is very cool, albeit not something I’ve played with yet. I’m liking what you have here so far. 🙂
I don’t know if it’s even possible to differentiate fonts/link styles in this way, but if it is, the only call-out spot I have right now I think would be the sidebar. Having link text at equal weighting with the content/body strikes me as a little strange. Again though, no idea if that is even something you can do anything about!
LikeLiked by 1 person
I’ll have to look into it further myself to see what all it can do when it comes to universal things such as link styles. I didn’t see much in the way of options for fonts, but I could have overlooked it – I wanted my headers to have different fonts, but while there was an option to customize this, no fonts were available to choose from. I don’t know if that’s a theme thing or a WordPress thing.
I do plan on doing more with design (sidebar especially), but just wanted to get the layout mostly workable yesterday since when I first flipped the switch, the whole blog was upside down at first!
LikeLiked by 1 person
I have an issue with terminology that comes up every time people with strong design and coding skills discuss how they’re remaking their blogs. I look at what they’ve done and I don’t see a blog at all. I see a “Website”. Websites, in my understanding, are an entirely seperate concept. For example, Stereogum, NME. MassivelyOP and Pitchfork, all of which are in my feed, are Websites, while TAGN, Bio Break and Going Commando, for example, are all Blogs.
I come to each of them with different expectations. If something looks like a professional “Website” I expect significantly different content and standards than if it looks like a “Blog”. Blogs are the equivalent of reading someone’s journal with their permission. Websites are the equivalent of a magazine you pay money for at a news-stand. The closer something that says its a blog comes to looking and feeling like a website, the more confused I get.
The emotional response evoked by a “website” is very different to that engendered by a “blog”. Websites are impersonal, blogs are the exact opposite. The thing is, when actual blogs – the ones written by hobbyists as opposed to professionals using the blog format for commercial reasons – begin to look like websites, there’s a disconnect between the content and the form. The posts, when I read them, have the same, warm, personal feel but the surface denies it.
A few “blogs” I read, ones that are very defintely hobby blogs in content and intent, have been tweaked to look and feel so close to prefessional websites that I find myself skating over the surface instead of reading them closely. The way they present themesleves doesn’t invite close attention. It expects the kind of skim-reading you’d give most websites unless you happened to come across something of specific interest. The blogs that look the most like actual journals are the ones I pretty much always read in full, with attention, every time – ironically, even when they’re not actually all that interesting!
Your latest revamp still looks much more like a blog than a website. The way there’s just one post in a single column taking up most of the page, with a very recognizeable sidebar containing only straightforward, blog-related links makes the whole thing feel very comfortable and familiar. There’s some bleed across into website territory with the very large, full width video panels. I’m quite wary about doing those on my own blog, which is why I stopped short at something slightly less than full column width. I do actually feel the native size of Blogger’s video inserts, which makes them look more like spot illustrations than panels, is more appropriate to the look of a “Blog” and I constantly toy with the idea of reverting back to that.
I wonder where the future of blogging lies, though. The classic look I associate with the word and the hobby is already becoming archaic and the difference between the concepts, Blog and Website, is already blurred. I’m sure that, to some, they’re already synonymous. Maybe, with time and exposure, I’ll learn new ways to respond to the new forms but I’ve had quite a bit of both already and if anything I’m finding it harder, not easier to adapt.
LikeLiked by 1 person
Thanks so much for your feedback! This is all still a work in progress at this point, but I’m glad it feels much more like a blog than a website!
I checked into the video sizing because it also bothered me. I didn’t see a way to control the video embed size directly, but when I looked at the Advanced section of the embed blocks, WordPress was automatically sticking this in the CSS: wp-embed-aspect-16-9 wp-has-aspect-ratio – and that’s what made them full width. I manually removed that and now the videos are regular sized. I’ll just have to remember that going foward – naughty WordPress inserting CSS that I didn’t ask for!
LikeLike
You’re welcome. I’m glad you found it useful because I did go on a bit there – probably would have made a better post for Blaugust than a comment 😉 I’ll have to try and remember to come back then and borrow it. The smaller video panels look much better, too.
LikeLiked by 1 person
You should definitely recycle it because I think this is excellent advice for bloggers to take into consideration. I really try not to use themes that have multiple blocks of posts in a row and that kind of thing (except in very specific situations). I feel like sites that use these mutli-block layouts take away from the individual pieces of content just to throw a grid of stuff at the reader and it overwhelms me sometimes.
LikeLike
Like it a lot! And if you love it, that’s 100% the reason to keep it.
LikeLiked by 1 person
Thank you so much! What I like most is the ability to get creative and to build my own original theme. I’m still learning and I’m sure there will be many tweaks to come!
LikeLike
Glad to know the new block editor is working for site themes; I’ve been wanting to look into this and try it myself. Your post gives me a green light – thanks. 🙂
LikeLiked by 1 person
Give it a shot! It might be a good idea to roll up a free WordPress.com blog to experiment with it before flipping the switch on your main blog first. It took me a few days to get into the groove with it. Looking up some video tutorials was helpful, too. Most of it is intuitive, but some of it can get a little fidgety!
LikeLiked by 1 person
Sounds good. I plan to watch those YouTube videos you shared. Thx.
LikeLiked by 1 person
Those should set you on the right track! Let me know how it works out for you – best of luck!
LikeLiked by 1 person
The videos are helpful. Looks like I can finally customize things just how I’d like. So I started a test site…the new editor is quite different from the old theme customizer. It also appears to be in beta still. I will take my time practicing with it and may wait for the next version before I change my live site. I think the new theme editor is going to be very good.
LikeLiked by 1 person
I love that you can create a theme for just one page or post – or spread that theme to a series of pages/posts. You can make every single page vastly unique if you really wanted to by just making a special theme for each. Not that we’d need do that, but the ability is there! Can’t wait to see where it goes in development.
LikeLiked by 1 person
I wonder how things work with this theme setup on an iPad?
LikeLiked by 1 person
That’s a very good question and one I can’t answer since I don’t have an iPad. If you do try it out, let me know!
LikeLike
FYI – I just looked on my 10.2″ iPad and the layout works. I see the left column at about 2/3 and the right sidebar at about 1/3. But the dividing line between is close to the middle, so the left column looks too narrow. Interestingly, that’s in landscape. When I rotate to portrait, the layout stays the same, it all just scales down to fit. I would have expected it to drop the sidebar and only show the blog column but it did not. It works though. The header image and top menu nav bar stay the same and scale to fit, mostly. In portrait, the far left and right menu nav do get cut off a little. Hope that helps.
LikeLiked by 1 person
Sounds like they have a bit of work to do on responsiveness. I noticed some of the ad blocks in my themes don’t scale with the sidebars too when you downsize the page.
LikeLiked by 1 person
…well ah, so I decided for now to update my theme by reverting back to my previous one. I find it interesting that the widgets and stuff in the Customizer are actually using blocks. It’s a weird mix, but it works. That said, despite there being access to Legacy Blocks/Widgets, not all are available! I could not find the one that shows a grid of my followers/subscribers. Hmm..
LikeLiked by 1 person
Yes, there are a few legacy widgets that I couldn’t find too, such as the Follow on WordPress button that I usually use. I also had trouble with HTML code not showing right in the widget. So there’s still work for them to do!
LikeLiked by 1 person