Product Detail Page - Change Size of Title and Price

Hi there,

I'm trying to change the size of my title and price on my product detail page.  I've tried using the Site Styles and the following CSS, however, nothing is working.

This CSS didn't work:

/* Product Block Titles */
.product-block .productDetails .product-title {
  font-size: 1.8em;
}
/* Product Block Prices */
.product-block .productDetails .product-price {
  font-size: 1.5em;
}

Is this for a Squarespace 7.0 or 7.1 site?

On 10/28/2022 at 2:15 AM, xosarahdesigns said:

Hi there,

I'm trying to change the size of my title and price on my product detail page.  I've tried using the Site Styles and the following CSS, however, nothing is working.

This CSS didn't work:

/* Product Block Titles */
.product-block .productDetails .product-title {
  font-size: 1.8em;
}
/* Product Block Prices */
.product-block .productDetails .product-price {
  font-size: 1.5em;
}

That code for Product Block. With product detail page, it needs a different code. What is your site url? We can help easier

On 10/27/2022 at 6:54 PM, Caroline_Smith said:

Is this for a Squarespace 7.0 or 7.1 site?

It's for 7.1

On 10/31/2022 at 6:35 AM, tuanphan said:

That code for Product Block. With product detail page, it needs a different code. What is your site url? We can help easier

https://xosarahdesigns.squarespace.com/config/design

On 11/9/2022 at 7:27 AM, xosarahdesigns said:

https://xosarahdesigns.squarespace.com/config/design

The site is private. Can you setup an access password?

6 hours ago, tuanphan said:

The site is private. Can you setup an access password?

Sorry about that.  The password is xosarahdesigns

On 11/12/2022 at 11:57 PM, xosarahdesigns said:

Sorry about that.  The password is xosarahdesigns

Use some code like this

.pdp-layout .pdp-details .pdp-details-title {
    font-size: 1.8em !important;
}
.product-price {
    font-size: 2.2em !important;
}

7 hours ago, tuanphan said:

Use some code like this

.pdp-layout .pdp-details .pdp-details-title {
    font-size: 1.8em !important;
}
.product-price {
    font-size: 2.2em !important;
}

 

Thank you, it worked!  I would also like to change the spacing between the title, price and description.  Would you be able to provide a custom code for that?

On 11/21/2022 at 8:16 PM, xosarahdesigns said:

Thank you, it worked!  I would also like to change the spacing between the title, price and description.  Would you be able to provide a custom code for that?

Adjust these space?

9 hours ago, tuanphan said:

Adjust these space?

Yes those spaces.