Hey! Want to change my layout and other CSS for my policy pages. apparently i cannot change it through store customizer. How can i apply the Color scheme to my whole store to my policy page? any idea?
Thank you in Advance!!!
Topic summary
A user wants to apply their store’s color scheme to policy pages, which cannot be customized through Shopify’s theme customizer.
Proposed Solutions:
- Custom CSS approach: Multiple responders suggest targeting policy pages using CSS classes like
.template-policyor.template-page.policy - Implementation: Add custom CSS to theme files (typically
base.cssin the Assets folder) using CSS variables likevar(--color-background)andvar(--color-text)to inherit the store’s color scheme - Alternative methods: Edit
page.policy.jsontemplate files or create a dedicated custom template for more control
Code examples provided show how to style background colors, text colors, and link colors specifically for policy pages.
One responder offered direct assistance if the user shares collaborator access and website URL. The discussion remains open with no confirmation of which solution was implemented.
Hello @SaimAnsari ,
If option is not available to customised it in the theme you are using then you have to do custom code.
Edit any existing theme css file or create a new one. Now here you can write your css by targeting poilcy page elements.
Regards
Guleria
Hi @SaimAnsari ,
The policy pages don’t always follow the theme color scheme through the customizer. But you can still fix this with a little tweak:
Custom CSS: Most policy pages include a body class like .template-policy. You can add CSS in your theme file (or custom CSS section) so these pages inherit your store’s color scheme. Example:
body.template-policy {
background-color: var(--color-background);
color: var(--color-text);
}
(Replace the variables with your theme colors if needed.)
Edit theme code: Another option is to adjust the page.policy.json or page.json template so it uses the same section/layout as your normal pages.
Custom template: If you want more control, you can create a dedicated template for policy pages and apply your store’s design directly.
The quickest way is usually adding CSS for .template-policy, so your policy pages automatically match the rest of your store.
Dear,
Dani from Samita
Hello @SaimAnsari
- From your Shopify Admin, navigate to Online Store > Themes > Edit Code
- In the Assets folder, open base.css and add your CSS code at the end
.template-page.policy {
background-color: var(--color-background);
color: var(--color-text);
}
.template-page.policy a {
color: var(--color-link);
}
Hi @SaimAnsari ,
I am from Mageplaza - Shopify solution expert.
It seems you’re having trouble applying styles to the policy page. Could you please share your collaborator code as well as your website URL with me? I’ll help you check and apply the CSS as you want.
Best regards!