Jump to content

Bedford: Customize the height of the banner image?

Recommended Posts

I am completely clueless when it come to coding and need help! I'm using the bedford template. I'd like to shrink (or customize) the height of my banners - not just on the home page - to use images about 1280 x 400 instead of the current 1280 x 800. How do I do this?

Also- does that change where the description ends up? Do I have to add anything to keep it centered among the banner image?

And just to be clear, can you specify the parts of the code I would need to change if the image wasn't 400px height? (maybe make them bold so I can pick them out?)

**Bonus: Is there a way to customize the height of the header (nav bar) as well?

Thanks so much for the help!

Link to comment
  • Replies 4
  • Views 10.6k
  • Created
  • Last Reply

Based on the solution here, this code should work:

.transparent-header.view-list .banner-thumbnail-wrapper,
.transparent-header.collection-type-page .banner-thumbnail-wrapper{
  padding: ##px 0px ##px;

Where you replace the ## with the sizing that works best for you.

This code appears to work for pages with banners provided by thumbnail images (not promoted Gallery Blocks).

Link to comment
  • 2 months later...


This topic is now archived and is closed to further replies.

This topic is now closed to further replies.
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.