How To Hide/Delete "Leave a Reply" On Dozens Of Pages

I have dozens upon dozens of pages that have a “Leave a Reply” box at bottom of pages like:

http://dc.cartoonfile.com/business-cartoon-biz-049/

OR

http://dc.cartoonfile.com/yooper-michigan-cartoon-028/

And I have tried this code in my “style.css” and tried it without the dash after first “single” word. Can anyone offer other directives?

.single-single-post #comments {
display: none;
}

The DOM

<div id="respond" class="comment-respond">
	<h3 id="reply-title" class="comment-reply-title">Leave a Reply <small><a rel="nofollow" id="cancel-comment-reply-link" href="/business-cartoon-biz-049/#respond" style="display:none;">Cancel reply</a></small></h3>
	<div id="commentform" class="comment-form">
		<iframe src="http://jetpack.wordpress.com/jetpack-comment/?blogid=59943007&postid=12825&comment_registration=0&require_name_email=1&stc_enabled=1&stb_enabled=1&show_avatars=1&avatar_default=mystery&greeting=Leave+a+Reply&greeting_reply=Leave+a+Reply+to+%25s&color_scheme=light&lang=en-US&jetpack_version=2.7&sig=fb0ea33418541a7e0aadd67faabd333a7d606fd4#parent=http%3A%2F%2Fdc.cartoonfile.com%2Fbusiness-cartoon-biz-049%2F" allowtransparency="false" style="width:100%; height: 430px;border:0px;" frameBorder="0" scrolling="no" name="jetpack_remote_comment" id="jetpack_remote_comment"></iframe>
	</div>
</div>

Try

div#respond {
  display: none;
}

If you really don’t ever want any comments - including “remote” - you should check your ACP settings
i.e. prevent them, not just not showing them

It worked great Mittineague. However, I was trying to leave the “Leave a Reply” box in only one section of my site…the blog. If you go here:
http://dc.cartoonfile.com/category/toonblog/

and click in yellow header : “Latest news” or “These Are My Favourites” which are a couple recent blog posts…that “Leave a Reply” comments box no longer is visible…is there possibly a directive to allow perhaps a display: inherit;?

You didn’t say that before :wink:
try

body.single div#page div#main div#primary div#content div#comments div#respond {
  display: none;
}

Allow me to suiggest another way of writing that :slight_smile:

Hi, danno2.

Remember the trick with the unique class in the body tag? (The one that should probably be an ID?)

style.css (line 296)
delete this selector completely. The original entry for #respond is found on line 1274.


[color=red]div#respond {
    display: none;
}[/color]

style.css (line 1274)


#respond {
    [color=blue]display: none;[/color]    /* ADD HERE instead */
    margin-top: 3.42857rem;
}

Then add a new selector: (assumes that .single is ONLY found in the body tag of that page)


[color=blue].single #respond {
    display:block;
}[/color]

Since you are not shy about using IDs (unless required by your CMS or JavaScript, most could easily be classes), I suggest that you add a UNIQUE ID to the body tag of each page so you can reliably use this method to override global styles on any page.

Thanks Ron, I do often tend to be more verbose and precise than needs be. Because we’re working with Id’s, much can be safely omitted from the selector.

The body tags have a lot of class :wink:
The pages where the hiding is wanted have

<body class="single
	 single-post
	 postid-12825
	 single-format-standard
	 custom-background
	 custom-font-enabled">

*have “single”.

The page where it’s wanted to be visible doesn’t have “single”

<body class="archive
	 category
	 category-toonblog
	 category-7015
	 custom-background
	 custom-font-enabled
	 infinite-scroll
	 neverending">

So as long as the only page(s) where it is wanted to be visible is/are the only one(s) that don’t have “single”, (and the obverse)

  • now I’m getting confuzzled :confused:
    I think this should work
.single #respond {
    display: none;
}

You mean I might have misread something? :blush: Aaargh.

I thought he was talking about only one page or group of pages, and when I looked at the HTML, I thought I saw .single in the <body> tag (thus my note qualifying it’s use). I got it backwards, though. Thanks for catching that. :sigh:

