Jump to content

Reduce size of product titles and add cart button to header

Recommended Posts

  • Replies 6
  • Views 276
  • Created
  • Last Reply

Top Posters In This Topic

14 hours ago, GeorgeHeathcote said:

Hi,

I was hoping someone can help.

I want to change the size of the product headers to H2 here: https://www.apothecary27.com/events/p/style-01-ej5na-ae4kf 

I also would love to add a shopping cart to the header to the left of the burger menu + I coded in. 

Thanks in advance,

George

I found this code make your product header bigger than normal.

image.thumb.png.3ab56fddde7e46021aded8323820dddc.png

You can edit them or use the following custom CSS to overwrite it

@media screen and (min-width: 768px), screen and (max-width: calc(1907px)) and (orientation: landscape) {
  .product-details h1.pdp-details-title {
    font-size: 50px;
  }
}

Let me know how it works on your side

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date picker form field)
💫 Gallery block 7.1 workaround
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment

This worked perfectly! Thanks.

And how would I get the shopping cart icon in the top navigation? I custom coded desktop to have a burger menu with the + in the top right but every time I try to enable the shopping cart in the navigation it floats it to the far left. 

On 6/8/2024 at 12:28 AM, Beyondspace said:

I found this code make your product header bigger than normal.

image.thumb.png.3ab56fddde7e46021aded8323820dddc.png

You can edit them or use the following custom CSS to overwrite it

@media screen and (min-width: 768px), screen and (max-width: calc(1907px)) and (orientation: landscape) {
  .product-details h1.pdp-details-title {
    font-size: 50px;
  }
}

Let me know how it works on your side

 

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.