Moving image above title in blog post Penscratch theme

• 

  suegentdesign · Member · Jan 27, 2015 at 7:47 pm

  • Copy link
  • Add topic to favorites

  Hi – does anyone know how to move an image above the post title in Penscratch? I would like to do this with my top post in particular. I have used my logo as a header so it would be great to start with an image…

  Many thanks
  Sue

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

• 

  staff-happychia · Staff · Jan 28, 2015 at 8:05 am

  • Copy link

  The CSS solution is going to be a bit messy and inelegant.

  I suggest you don’t have a title and instead have the following html as the first line of your content.

  <h1>HEADING HERE</h1>

  This way your post starts with image.

  Please let me know how do you prefer:
  NOVEMBER 1, 2014 ~ LEAVE A COMMENT

  Let’s see how can we place it where you want.

• 

  suegentdesign · Member · Feb 10, 2015 at 2:55 pm

  • Copy link

  Hi – sorry for the delay. I finally got round to trying this but couldn’t get it to work quite right. I decided though that the best thing for now is to have just an image by itself as the top post. No header, as you said.

  But I wondered if there’s any way I can take the post info off the image? The bit that says IMAGE ~ FEBRUARY 10, 2015 ~ LEAVE A COMMENT ~ EDIT

  Is there any way that can be removed from a post? I would want the image to start higher up (where this info is) if possible – ie. so the image can be bigger.

• 

  staff-happychia · Staff · Feb 11, 2015 at 9:34 am

  • Copy link

  Sure, we can hide the date and comment prompt for the first post in two ways:

  1. Using the id of the first post (post-254). But this doesn’t work if you change the post id, typically by deleting the current first post and add another one. Because re-creating the first post changes its id making this code ineffective.

  #post-254 .entry-meta {
      display:none;
  }

  2. This style hides the first child of the page. So hides the date and comment prompt for the first post on this page, doesn’t matter whatever id the first post has.

  main#main article:nth-of-type(1)  .entry-meta {
      display:none;
  }

  Please use either of the two but I prefer the second because it is more generic. :-)

• 

  suegentdesign · Member · Feb 11, 2015 at 9:49 am

  • Copy link

  It works! Thanks so much – as always.

• 

  staff-happychia · Staff · Feb 11, 2015 at 10:03 am

  • Copy link

  No worries, I am here to help as much as I can :-)