Design of My Website
I discovered the IndieWeb about six weeks ago and wrote then about why I think it’s an important movement and community. Since that time, I’ve made a concerted effort to update my web site so that it looks like I want it to look. Although I’m not yet done, I’ve made good progress. I recently read Chris Aldrich‘s excellent post An Introduction to the IndieWeb. Near the end of the post, Chris writes:
Everyone’s desires and needs will be different. Work on what you find most interesting and useful first (the IndieWeb calls these itches). Make a list of what you use most often on your old social media silos or wish they had and work on that first.
In a conversation with Greg McVerry last night, I came to realize what I’ve been focusing on and why. To understand my focus, I first need to explain a little bit about how I set my site up.
I have a Domain of One’s Own site through my university. This means that I can install applications on my web site very easily through a tool called Installatron. Because I was very familiar with WordPress, I first decided to install my own instance of WordPress for my blog. One of the first choices to make when you set up a WordPress site is the theme you want to use. The theme specifies how the site will look. I chose a minimalistic theme called Rebalance. I liked the grid layout of the theme as well as the fact that it would show an excerpt of a post on the main page. I also liked the fact that the main page would show an image associated with my post if I wanted but that I could also post without an image. Here’s the main page of my blog which can also be seen below:
I then wanted a place to post my photographs. I wanted the photos to be all together but separate from my blog posts. I envisioned a main page with small images and when a viewer clicked on an image, it opens in a larger format. I tried a number of different options (a separate page, a portfolio, a project) and realized that I didn’t like the way the Rebalance theme handles images. But WordPress doesn’t allow multiple themes on a single WordPress site. So I decided to install another instance of WordPress and link it to my blog WordPress instance. I settled on the Pictorico theme for my photography WordPress instance which you can see below (and here). This theme is also minimalistic and is in a grid format. When I post an image, I add it to the text of the post and I don’t add a featured image. Instead, the Pictorico theme uses the first image in a post as the featured image if one is not added. This means the image only shows up once on an individual post.
Then I learned about the IndieWeb. So I installed yet another instance of WordPress so that I could use one of the three themes that fully supports the IndieWeb plugins. I chose Sempress because it is minimalistic in ways that remind me of the Rebalance and Pictorico themes. I put a link to my blog WordPress instance and to my photography WordPress instance on the menu for my main web site which can be seen below (and here):
As I learned more about the IndieWeb, I started to think about my work flow on corporate web sites. One of the things I do a lot on Twitter, for example, is retweet stories that I find interesting in order to come back to them later. I thought about how I might do something like this on my own web site instead of on Twitter. (I’ll write about the work flow for this process in my next post.) I had a vision of what I would want such a page to look like and, perhaps not surprisingly, I wanted something that had an appearance that was different than any of the pages that I had created up to that point. So I installed a fourth instance of WordPress and used the Carton theme. This theme is also minimalist and uses a grid layout but it looks great without images which is what I imagined my notes page would look like. You can see it below (and here):
As I was telling Greg about the four instances of WordPress that I have installed on my web site and why I wanted to use each one, I realized that I use various corporate social media sites for different purposes and the way they look and feel matters to their use. And so as I try to replace the use of the corporate sites with my own site, I want the various pages to look and feel different from each other in ways that are suited to my use of them. It’s a lot of work to set up and maintain four instances of WordPress but it’s worth it to me to get the look and feel that I want. And this realization made me wonder if we could develop a plugin or a theme that allowed one installation of WordPress to have a different look and feel on each page. We already can filter posts by type so that we can have a separate page for each post type. Could we allow those pages to look different from each other based on the type of post that was on each page? I have created a couple of simple themes using a Udemy class that I took in January but I would need a lot more knowledge and experience to begin to develop this idea. I wonder what other people think about it.
Article written by: Cathie
You May Also Like
Replied to Design of My Website by Cathie LeBlanc (Desert of My Real Life)
I love how you’re trying to take control of all of the parts of your website. In particular, I think it’s a great idea to improve the usability of particular pages (both for yourself as well as for others) based on how you’re using the pages. I think more people should be considering this as an option.
Certainly having multiple WordPress installs can be a headache, though it will obviously work. I know some IndieWeb tech related to syndicating to various silos and using services like Brid.gy for backfeed will be hard to do when using more than two domains and targeting a single silo presence, so it’s not only a maintenance tax, but you might not have the flexibility you’d like if you syndicate content in multiple locations.
Another option is to use the same WordPress install to run multiple websites, which is also a possibility. Or you could also run a multi-site installation and go that route. This at least would cut down on needing to maintain and update multiple sites one at a time.
Possibly the best option, however, is to know that you can custom theme any and every page generated within your website. This isn’t done quite as often as it may take a bit more upfront development work and knowledge of how WordPress works internally as well as how to tweak your theme. The easiest thing to do is to create custom templates for each of the particular pages you want to change. When WordPress tries to build a page it relies on a nested hierarchy of templates potentially available within your theme. It starts at the top and stops when it finds one available and then uses that template. By targeting the particular page you’re making (by a variety of means) you can have direct control over what your page will look like. The nice part is if you’ve got templates from other themes, you can use those as a guide and include their CSS files to get the exact look and feel you want.
Now that you know it exists as an option, there are a huge variety of resources on the web that you can consult to begin tinkering. Below are a few potentially useful ones:
A Detailed Guide To A Custom WordPress Page Templates
Creating Custom Page Templates in WordPress
How to Create a Custom Page in WordPress
Page Templates (documentation from WordPress Developer)
Taxonomy Templates (documentation from WordPress Developer)
I suspect even for those without a development background, one could do a bit of reading followed by some judicious cutting and pasting to get some reasonable results. I’m far from an expert in this area myself, but I was recently able to create a sort of landing page template for my podcast recently by creating a custom page that displays when the archive page for my ‘podcast’ category is rendered. Essentially I copied the archive template from my theme, added a bit of detail about the podcast just above the part where it renders the reverse chronological order of the category posts (I did this in simple raw HTML, without any ‘real’ coding), gave the file a new name
category-podcast.phpso it would trigger when/category/podcast/is the URL, put it into my child theme (so it wouldn’t be overwritten if I update my theme), and voila–a landing page for the podcast!If you’re not much of a developer/tinkerer, you could likely ask your departmental, divisional, or institutional web developer, someone at a local WordPress meetup or maybe a Homebrew Website Club to help you out a bit. I think once you’ve done it once with even some simple changes like I did on one page, you’ll have the gist of it and the sky is the limit for every other page on your site.
Syndicated copies to:
Thanks, Chris. I am looking forward to digging into figuring out how to create custom themes for each page of my web site. I’ll experiment with a fifth install of WordPress. Actually, it will be a sixth install since I already have a non-public install of WordPress where I’ve been experimenting with creating my own themes. The resources you provide here are very much appreciated. I’ve already run into a problem with having multiple installs when I tried to use IndieAuth to sign into the Indigenous app for posting what I’m reading to my site(s). I ended up deciding only to use my Notes site for that posting so I avoided the problem.
By the way, I’m still figuring out how to appropriately IndieWeb reply to comments. Have I done this correctly?