Need help? Check out our Support site, then


Comment boxes on San Kloud - can't inspect elements

  1. I'm trying to modify my comment boxes on the San Kloud theme. Here's what I tried for the biggest background images:

    .comment-wrapper {
        background: url("http://bumblepuppies.files.wordpress.com/2014/01/btf.png") no-repeat scroll left top transparent;
    }
    
    .comment-body {
        background: url("http://bumblepuppies.files.wordpress.com/2014/01/bmf.png") repeat-y scroll left top transparent;
    }
    
    .comment-bottom {
        background: url("http://bumblepuppies.files.wordpress.com/2014/01/b2f.png") no-repeat scroll left top transparent;
    }

    The bottom piece of the image didn't change over. I guessed .comment-bottom because I knew .reply-wrapper was wrong. What is the name of the bottom piece of that background image? The reply wrapper is blocking me from inspecting that element.

    I had also wanted to change the smaller reply boxes but I could find no background image names. I also checked for an rgb setting just in case, but I found none. If these are also background images, could I get the names for them as well?

    Thank you as always.

    The blog I need help with is bumblepuppies.wordpress.com.

  2. The three I find are .comment-wrapper, .comment-body and .reply-wrapper. Background images in those three make up the background for individual comments.

    Here is the CSS for the .reply-wrapper with the background declaration in it:

    .reply-wrapper {
        background: url("/wp-content/themes/pub/san-kloud/colors/default/images/comment-bottom.png") no-repeat scroll left top rgba(0, 0, 0, 0);
    }

    The three images are:
    .comment-wrapper: http://s1.wp.com/wp-content/themes/pub/san-kloud/colors/default/images/comment-top.png

    .comment-body: http://s1.wp.com/wp-content/themes/pub/san-kloud/colors/default/images/comment-middle.png

    .reply-wrapper: http://s1.wp.com/wp-content/themes/pub/san-kloud/colors/default/images/comment-bottom.png

  3. Ah... thank you. That pretty much worked but I'll need to revise my custom bottom piece because I didn't make it tall enough. I can live with the other reply boxes as-is if it's too complicated to change them over.

    To explain what I mean, here's a blog post:

    http://bumblepuppies.wordpress.com/2014/01/15/anthills-insult-my-intelligence/#comments

    The three images you gave me work for the boxes that are shaped like Martha's Kennedy's comment "Hate the little buggers." The smaller boxes for my replies (like "I like them better at the zoo") and continued conversation (like "I'm still waiting for the opportunity to try chocolate covered insects") were unchanged. I couldn't find any background images for those box types.

  4. From the looks of things, the images are only applied to depth 1 comments and not to replies to that comment (depth 2), or replies to replies (depth 3, etc.). Depths 2 and greater do not have the images applied to them. Here are the two relevant rules in the CSS that exclude the images for depth 2, 3, etc.

    ul.children .comment-wrapper {
        background: none repeat scroll 0 0 #B4DCDA;
        border-left: 1px solid #FFFFFF;
        border-top: 1px solid #FFFFFF;
    }
    
    ul.children .comment-body, ul.children .reply-wrapper {
        background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    }
  5. Thanks very much. It's all up and running now... unless I decide I don't like the new colors.

  6. You are welcome.

Topic Closed

This topic has been closed to new replies.

About this Topic