Jump to content

7.1 Full Bleed Slideshows

Recommended Posts

I see that you can do full bleed slideshows in 7.1, but I can't make one that goes under the header. I can make the header transparent, but the slideshow won't go under it. Is there a way to make the slideshow full bleed under the header?

Link to comment
  • 3 weeks later...
  • 6 months later...
  • 2 weeks later...
9 hours ago, anthony_12345 said:

I would also really appreciate a solution for this, if anyone could help .  I currently have a slideshow below the header (header set to transparent).  This is my first time using SquareSpace 7.1.

If you share link to your site, we can check carefully

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
5 hours ago, anthony_12345 said:

Thank you, tuanphan.  I have sent you the link and password via message.

Add to Home > Design > Custom CSS

.homepage .header-announcement-bar-wrapper {
    background: transparent !important;
    position: absolute !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 2 weeks later...

Hi @sterlingsilvercat. This depends on your template family. If you are on one of the Brine family templates, I have a walkthrough in this post:

How to Create Full Bleed Slideshows in Squarespace

Just scroll down until you get to the section on 7.0.

christyprice.com  🇺🇸 Austin, TX US 

 Get my 100+ item Client Process Checklist for $17.
📔 Flourish Journal for Creative Entrepreneurs - 365 days of prompts
🎥 Watch Circle Live: Hello Income (feat. Christy Price and Jeremy Schwartz)
🎬 Watch It's Not Hard to Say Goodbye: Crafting Client Offboarding from Circle Day 2023

Link to comment
  • 6 months later...
On 1/16/2021 at 1:50 AM, tuanphan said:

It looks like you solved?

Thanks for looking, unfortunately, this isn't resolved yet.  My slideshow still does not fall behind my top header navigation?  There's still a gap of color up there.  I want the logo and text ON TOP of my slideshow.  If I do a still image (not a slideshow) block. It works fine.

Edited by Lorne17
Link to comment
On 1/18/2021 at 12:08 AM, Lorne17 said:

Thanks for looking, unfortunately, this isn't resolved yet.  My slideshow still does not fall behind my top header navigation?  There's still a gap of color up there.  I want the logo and text ON TOP of my slideshow.  If I do a still image (not a slideshow) block. It works fine.

Hi. Sorry for the delay. Can you check url again? 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
On 1/24/2021 at 2:23 PM, Lorne17 said:

URL is this now: https://activestatedesigns.squarespace.com/

Password: SiteTest

 

The slider and gallery at the top of the home page is still not behind the transparent header?

Your site has expired. You can contact Squarespace Customer Care to extend trial (free)

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
On 1/31/2021 at 4:38 AM, tuanphan said:

Your site has expired. You can contact Squarespace Customer Care to extend trial (free)

Just got it extended!  Thanks for the tip.

 

Now back to the issue at hand.  How do I fix my slideshow on homepage to have the top navigation menu ON TOP of the slide show with transparent background?


Thanks,

Lorne

Link to comment
On 2/8/2021 at 10:37 AM, Lorne17 said:

Just got it extended!  Thanks for the tip.

 

Now back to the issue at hand.  How do I fix my slideshow on homepage to have the top navigation menu ON TOP of the slide show with transparent background?


Thanks,

Lorne

Add to Design > Custom CSS

body.homepage #page section:first-child {
    padding-top: 0 !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

One follow-up, how do I get my menu text to be white?  I got my background transparent black, but text I cannot get to change to white?  Also, what class do I use to make the header shorter in height?

.header-announcement-bar-wrapper {
  background: #000; /* fallback color for old browsers */background: rgba(0, 0, 0, 0.2);
  color: #000;
  /*text-shadow: 1px 1px 1px #fff;*/
}

URL: https://activestatedesigns.squarespace.com/

Password: SiteTest

 

Thanks in advance, 
Lorne

Edited by Lorne17
Link to comment
7 hours ago, Lorne17 said:

One follow-up, how do I get my menu text to be white?  I got my background transparent black, but text I cannot get to change to white?  Also, what class do I use to make the header shorter in height?


.header-announcement-bar-wrapper {
  background: #000; /* fallback color for old browsers */background: rgba(0, 0, 0, 0.2);
  color: #000;
  /*text-shadow: 1px 1px 1px #fff;*/
}

URL: https://activestatedesigns.squarespace.com/

Password: SiteTest

 

Thanks in advance, 
Lorne

Add to Design > Custom CSS

/* header height */
.header-announcement-bar-wrapper {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}
/* menu white */
body.homepage .header-nav-item a {
    color: white !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 7 months later...
On 6/2/2020 at 4:32 PM, tuanphan said:

Add to Home > Design > Custom CSS

.homepage .header-announcement-bar-wrapper {
    background: transparent !important;
    position: absolute !important;
}

 

This worked for me! You have to have the page set as your homepage to get it to work. Then the images will do a full bleed in the header area with text on top. Thanks!

Link to comment

Create an account or sign in to comment

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

×
×
  • 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.