I generated the Terms Of Service page, Privacy Policy Page, and the Refund Policy Page using the default method in the by the Shopify settings, but the issue I am facing is that, once the pages are generated, all the contents are stacked inside a container, rather than using the full page width.
For clarification please refer to the picture below:
So is it possible to reduce the (1) heading size and make the contents make use of the full-screen width(2)?
Any help or links would be much appreciated.
URL: Terms of service – Abbasi (theabbasiandsons.myshopify.com)
Password: testingpage
Thank you
- You can add a custom CSS styling to make the heading size small
- Add the following to the bottom of your base.css file in the Assets folder. You can change 10px to whatever you want.
.shopify-policy__title {
font-size: 10px !important;
}
- To make the page section wider. You can adjust the max-width property in base.css file as well
.shopify-policy__container {
max-width: unset !important;
}
1 Like
@Lucid_Polygon Hi, Thank you so much for that piece, of code, it worked perfectly.
Also is there anything that can be done to the FAQ page as well? in order to expand the width of accordions to the screen width?
FAQ page URL: FAQ – Abbasi (theabbasiandsons.myshopify.com)
Hi, @justauser
You can try this code
- Go to Online Store-> Theme->Edit code
- Asset-> base.css ->paste the below code at the bottom of the file.
.collapsible-content-wrapper-narrow{
max-width: 90% !important;
}
1 Like
@Ahsan_ANC Hello, thank you so much, your code worked perfectly.
much appreciated
@justauser Please accept like and accept our answers and mark them as solved. Thanks.
1 Like
@Lucid_Polygon done. haha thanks again
1 Like