Customizing Squarespace buttons on a saved page

Site URL: http://www.marleyshouseofsport.com

In my settings for my template I have all buttons for my site set to "pill" shaped. However for two buttons on just one of my pages I need them to be square with a border. Firstly how do I do this?

Secondly, in the past when I have customised something similar to this in this way I am using a block ID for that particular button to change things in the CSS code.. however in the case of client accounts where I have to duplicate a page over and over again.. making this change for every duplicate page in the CSS is the only way I've been able to make these changes. How then can I create a page with these sort of custom CSS alterations that I can then simply duplicate into another identical page? Would I need to inject that code into that particular page instead?

Any help would be very much appreciated.

- Dan

On 8/20/2021 at 12:29 PM, mhouseofsport said:

Site URL: http://www.marleyshouseofsport.com

In my settings for my template I have all buttons for my site set to "pill" shaped. However for two buttons on just one of my pages I need them to be square with a border. Firstly how do I do this?

Secondly, in the past when I have customised something similar to this in this way I am using a block ID for that particular button to change things in the CSS code.. however in the case of client accounts where I have to duplicate a page over and over again.. making this change for every duplicate page in the CSS is the only way I've been able to make these changes. How then can I create a page with these sort of custom CSS alterations that I can then simply duplicate into another identical page? Would I need to inject that code into that particular page instead?

 

Any help would be very much appreciated.

 

- Dan

You can inject code injection for individual pages by clicking the gear icon on Pages screen and choose Advanced to place the custom css, wrap your change inside

<style>

</style>