Jump to content

Jasper Jin Template: How to make Fixed Site Title/Nav Header

Go to solution Solved by tuanphan,

Recommended Posts

Could somebody please help me to address 2 looming design items I would like to address: Using Jasper Jin Template

1: I wish to make my Site Header fixed so that navogation is always visible when scrolling

2: More customizability for the color and shape, and overall design of Gallery Arrows would be nice.

 

Thanks in advance,

K

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

Top Posters In This Topic

  • Solution

#1. Add this code to Website Tools (under Not Linked) > Custom CSS

header#header {
    position: sticky;
    top: 20px;
    position: -webkit-sticky;
}

#2. Can you share link to page where you use gallery arrows? We can check easier

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...
On 10/17/2023 at 2:23 PM, KyloRoux said:

Thanks that worked!

Is there a way to add a transparent white background to the header?

 

Re: Arrows

See Bottom Gallery: 

https://www.kyleleroux.com/lanehouse-1

- I need the Arrows to be this color: hsl(1, 52%, 61%), thicker line weight with no background square

#1. You mean white background with an opacity?

#2. Use this CSS code

a.next, a.previous {
    background-color: transparent !important;
}
.sqs-gallery-controls a:before {
    color: hsl(1, 52%, 61%) !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
  • 3 weeks later...

Hi tuanphan,

 - #1 - Yes, preferably with adjustable size/height of background so it's not too thick.

- #2 - Thank you! this worked. Is there a way to adjust lineweight and overall size of arrow?

 

My site is drastically improved already with these subtle details:), I'm so grateful, thank you!!

 

KR

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.