Hide image

• 

  fabiobezerra1807gmailcom · Member · Apr 12, 2017 at 9:34 am

  • Copy link
  • Add topic to favorites

  Hello all, that’s my first time in the forum and I’m still trying to get familiar with webpage developing, thus, I’ll try to be as clear as possible even if it sounds too basic for you.

  I created a page called “Find Us” and this page have a link in home page. I added one picture to “Find Us”, however, I want it to be shown only on the link in Home Page and not in the “Find Us” page itself.

  I looked for the selector of the image in site developer and included the following code in CSS:

  .entry-thumbnail img, .post-thumbnail img {
  display: none;
  }

  However, when I do that all images in all pages of my site are removed. I’m almost sure that the selector I’m using is not correct but I cannot manage to find the correct one.
  My question is, how can I restrict this code to act only on the image I want?

  Thanks in advance

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Apr 13, 2017 at 2:37 am

  • Copy link

  Hi there, I see you have found the solution by using the page id CSS class from the opening body html tag.

  .page-id-45 .site-content .hero .attachment-dara-page-thumbnail.size-dara-page-thumbnail.wp-post-image {
  	display:none
  }

  Let us know if you have additional questions.

• 

  fabiobezerra1807gmailcom · Member · Apr 13, 2017 at 10:57 am

  • Copy link

  Indeed, I found the solution after several tries. I’m still struggling to proper identify selectors but I’m getting better on this.

• 

  thesacredpath · Member · Apr 13, 2017 at 5:39 pm

  • Copy link

  Hooray! When starting out with CSS, it can be challenging, but it just takes some time to start to get a feel for things, and as always, we are here to help if you get stuck.