Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Code to fix banner in Bedford template


Go to solution Solved by paul2009,

Question

Site URL: https://www.sugartoothtours.com

Hi there,

Does anyone have any suggestions for fixing the banner on the homepage? The banner is responsive, but I would like it to remain fixed so that it doesn't crop any of the image out. The template is Bedford and the homepage is www.sugartoothtours.com. Hoping to create a fix that would only affect the banner on the homepage. Thanks!

Link to post
  • Answers 4
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

It's not your fault @SugartoothTours. The code posted above isn't valid. However, rather than trying to change the way Bedford crops the banner image, the more reliable solution would be to remov

4 answers to this question

Recommended Posts

  • 1

It's not your fault @SugartoothTours. The code posted above isn't valid.

However, rather than trying to change the way Bedford crops the banner image, the more reliable solution would be to remove the text/graphics from the image so that the cropping isn't an issue. This will make the banner image clearer on mobile too. You can then add the review banner text and graphics as a separate item using an Image Block that won't crop.

sf-digital-signature-logo-email145.png.46606a2288a2847f44d81b9b7b58f3a5.png
Hi, I'm Paul, founder of SF Digital, a specialist company helping Squarespace users by building the features that Squarespace didn't include.
Explore our range of Squarespace Extensions, including the Wishlist, and Datepicker Extension or book a Squarespace Expert for 1:1 help. Note that links in my posts may be affiliate links.

Link to post
  • 0
.#collection-5ddacc77460bea394445873a .transparent-header.view-list .banner-thumbnail-wrapper,
.transparent-header.collection-type-page .banner-thumbnail-wrapper {
 padding: 180px 0 155px;
}

This is targeted to the banner the image is in on the home page. You can adjust the padding numbers to enlarge or shrink the banner and the image will fill the box. I am assuming your banner header is set for transparent. If it has an adverse effect just remove it and let me know. 

Edited by derricksrandomviews
Link to post
  • 0

Thanks for the help! It didn't work, but maybe I'm doing something wrong. I added the code to custom css and it still isn't a fixed banner image. It also says there is a syntax error in line one.

Link to post
  • 0
15 hours ago, SugartoothTours said:

Thanks for the help! It didn't work, but maybe I'm doing something wrong. I added the code to custom css and it still isn't a fixed banner image. It also says there is a syntax error in line one.

Can you post all code here?

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...