Positioning Cart, Primary & Secondary Navigation in Foster.

Hello. I'm using the Foster template. I'd like to switch my navigation around so that my cart icon is to the left of my Log In option. Please see photo for example. In site styles, I have Log In in my secondary navigation. Origins, Stockists, FAQ & Contact are in my primary navigation. When I position my cart to top left in site styles, it automatically appears to the right of secondary naviagation. I hope this makes sense.

Any suggestions would be appreciated, thank you in advance.

@coswebb Can you share site url?

Hello @tuanphan - sorry, my site is still a trial site. I'll upgrade this coming week and get back to you. Thank you.

Hello @tuanphan - sorry, my site is still a trial site. I'll upgrade this coming week and get back to you. Thank you.

@coswebb You don't need upgrade to share site url. Just setup password, then share url :). See how to: https://beaverhero.com/squarespace-how-to/

Hey @coswebb,

If there's no other customization to the site, the Custom CSS below should take care of it for you.

Add the following in your Design > Custom CSS entry:

[data-nc-base="header"] [data-nc-container="top-left"] [data-nc-element="cart"] {
 order: 0;
}

Hope it helps!

James

Yes! This worked. Thank you very, very much.

Kindly,Sarah

Hi There,

For some reason my cart doesn't show up at all. I've tried everything that I can search or think of. I desperately need help. 

On 5/24/2020 at 1:34 AM, DeanHendrix said:

Hi There,

For some reason my cart doesn't show up at all. I've tried everything that I can search or think of. I desperately need help. 

Can you share link to your site?

hey i have a split nav but also want to have the cart icon above? any thoughts?

helix-marigold-76hn.squarespace.com

pw: 1234

6 hours ago, jilldiane_ said:

hey i have a split nav but also want to have the cart icon above? any thoughts?

 

helix-marigold-76hn.squarespace.com

pw: 1234

Hi. I see cart icon next to contact item here. Can you explain in more detail your problem?

@tuanphan id like the cart to be above the contact item like screenshot attached. hopefully this makes more sense

On 7/9/2021 at 10:31 PM, jilldiane_ said:

@tuanphan id like the cart to be above the contact item like screenshot attached. hopefully this makes more sense

Add to Design > Custom CSS

@media screen and (min-width:1025px) {
.header-actions--right .header-actions-action {
    position: absolute;
    top: -20px;
    right: 70px;
    z-index: 999;
}
}
@media screen and (min-width:1226px) and (max-width:1300px) {
.header-actions--right .header-actions-action {
    right: 75px;
}
}
@media screen and (min-width:1301px) and (max-width:1400px) {
.header-actions--right .header-actions-action {
    right: 90px;
}
}
@media screen and (min-width:1401px) and (max-width:1500px) {
.header-actions--right .header-actions-action {
    right: 100px;
}
}
@media screen and (min-width:1501px)  {
.header-actions--right .header-actions-action {
    right: 120px;
}
}

@tuanphan THANK YOU

On 7/12/2021 at 5:22 AM, jilldiane_ said:

@tuanphan THANK YOU

Do you need fix these issues?

Site URL: http://helix-marigold-76hn.squarespace.com

1. (All devices – Homepage) There is a scroll bar at the bottom of the page

2. (Tablet – Footer) Do you want to make copyright lie on the same row?

3. (Mobile – Footer) Want to make footer links to 2 column? (as on tablet/Desktop)

4. (Tablet – Homepage) Text is so close to icon

5. (Mobile/Tablet – Homepage) Background image don’t show in full size

6. (About us) You haven’t changed SEO Title so the browser tab name still shows “About 1”

https://helix-marigold-76hn.squarespace.com/about-us

7. (Desktop/Tablet – land title) Content is too close to the margins

https://helix-marigold-76hnsquarespace.com/land-title

8. (Tablet – Homepage) Burger icon is too close to the margins

9. (Tablet-Homepage) Orange icon look so big, do you want to reduce the size?

@tuanphan Yes i need help with the secondary menu!!! Its working in my codepen but not when i transfer the code to squarespace.. on squarespace it does not drop down on hover. 

here is the codepen: https://codepen.io/jilldiane/pen/ZEKXdpe



site: https://helix-marigold-76hn.squarespace.com/
pw: 1234

5 hours ago, jilldiane_ said:

@tuanphan Yes i need help with the secondary menu!!! Its working in my codepen but not when i transfer the code to squarespace.. on squarespace it does not drop down on hover. 

here is the codepen: https://codepen.io/jilldiane/pen/ZEKXdpe



site: https://helix-marigold-76hn.squarespace.com/
pw: 1234

 

 

Add this code above script code you inserted.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

@tuanphan That still didn't work, when i hover over nothing happens, but it does work in the mobile view.

On 7/25/2021 at 11:19 PM, jilldiane_ said:

@tuanphan That still didn't work, when i hover over nothing happens, but it does work in the mobile view.

I see it worked here? Did you solve it?

@tuanphan i did thank you for following up