Hide social media for pages and posts

Sure, you can do that in a few steps.

The first piece is this code which hides the social media icons and search bar everywhere:

.social-media-icons,
.site-header .search-form-container {
  display: none;
}

To limit it to one page/post in particular, you update the CSS selectors like this:

.singular-post-44 .social-media-icons,
.singular-post-44 .site-header .search-form-container {
  display: none;
}

This will hide them only on a post with the ID 44. You can follow these steps to find the ID of any page or post.

If you wanted to hide them on a page with an ID of 17 too, you would update the code like this:

.singular-post-44 .social-media-icons,
.singular-post-44 .site-header .search-form-container,
.singular-page-17 .social-media-icons,
.singular-page-17 .site-header .search-form-container {
  display: none;
}

• This reply was modified 7 years, 9 months ago by Ben Sibley.

super, pefekt, thanks.

And how can I adjust this for a whole category of articles? Category Name for example “Mentoring”

This is currently my code, can one separate several pages or articles with comma or semicolon?

/* Social Media & Suche ausblenden
.singular-post-000 .social-media-icons,
.singular-post-000 .site-header .search-form-container,*/

.singular-page-457 .social-media-icons,
.singular-page-457 .site-header .search-form-container,
.singular-page-462 .social-media-icons,
.singular-page-462 .site-header .search-form-container,
.singular-page-384 .social-media-icons,
.singular-page-384 .site-header .search-form-container,
.singular-page-447 .social-media-icons,
.singular-page-447 .site-header .search-form-container {
  display: none;
}

• This reply was modified 7 years, 9 months ago by ___ELVIS___.

^ The way you’ve got it now is perfect.

The classes are similar for categories and tags:

.category-2 {}
.tag-8 {}

A complete example would be:

.category-40 .social-media-icons,
.category-40 .site-header .search-form-container {
  display: none;
}

• This reply was modified 7 years, 9 months ago by Ben Sibley.

Hi, thanks for the support.

Unfortunately this does not work. I have the category ID. Here is a screenshot.

https://www.dropbox.com/s/3puhu23zpdy2lkh/category.jpg?dl=0

And the code then inserted into the CSS.

.category-3 .social media icons,
.category-3 .site-header .search-form-container {
?? Display: none;
}

Unfortunately does not work. What am I doing wrong?

Maybe I did not express myself correctly. I hide this with all articles to the category “XYZ”. That is the destination.

Translated with the google translator from the German

• This reply was modified 7 years, 9 months ago by ___ELVIS___.
• This reply was modified 7 years, 9 months ago by ___ELVIS___.

Got it, two things:

First, the “-” are missing in “social-media-icons” which would prevent it from working.

Second, I may have misunderstood you. The code I shared would hide the search bar and social icons on a category archive like this. There isn’t a way with CSS to hide the search bar and social icons on all posts that belong to a certain category.

Okay, “-” copy / paste problem …. ?? Okay, so I have to list each article individually. OK

THANK YOU

Sure thing, happy to help ??