Jump to content

Trying to adjust font on cover page

Recommended Posts

  • Replies 4
  • Views 1.2k
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

1 hour ago, GregR said:

Hi,

 

I'm trying to make my font more legible on my cover page for the navigation section. "Enter" is the text I'm looking to adjust, maybe similar to my brand logo with a transparent box behind it so that it is more visible against the images.  

 

Here is the site link.  https://www.gregoryreidphoto.com/home-1

 

Thank you!!

Screenshot 2024-04-11 at 10.36.07 AM.png

Hi, if you're looking for something like this, add the code below to custom css

image.thumb.png.9363d463e8bc73755ca5e7db7b111a09.png

.sqs-slide-wrapper[data-slide-type="cover-page"] [data-slice-type="buttons"] li, .sqs-slide-wrapper[data-slide-type="cover-page"] [data-slice-type="navigation"] li, .sqs-slide-wrapper[data-slide-type="cover-page"] [data-slice-type="sso-options"] li {
  background: rgba(226, 226, 226, .8);
}

.sqs-slide-wrapper[data-slide-type="cover-page"] [data-slice-type="navigation"] ul li a {
  color:#000;
}

.sqs-slide-wrapper[data-slide-type="cover-page"] [data-slice-type="navigation"] ul li a {
  padding-left: 0.3em!important;
  padding-right: 0.1em!important;
  padding-top: 0.3em;
  padding-bottom: 0.3em;
}

 

Please give this a 👍 if it helps. Make sure to quote me or tag me in your reply, otherwise I won't be notified.

Link to comment

Custom CSS won't run on Cover Page. You need to use this code to Cover Page Header Code Injection

<style>
  .sqs-slide-wrapper[data-slide-type="cover-page"] [data-slice-type="buttons"] li, .sqs-slide-wrapper[data-slide-type="cover-page"] [data-slice-type="navigation"] li, .sqs-slide-wrapper[data-slide-type="cover-page"] [data-slice-type="sso-options"] li {
  background: rgba(226, 226, 226, .8);
}

.sqs-slide-wrapper[data-slide-type="cover-page"] [data-slice-type="navigation"] ul li a {
  color:#000;
}

.sqs-slide-wrapper[data-slide-type="cover-page"] [data-slice-type="navigation"] ul li a {
  padding-left: 0.3em!important;
  padding-right: 0.1em!important;
  padding-top: 0.3em;
  padding-bottom: 0.3em;
}
</style>

 

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

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.