Off Topic:

Don’t feel unique, I thought you caught one of my mistakes and I had to double check the page DOMs twice to be sure.

Ron:
Extremely thankful. It works. However, going back to my first dilemma, it now allows for the “leave a Reply” comments box on those dozens of other pages like I first mentioned such as:
http://dc.cartoonfile.com/business-cartoon-biz-049/

OR

http://dc.cartoonfile.com/yooper-michigan-cartoon-028/

and the code I used in my “style.css” was:
div#respond {
display: none;
}
#respond {
display: none; /* ADD HERE instead */
margin-top: 3.42857rem;
}
.single #respond {
display:block;
}

So as Mittineague said in the latter part of his last post “but dont have single”. Should I now delete that single BEFORE the #respond in the code I just added to my “style.css”?

I appreciate this input from you both…

danno2,

First lets clean up the local CSS.

PLEASE delete these RED conflicting/duplicate entries from your local CSS.

Delete this entry:
style.css?ver=3.8 (line 309)

[color=red]
.single #respond {
    display: block;
}
[/color]

Delete this entry:
style.css?ver=3.8 (line 302)

[color=red]
div#respond {
    display: none;
}
[/color]

Delete this entry:
style.css?ver=3.8 (line 296)

[color=red]
div#respond {
    display: none;
}
[/color]

Delete this entry:
style.css?ver=3.8 (line 305)

[color=red]
#respond {
    display: none;
    margin-top: 3.42857rem;
}
[/color]

PLEASE EDIT this ONE entry in your local CSS.

style.css (line 1274)


#respond {
    [color=blue]display:none;[/color]  /* ADD ME per Mittineague */
    margin-top: 3.42857rem;
}

NEXT,

It appears that there is no convenient way to target the #respond boxes that you wish to have visible without adding an ID or class to the HTML.

Here are 3 possibilities:

(1)
The body tag on each page to be targeted can be given a unique ID; thereafter, the page(s) can be individually targeted. This is the most flexible approach.


<body id="[i]uniqueid[/i]" class="single single-post postid.....etc>

The css would look like this:


#uniqueid #respond {display:block;}   /* there should be one selector for each page to be targeted */

(2)
class=“showrespond” can be added to the body tag of each page whose #respond box should be visible. This is an easy single purpose targeting technque.


<body class="showrespond single single-post postid.....etc>

The css would look like this:


.showrespond #respond {display:block;}   /* this is the only entry in CSS */

(3)
class=“showrespond” can be added to the div tag of each #respond box that should be visible. This is an easy single purpose targeting technque.


<div id="respond" class="showrespond">

The css would look like this:


#respond.showrespond {display:block;}   /* this is the only entry in CSS */

Pick the one that is the easiest or most promising for you to work with. :slight_smile:

reference supplement:


http://dc.cartoonfile.com/category/toonblog/     /* this page has no #respond box.  From here you select "these are muy favorites" or "latest news" */
<body class="archive category category-toonblog category-7015 custom-background custom-font-enabled infinite-scroll neverending infinity-end">

http://dc.cartoonfile.com/these-are-my-favourites/
<body class="single single-post postid-13779 single-format-standard custom-background custom-font-enabled">
body.single div#page div#main div#primary div#content div#comments div#respond {  /* should be visible */

http://dc.cartoonfile.com/latest-news/
<body class="single single-post postid-18806 single-format-standard custom-background custom-font-enabled">
body.single div#page div#main div#primary div#content div#comments div#respond {  /* should be visible */

http://dc.cartoonfile.com/business-cartoon-biz-049/
<body class="single single-post postid-12825 single-format-standard custom-background custom-font-enabled">
body.single div#page div#main div#primary div#content div#comments div#respond {  /* should be hidden */

http://dc.cartoonfile.com/yooper-michigan-cartoon-028/
<body class="single single-post postid-7555 single-format-standard custom-background custom-font-enabled">
body.single div#page div#main div#primary div#content div#comments div#respond {  /* should be hidden */

