Changing Resonar Theme Featured Image in Post Titles

• 

  brentdsheffield · Member · Apr 11, 2015 at 9:14 am

  • Copy link
  • Add topic to favorites

  If I upgrade to where I can customize CSS, is there a way to change how the Resonar Theme displays titles on post pages.

  It naturally places a huge version of the featured image under the title of the post.

  With my header, the featured image and title won’t appear. If I removed the featured image, the title displays beautifully but the picture won’t appear on my homepage.

  Again, I prefer the title on post page without the enormous featured image underneath it.

  I’d like to have the title display without the featured image although I still use the featured image option for photos to show up on my homepage.

  Can I customize this with CSS?

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

• 

  brentdsheffield · Member · Apr 11, 2015 at 9:14 am

  • Copy link

  this is for my responses

• 

  thesacredpath · Member · Apr 14, 2015 at 9:53 pm

  • Copy link

  Hi there, to hide the featured image on single post pages, the following CSS will do it.

  .single .entry-header-background {
  display: none;
  }

  You can try out and preview custom CSS before you buy as explained here.

• 

  brentdsheffield · Member · Apr 14, 2015 at 10:50 pm

  • Copy link

  awesome code!

• 

  thesacredpath · Member · Apr 14, 2015 at 11:14 pm

  • Copy link

  Great, glad that did the trick. :)

• 

  jdaoud33 · Member · Apr 22, 2015 at 4:37 am

  • Copy link

  Hi I also have a question regarding the resonar theme… is there a way I can edit the CSS so that the featured images aren’t full size when viewed on mobile?

  I tried messing around with “mobile” under appearances but I hate the way it looks… I would love for it to look just like it does on the web just with featured images that fit the mobile screen. Help?!

  Thanks in advance!

  Site: http://officialsimplyjules.wordpress.com

• 

  thesacredpath · Member · Apr 22, 2015 at 3:50 pm

  • Copy link

  @jdaoud33, with the Mobile theme turned off, when I view your site with Resonar, the image is sized for the screen on my iPhone in portrait orientation. In Landscape orientation, it does crop out of lot of the image, but to have the image full width, some cropping is required. If we were to try and get the full image to show in landscape orientation, the image would be very, very tiny with a lot of whitespace to the left and right of the image. Resonar simply doesn’t lend it self well to images with a strong vertical content, at lease when viewing on smaller screens in landscape orientation, such as the case with the featured image on your featured post on your front page.

  We could use media queries to resize things for phones, but with the wide variety of phone screen sizes anymore, this is quite a job. A media query would be required for each dimension. Just covering iPhones, you would be looking at 8 (2 for each of 4S, 5C/S, 6 and 6 Plus). That hasn’t even begun to cover the plethora of Android-based phones out there.

• 

  blutopicecream · Member · May 20, 2015 at 12:15 pm

  • Copy link

  Hi,

  I have a similar issue – I’d like to remove the featured image header in the post but keep the post title. When I remove the image it takes away the date and title of the post too. Any way to just get rid of the image?

  Thanks!

• 

  kathrynwp · Staff · May 22, 2015 at 3:06 pm

  • Copy link

  blutopicecream – could you please start a fresh thread and provide a link to the specific post you want to tweak? Thanks.