Since this website’s inception, I’ve been using the Orvis theme, which is intended to be used to display photography portfolios. It’s a sleek, classic theme with a navigation configuration that I like. However, since the beginning, the Orvis theme has had one major issue: while you can enable a comment submission form on your posts and pages, the theme itself (at least using a white background the way that I do) makes the comment box and submission button invisible. Luckily, you can add your own custom CSS to the theme.
I have some experience with HTML/CSS, enough to be able to modify code to a degree, so I scrutinized the code on a page with a comment submission box enabled and tried to fix the issue. The strange thing was that the comment box, any text entered, and submission button were displayed all in white, which you could see if you highlighted everything, but which appeared invisible otherwise.
Aha!, I thought.
And added CSS to make the textarea’s background and the text within it a colour other than white. I made the submission button a colour other than white too.
It worked!
Well, sort of.
At that point, I could finally see the comment text box, but as soon as I clicked inside it and started typing, it would all disappear. When I clicked outside of the box again, both the comment text box and the text itself would magically appear! What the hell?
No matter how much I scrutinized the theme’s original code, I couldn’t figure out where the issue was coming from. There was nothing that I could see that would cause the issue. Google did end up having the answer (…eventually, after a lot of failed queries).
Focus.
Even though there was nothing related to it that I could find in the CSS on the page of my site that I had been combing through, the right query finally led me to finding out how to modify an input area that has been selected (that is, which is in focus). I’ve been coding webpages casually for years, and I’d never come across that before. I am not embarrassed to admit that I threw my arms up in triumph when that finally worked.
So now anyone can see the comment box to reply, not just spammers and bots!
If anyone else is using the Orvis theme, wants to enable comments, and runs into a similar issue, add the following to the Additional CSS for your site and change the colours to whatever suits your site:
textarea:focus {
color: #333;
background-color: #eee;
}
input, textarea, select {
color: #000;
background-color: #eee;
}
button, input[type="button"], input[type="reset"], input[type="submit"] {
background: transparent;
border: 2px solid;
border-radius: 0;
color: #333;
padding: 4px 10px;
}Then again, I might be the only weirdo using this theme with the comments enabled.