12 Mar 2010

Styling Tip: Moving the Comment Form to the Top

We’ve received a lot of requests recently to move the comment form to the top of the comment section rather than having it at the bottom. We prefer having the comment form at the bottom so your visitors have a chance to catch-up on the debate before posting their comment – that helps cut down on duplicate comments and encourages interaction. But it’s your site and we’re all about customization!

To make it happen, you need to add the following CSS to your Custom CSS page in your IntenseDebate account:

#idc-container-parent #idc-container {
position: relative;
padding-top: 320px;
}

#idc-container-parent #idc-container #IDCommentsNewThreadCover {
position: absolute;
top: 0;
left: 0;
width: 100%;
}

For more CSS help, check out our CSS Documentation and feel free to give us a shout at support@intensedebate.com with any questions. Oh, and don’t forget to check out our other styling tips to simplify your comment section design!

Posted by Michael Koenig in features


Missing out on the latest IntenseDebate developments? Enter your email below to receive future announcements direct to your inbox. An email confirmation will be sent before your subscription is activated - please check your spam folder if you don't receive this.

Join 8,662 other subscribers

9 Comments »

  1. Hmm… is this at http://thomasknapp.at ? We'll take a look and see what's up.

    That's the ID Blog Tweets plugin! It's available in your plugins page at http://intensedebate.com/plugins . More info at http://wp.me/plsX6-yi

    Comment by Michael Koenig — March 12, 2010 @ 11:29 pm
  2. Thank you for the quick reply (again!). Yes, ist thomasknapp.at. I'm using the Custom CSS now, but it doesn't look good.

    Nice plugin 😀

    Comment by Knapp — March 12, 2010 @ 11:39 pm
  3. That is odd. It should work better for you if you also apply the rule width: 100%; to the new thread container, like so:

    #idc-container-parent #idc-container #IDCommentsNewThreadCover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    }

    Hope this makes sense. Sorry for the confusion.

    Comment by Isaac Keyet — March 13, 2010 @ 12:01 am
  4. Nice idea, but…

    The comment does not appears close to the comment form after posted, so i dont liked.

    Comment by Administrador — March 13, 2010 @ 12:41 pm
  5. Where? Can you provide a link or screenshot? We'll take a look and see what's up.

    Comment by Michael Koenig — March 15, 2010 @ 7:58 pm

  6. Nike shox clearance shoes online store
    Airandshox.com,committed to offering a truly outstanding selection of the
    hottest
    styles from popular brands nike shox shoes series,
    including Nike shox turbo,
    Nike shox nz shoes,
    Cheap nike
    shox sale,Nike
    shox r4
    shoes,Nike shox womens,
    Black Nike shox,Buy now with best price,
    100% guarantee.

    Comment by airandshox — April 27, 2010 @ 12:40 pm
  7. This works perfectly.

    Comment by kakaiba — December 10, 2010 @ 8:41 am
  8. I installed this code but it didn't work in Firefox. Removed the css but now BOTH intense debate and Blogger comment options are showing. I have searched my html for the code but nothing there and I also reinstalled. Same problem. Can anyone help?

    Thanks.

    Comment by deleted3603632 — January 5, 2013 @ 2:05 am
  9. I'm so sorry for the delay – your comment slipped through! Please submit this through the our contact form and we'll take a look.

    Comment by Michael — February 27, 2013 @ 8:53 pm

RSS feed for comments on this post. TrackBack URI

Leave a comment

This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 2.5 License. | IntenseDebate – Official Blog
%d bloggers like this: