Jump to content

removed "burger" on phone view cant see "account"

Go to solution Solved by tuanphan,

Recommended Posts

Posted

removed "burger" on phone view cant see "account" id ideally like it on the left of the screen so the favicon/logo is centre. any help?

i do have another problem id like to neaten up the edges a bit on the quantity box and variation make them look the same and maybe align them up

and id like to swap the "purchase" button to a image online i have the link just need the code, thank you in advance anyone

5ea699d9c838a6136adeca0d0c741323.png

904223a4dfab3b975af80d24ac06ff28.png

  • Solution
Posted

Add to Website Tools (under Not Linked) > Custom CSS

@media screen and (max-width: 992px) {
.header-display-mobile {
    display: flex;
    order: 2
}
.header-display-desktop {
    width: auto !important;
    order: 1;
    flex: 0 0 75px !important;
    display: flex;
}
.header-burger, .header-display-desktop .header-title-nav-wrapper,
.header-display-desktop .header-actions-action--cart{
    display: none
}
.header-display-desktop .customerAccountLoginDesktop {
    display: block
}
.header-display-desktop .header-actions.header-actions--right {
    flex: unset !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!)

Posted

that worked a charm thank you so much, how would i change the purchase button to my own image? i was thinking of a paypal button or something like that i have the custom image for

 

[CITYPNG.COM]HD PayPal Add To Cart Yellow Button Transparent PNG - 2000x2000.png

view.png

Posted

Use this CSS code, replace example image url with new image url, because example has a lot of space inside

div.sqs-add-to-cart-button {
    border: none !important;
    background-image: url(https://content.invisioncic.com/p289038/monthly_2024_01/CITYPNG.COMHDPayPalAddToCartYellowButtonTransparentPNG-2000x2000.thumb.png.c8bcc8f3ada3b876fed3af86c6a22d3c.png) !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    color: transparent !important;
    padding: 40px !important;
}

image.thumb.png.e39589f170e1e130c91d721f42a95aab.png

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!)

Posted

that worked a char thank you kind sir, it has an outline when hovering how to get rid of that?

one more on the picture theres 2 arrows how can i make them black and a little smaller in size but maybe a bit thicker? 

7cdbe4960da2d6f01a485f3af6f32148.png

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.