So far so good Mittineague. I have cleaned up my “style.css” according to your instructions here and am currently at the next step of your post starting:
[B][I]Here are 3 possibilities:

(1)
The body tag on each page to be targeted can be given a unique ID; thereafter, the page(s) can be individually targeted. This is the most flexible approach.
Code:
[/I][/B]
and from the bottom up, inside my “style.css” editor, here are 4 current entries:
[B][I]footer.entry-meta .entry-date {
display: none;
}
body.page-id-13758 .sharedaddy,
body.page-id-13758 #comments {
display:none;
}

}
.category-toonblog #comments {
display: inherit;
}

#respond {
display: none; /* ADD ME per Mittineague */
margin-top: 3.42857rem;
}[/I][/B]
so my next question is regarding which of the 3 is best one. Hang on, I just wanted to show you where I am at…I appreciate your insights…

Back after reading through the 3 suggestions Mittineague and have a question then, regarding every time I make a new blog post. Am I understanding correctly, that based on:

http://dc.cartoonfile.com/category/toonblog/ /* this page has no #respond box. From here you select “these are muy favorites” or “latest news” */
<body class=“archive category category-toonblog category-7015 custom-background custom-font-enabled infinite-scroll neverending infinity-end”>

I would be required to manually add that: <div id=“respond” class=“showrespond”> into the HTML of each new future blog post?
If add: #respond.showrespond {display:block;} /* this is the only entry in CSS */ into my “style.css”?

Let’s back-up a step and clarify things.

Are there some page types that you never want the comment form to show?
Are there some page types that you always want the comment form to show?
Are there some page types that you want the comment form to show only for a period of time?

Hi Mittineague: In response to your first question

Are there some page types that you never want the comment form to show? All of them, only want the comment box to show in my blog posts on this pagehere. Such as in “Latest News” and “These Are My Favourites” and others I post in the future.
Are there some page types that you always want the comment form to show? No
Are there some page types that you want the comment form to show only for a period of time? No

OK thanks, (As ronpat pointed out, replace not add to)

#respond {
    display:none;  /* ADD ME per Mittineague */
    margin-top: 3.42857rem;
}
.category-toonblog #respond {
    display: block;
}

I’m guessing the blog will be the only page with the class category-toonblog
I don’t know where the margin-top came from or what unit a rem is, but I’m surprised it would have any effect on something not displayed.

Hi Mittineague: Just added :

#respond {
display:none; /* ADD ME per Mittineague */
margin-top: 3.42857rem;
}
.category-toonblog #respond {
display: block;
}

to my “style.css” but nothing in the way of “Leave a Reply” box appears at[B] bottom of the blog pages[/B].

A typo error

Warning: Selector expected. Ruleset ignored due to bad selector.
Source File: http://dc.cartoonfile.com/wp-content/themes/twentytwelve-child-01/style.css?ver=3.8
Line: 297
Source Code:
}

body.page-id-13758 #comments {
    display:none;
}

}
.category-toonblog #comments {
  display: inherit;
}


#respond {
    display:none;  /* ADD ME per Mittineague */
    margin-top: 3.42857rem;
}
.category-toonblog #respond {
    display: block;
}

And that extra brace isn’t the only typo. True, most of the CSS warnings are about vendor prefixes, but not all. When you get a chance you should go to the CSS validator http://jigsaw.w3.org/css-validator/ and sift through them.

Mittineague:
I am going to add the revision soon and will be back to let you know…have to step out and do something. I really appreciate your help…sorry to put you through alot of typing back & forth here on the forum. I wish I could learn this on my own…I need to set aside more time and really study it. I once thought using Frontpage WAS HARD! LOL! Back soon . . . .

[ot]No problem, it’s not like I have to be here.
In ways it gets easier, but there’s always more “hard” things left to learn.
Taking a break is a good idea, I am getting hungry[/ot]

Hi Mittineague:
I deleted that extra brace. Re-checked the blog pages but alas, the “Leave a Reply” and comments box is not visible. Am going to use the CSS validator to see what may be the problem. Thank you though.