Bedford: customise blog

Site URL: https://www.mentalhealthinstitute.org.au/resources

Hi there,

I'm using the Anya template in the Bedford family. 

I was wondering if anyone knows how to adjust the width of a blog post so that the page content appears to be the same width as other normal pages?

The blog post (10/10 image example) doesn't take up the full width of the content, whereas other pages do (Short Courses, for example).

i would also find it helpful, to know what css to use to hide the "older post" link displayed at the bottom of posts, and css to hide the date and author metadata at the top of a post. I've got it set to transparent for now, but that also hides the tag information, which I would like to have visible.

Would greatly appreciate any help.

Bonnie

Where is blog? Can you share link to a blog to check code?

Thanks @tuanphan. It's here: https://www.mentalhealthinstitute.org.au/resources

On 2/4/2020 at 7:54 AM, bonnie_adm said:

Thanks @tuanphan. It's here: https://www.mentalhealthinstitute.org.au/resources

Add to Home > Design > Custom CSS

.collection-type-blog.view-item {
	/* hide older */
  .older {
      display: none !important;
  }
  /* content width */
  div#content {
      max-width: 100% !important;
  }
  main#page {
      padding-left: 20px;
      padding-right: 20px;
      max-width: 100%;
  }
}

Thanks @tuanphan! This is great. I actually ended up using 

}

.collection-type-blog.view-item {
    /* hide older */
  .older {
      display: none !important;
        /* hide newer */
  } 
  .newer {
      display: none !important;
  }
  /* content width */
  div#content {
      max-width: 60% !important;
  }
  main#page {
      padding-left: 20px;
      padding-right: 20px;
      max-width: 100%;
  }
}

as the 60% width was more in line with the other pages on the website. And I also discovered the blog adding a 'Newer Post' section at the bottom, so I tweaked your CSS to hide that as well. It looks so much better now! Thank you.