DISQUS

The Disqus Blog: Problems getting CSS styling to work

  • plasticbag · 9 months ago
    I have the exact same problems – some stuff I can change (textarea, submit button) but most of the other items just wont change, no matter what I tried. I followed the instructions on the CSS page closely and examined the code with firebug as suggested to see what classes and id's every element has, but I cant seem to change anything – even if using !important all over the place.

    Any ideas or comments or example stylesheet woul dbe more than welcome.

    Cheers,
    Philipp
  • سهند / آی اس ان · 9 months ago
    i have the same problem, nobody's gonna help?!
  • Giannii · 9 months ago
    What are you trying to change on your site using the css?

    Giannii
    DISQUS
    Community Manager
    help@disqus.com
  • Infidelesto · 6 months ago
    Gianni, there's been numerous threads on the javascript for the external sylesheet not working. Can you or someone please address this?

    See this thread also http://disqus.disqus.com/custom_css_for_iframe/

    *update* I was able to get it somewhat to work, but not by calling the external style sheet, instead I tried adding the css to my main style sheet and that seems to be working.
  • plasticbag · 9 months ago
    Hi Giannii,

    for example:
    #dsq-content #dsq-comments .dsq-comment.special .dsq-comment-header

    there is a custom png (http://media.disqus.com/images/embed/header-blu...) defined as a background image. I wanted to apply a different one to make it fit better with my dark theme, but no matter what I tried, it didn't work.

    But as stated above, nothing can be modified except:
    textarea, input.form-text, and input.submit

    I gave up and I am now using Disqus on a bright background with not much modifications and it looks fine ;)
  • zabbr · 9 months ago
    I have the same problem, DISQUS will not allow me to edit CSS and everything about the default styling is intended for a light design, whereas my design is dark. It's very ugly.

    -S
  • tojulius · 7 months ago
    Best solution is to copy and paste CSS from Firebug, worked for me
  • indieshows · 7 months ago
    I've tried copying and pasting css from firebug... still doesn't work. I can edit the css for everything EXCEPT the input fields and submit button... first, you would think simply adding input {whatever css here;} would do the trick but it doesn't. I've tried input.submit... and many others. Help?

    My suggestion to the Disqus team would be to make the css easier to change because it looks like more people are failing than succeeding at changing the css.
  • cximran · 7 months ago
    just to add to the discussion - I'm having the same problem, the CSS just doesn't seem to be changing for me no matter what - can't disqus just add a way for me to edit the CSS styling on their site?

    It's a great product, but the styling is just awkward!

    Any help would be appreciated
  • Khan · 6 months ago
    i am also having problems with getting the CSS to work. I've tried everything.
  • anaid · 5 months ago
    i have the same problem.... disqus is great, but i can't edit the CSS for the input fields.... :(
  • Olivia · 5 months ago
    Ditto. No luck with textarea, input fields, and field labels. Wishing I could have the last couple of hours back!
  • Webomatica · 5 months ago
    After spending a few hours confused, I finally bent the Disqus CSS to my will.

    To sum up: <script type="text/javascript">var disqus_iframe_css = "http://www.my-blog-url.com/disqus-form.css";</script> --> The styles placed in this stylesheet only apply to what's in the iframe. Meaning, only the input textarea and the form fields.

    All else (meaning the comments themselves and all the associated stuff), put in your existing stylesheet. Use firebug to figure out what to target, and use !important to override the Disqus stylesheet, which due to its placement in <head>, comes last.
  • Nordin · 3 months ago
    Thanks for clearing that up Webomatica. It's working for me now, cheers.
  • العاب 2010 - العاب دلع · 3 months ago
    Thaans : Best solution is to copy and paste CSS from Firebug, worked for me