As it was written in the ancient times, every five to ten years a website must undergo the transformation know as "The Convertening". Try as I may to avoid this horrible, horrible ritual, I am powerless against the cosmic forces that rule the web-o-sphere.
Last fall I received word from afar that the Orchard Core team had finally released its version 1.0. The word may have come in a vision from on high or possibly from a search engine, but regardless of the source, I knew "The Convertening" was upon me once again.
|Word of Orchard Core 1.0 from on high?|
So began my epic journey from the old Soule Designs running Orchard (a.k.a. Orchard CMS) and using the legacy .NET Framework to the new/converted Soule Designs running Orchard Core and using the newish (within the last decade) .NET Core runtime.
The theme is the thing
In my misspent youth I devoted a lot of time to writing css styles and designing sites. In fact, when I first moved to Orchard I made a point of totally customizing the look and feel of Soule Designs. Well, times change and with other irons in the fire I went looking for a quick fix for a new theme. Luckily I found one pretty quickly in Valkyrie on Theme Forest, unfortunately it was specifically written for the Ghost blogging platform :-( .
|You could be mine?|
I kicked around the idea of just moving to Ghost and using the theme there, but I have a ton of customization and crap on my website and Ghost just wasn't flexible enough. So I bit the bullet and decided to convert the handlebars code in the Valkyrie theme to something that would work in Orchard. There goes my quick fix :'(
Now we come to the nuts and bolts of "The Convertening", learning .NET Core, converting the Valkyrie theme and pushing my old Orchard CMS data into Orchard Core. I was planning on a lengthy technological rant regarding all the pieces of this conversion, but now that it's done I'd rather just gloss over it and forget all the pain and suffering. To that end, here is a 10,000 foot view of what I did:
- Followed the getting started tutorials to create an Orchard Core site using NuGet packages and a basic theme
- Wrote a custom SQL script to get data out of my old Orchard CMS database and import it as a recipe into Orchard Core
- Wrote a small console app to parse my old blog posts and make sure their links and images imported properly
- Relied heavily on the built-in Orchard The Blog Theme source code to guide me in converting the Valkyrie theme
- Lots of digging and research into Orchard Core documentation, liquid template language, Gulp and probably a few other languages/technologies I'm forgetting
This was all happening as months ticked by and I worked on various other Soule Designs projects.
|I got to know these docs way too well|
Crank this up a notch
Sometime in early 2022, while toiling away on the above work, it struck me: why not tweak the direction of Soule Designs while I'm under the hood? This meant moving from an Owen-centric portfolio site to a more general article site. Since my new theme allowed for multiple authors, I decided to pull Laura's blog content into Soule Designs so we could have a One stop Soule shop™.
Unfortunately, that decision involved even more pain and suffering (a common theme with this project) because I had to write a second blog post conversion process! Ok, no more meandering code conversion craziness, let's get to the end result...
|Cue the Ghostface maintenance page!|
Skip to the end
You've already seen the end result because you're on the site right now! But in the interest of documenting this round of "The Convertening" let's walk through the updates to a couple key areas: the home page and blog posts.
Starting off with the old (2014) home page layout, the featured posts were pretty static here and only updated once in a blue moon. Also, there wasn't much to look at aside from the giant carousel.
Here is the new (2022) home page layout, the featured posts are much more flexible and there is an additional grid of the last 12 posts (trimmed here to avoid a really skinny image). Also, you can keep loading posts via the "More Posts" link at the bottom of the page. Excellent!
Moving on to the old (2014) blog post layout, the content here had to share real estate with that sidebar and made the page feel very cramped. Granted this is a gripe with the desktop style only, but it is still a gripe!
And here is the new (2022) blog post layout, the content takes up the full page width to allow focusing on reading. Also, the header image is customizable to allow for a visual splash at the top of each post. Finally, the old Orchard comment system has been replaced with Disqus which means users can comment using a ton of different logins (Facebook, Twitter, Google, etc.).
Oh, and one last change I want to point out is the inclusion of a light mode/dark mode toggle in the top menu. The Valkyrie them did have a color picker but I customized it to make toggling simpler.
|Toggle love, driving me mad, making me crazy!|
And that's a wrap. This "The Convertening" was ridiculously protracted and fraught with issues, but now that it's over I can return to focusing on non-web development Soule Designs projects.