standard post format icon

Styling CommentLuv Last Blog Post for WordPress

CommentLuv is a must have WordPress plugin. It’s a nice way of rewarding your blog readers who leave a comment on your blog because it displays  a prominent link back to their last blog post. Cool, isn’t it?

But I don’t like the way it displays my commenters’ last blog post. Maybe it would be great if I could edit the CommenLuv CSS so I could customize or style it.

I noticed in Firebug that the CommentLuv style sheet is located in ../wp-content/plugins/commentluv/style/cl_style.css and .cluv has this default style:

.cluv {
border:1px solid #fff;
padding: 5px;
display: block;
font-size: 100% !important;
text-transform: none !important;
}

that looks like this

comment-luv-default-style

Default Style of CommentLuv Last Blog Post

Although the default style has a white border (border:1px solid #fff) it’s invisible in my comment box because it also has a white background.

Styling CommenLuv CSS

I tried putting background color, top margin and different border color with rounded corner, and presto! Here’s the result. Just the way I like it.

comment-luv-my-style

Styling CommentLuv Last Blog Post

Here’s the code to style my commentator’s last blog post.

.cluv {
margin-top:15px;
padding: 5px;
border:1px solid #FFCCCC;
background:#F1DCC1;
display: block;
font-size: 100% !important;
text-transform: none !important;
border-radius:5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;

If you want you can copy-paste this code and replace the default .cluv styles.  Just change the border, margin or background color to your preference. After editing cl_style.css, upload it to your CommentLuv’s plugin folder – ../wp-content/plugins/commentluv/style.

There you go. Don’t forget to backup the original cl_style.css first if you want to edit it, so you have something fresh to work on if things don’t turn out right. Anyway, this is uber easy, I don’t think you’ll have a problem with it.

Related Posts

  1. Playing Around with Google Font API
  2. Customize WordPress 2.5 Login Screen
  3. Customize the WordPress Login Screen

19 thoughts on “Styling CommentLuv Last Blog Post for WordPress”

  1. good work! I will have to add the ability for the user to change the stylesheet from within the settings page for the next update to commentluv so it makes it easier to change the way it looks. thanks

    • Wow, Andy, I'm so honored to see you here in my blog. Thanks for your comment. Looking forward to the next update of CommentLuv.

  6. I used to style my commentluv before and that’s exactly where I edit it. But I stopped doing it anymore cos everytime there’s an update of the plugin, my style disappears. Nakakapagod kahit na ni-save ko pa ang dating style sa desktop ko.

    • Yun nga lang problem kapag nag customize ka, everytime there's an upgrade, mag a-upgrade ka rin talaga. Ganun din yung sa customized login screen ko, laging na ooverwrite kaya copy paste ulit.

  7. Well to be honest this is not the first time when i remarked this plugin it looks fun and i am sure it wont do any harm to have it :).

  9. Wow, that looks way better! I haven’t used commentLuv yet, but after reading your post I think I will. I noticed that Marlene commented that whenever there is an update to the plugin it replaces your code. I guess one just needs to remember that and make the change each time.