Jump to content

Change color of only one page

Recommended Posts

  • Replies 17
  • Views 907
  • Created
  • Last Reply
3 hours ago, tuanphan said:

@elearo Add to Home > Design > Custom CSS


body#collection-5d8f7c600182e974a7c2dea9 .Main {
    background: #ff0000 !important;
}

 

Thanks, it worked! The only problem now is that the top part of the page is still white and I would like to change the title's color too (Eleonora Arosio), again just for the shop page. Any tips? Thanks a lot!

Link to comment
5 minutes ago, tuanphan said:

@elearo


body#collection-5d8f7c600182e974a7c2dea9 section.Intro {
    background: #ffe8e8 !important;
}
body#collection-5d8f7c600182e974a7c2dea9 .Header-branding {
    color: #333;
}

 

You've been so helpful, thanks! One last thing: is there a way to have the same color on the header too (again, only on the shop page) 
I basically want the page to look all pink, compared to the others which are all white

Thanks!

Link to comment

@elearo

.collection-type-products.view-item .Main {
    background: #ffe8e8;
}
.collection-type-products.view-item .Main * {
    color: white !important;
    border-color: white !important;
    stroke: #fff !important;
    fill: #fff;
}

 

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 minutes ago, tuanphan said:

@elearo


.collection-type-products.view-item .Main {
    background: #ffe8e8;
}
.collection-type-products.view-item .Main * {
    color: white !important;
    border-color: white !important;
    stroke: #fff !important;
    fill: #fff;
}

 

It's not working on the header tho? And the title is still pink and not white. The "Select Dimension" button seems to have some problems too?

Link to comment

@elearo

/* Header */
.collection-type-products.view-item .Header--top {
    background: #ffe8e8;
}
.collection-type-products.view-item .Header-branding {
    color: #fff;
}
.ProductItem-details .variant-select-wrapper select {
    background: #ffe8e8 !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
14 minutes ago, tuanphan said:

@elearo


/* Header */
.collection-type-products.view-item .Header--top {
    background: #ffe8e8;
}
.collection-type-products.view-item .Header-branding {
    color: #fff;
}
.ProductItem-details .variant-select-wrapper select {
    background: #ffe8e8 !important;
}

 

Thanks!
The dimensions tab is doing something funny: the pill shape is sort of cut and it won't show the options https://hypersphere-tomato-nka3.squarespace.com/shop/handreading

Link to comment

@elearo This code forced all elements in product page content to turn white. Because the product page has a lot of elements, checking each code would be very time consuming for me.

That code created a problem with the dimension.

.collection-type-products.view-item .Main *

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
  • 1 month later...

Archived

This topic is now archived and is closed to further replies.

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