I loved the Disqus commenting system and used it for several years.
When I published a new website, it was impossible to see the discussion box due to the color scheme.
And I began to notice that on certain website templates, the discussion box was almost invisible.
So a visitor could not be expected to leave a comment because the discussion box appeared to be totally missing!
Since I had never encountered this problem before, I was unsure how to correct it. I thought I might be able to fix the plugin’s CSS code, but wasn’t certain.
What I expected to see in the Disqus comment area was:
But what I actually saw was that most of the formatting and text were invisible:
I thought I might be able to apply custom CSS to adjust the Disqus color scheme, but a quick e-mail to Disqus support and I was told it’s currently not possible to apply custom CSS to the new Disqus.
I learned that Disqus will automatically apply a scheme based on the text color it inherits from a website.
So depending on whether your template’s stylesheet has a light or dark color scheme, Disqus will make a selection.
That means if the gray contrast s 50% or greater, Disqus will load a light color scheme. Otherwise, it loads a dark scheme.
How to Adjust Disqus Color Scheme
There are two ways that you can adjust the Disqus Color Scheme.
Change Disqus Admin Settings
You might have to try a few tweaks to get this to work for your particular theme. The simplest way to do this follows:
To adjust Disqus color scheme, log into Disqus admin and choose General settings.
Once there, select the light or dark scheme depending on your site’s stylesheet. Since my theme was light, I chose light backgrounds.
You can also specify “auto” and Disqus will make the choice for you, but I believe that’s where my problem came in.
Testing is tricky because the browser cache needs to be refreshed or cleared before the changes will show.
If you don’t see your changes right away, try clearing your browser cache.
If that doesn’t work, log out of Disqus and log back in.
Finally, try testing with another browser to see if the appearance has changed properly.
Modify Stylesheet Directly
If you still can’t adjust the Disqus color scheme by using the procedure above, follow this procedure for modifying your stylesheet directly.
Hopefully by now you have your Disqus comment area displaying properly!
Has this procedure worked for you?
If you are still having problems, please leave a comment below and I’ll try to help you troubleshoot.