Jump to content

Center Align Header on Related Products Section

Go to solution Solved by tuanphan,

Recommended Posts

Does anyone know how to center the "Related Products" text and the images on the shop pages? I'm not a fan of the text aligned to the left on the header. I like the text under the images aligned to the left. I only want the header text and images to be aligned to the center. I was able to achieve something similar in the Additional Info in the product details area, but it shows the same featured products on every page. I would rather them link based on tags.  I have attached some screen shots below of how it looks and how I'd rather it look. I have blocked out the product images as I am not ready to launch the store page yet. The grey boxes I do not want as part of the style sheet. Thanks!

Screen Shot 2023-07-20 at 9.26.03 PM.png

Screen Shot 2023-07-20 at 9.25.52 PM.png

Edited by thehorn5
Link to comment
  • Replies 4
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

Please provide a link to the page on your site.

About: SQSP User for 17 yrs. Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF Digital, building Squarespace Extensions to supercharge your commerce website. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.
If my advice helped, you can thank me by clicking one of the feedback emojis below. I love coffee too.

Link to comment
  • Solution
On 7/21/2023 at 10:16 PM, thehorn5 said:

You can add this to Design > Custom CSS

/* center related products heading */
h2.ProductItem-related-label {
    text-align: center;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
25 minutes ago, tuanphan said:

You can add this to Design > Custom CSS

/* center related products heading */
h2.ProductItem-related-label {
    text-align: center;
}

 

This worked. Thank you!

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.