I decided I needed a change for a couple of reasons. The “Hemingway” site theme I was using is overused across the wordpress world. Since switching to it last year, the format of this site has changed quite a bit with the weekly pictures, many of which contain nudity, which I don’t mind displaying, but I prefer it not be on the front page.
Interspersed with the weekly pictures are long form articles that make it difficult to scroll the content as you have to scroll through many long articles.
I wanted the theme that displayed article excerpts with featured preview images. With my weekly pictures, I have been creating Instagram safe versions usually by cropping out the nudity. I set these up as “featured images” so I can share links to my site on other social media. The new theme shows these featured images by default.
I also created about a half dozen generic “featured images” to add to the posts that don’t have them or previews. Older posts with broken images have been fixed as well. Most older posts have broken links, too, but I’m too lazy to fix them.
Easy Dark Mode
One big negative is that “Lovecraft” theme, like 90% of the other wordpress themes, has no “dark mode” which I have grown to love. My fix was to use “Additional CSS”. The problem is that when you go there, it is just a notepad with no code to edit. How do you create custom “dark mode” CSS code?
Surprisingly the answer was released yesterday. I use a Firefox Plugin called “Dark Reader” that changes all sites to dark mode, even if they don’t have a dark mode. The beta version 5.0 of Dark Reader came out yesterday, but the current plug in still defaults to 4.99. Here’s the step by step guide to getting custom dark mode CSS for any site:
- In “Dark Reader” app, go to “Dev Tools”, and click on “preview new design” (this step may become obsolete in the near future). Close developer tools and reopen dark reader interface, it will look different with more buttons.
- Open up the site you want to customize, and play with the app theme controls to get your dark mode to look the way you want it.
- In the app, go to “Settings”, then “Manage settings”, then “Export Dynamic Theme” and open with “Notepad” or your favorite CSS editor.
- Select all and copy, then in your word press theme customization settings, click “Additional CSS” and paste the CSS you copied. Save, and now the website has a dark mode.