Trying to integrate a "Buy Now" button with existing code but with my own button design (Paddle MoR)

Hello,

I'm trying to integrate Paddle into our website so that customers can click a buy button and the Paddle "overlay" pops up and they can pay etc. However since i'm not exactly a coding afficionado i'm not able to get it looking the way I want.

Basically, in the Paddle documentation they have a bunch of sample code I can put into a code block, this works and a clickable button shows up and  the overlay works fine. The problem is the button design as it's not consistent with the Squarespace buttons I have made and use throughout the website, and I can't figure out how to get this code to run through a button or replace the button I get in the code block with the Squarespace button.

This is the code I put into the code block to get a functional button but with the wrong design.

<a href="#!" class="paddle_button" data-product="111111">Buy Now!</a>
    <script src="https://cdn.paddle.com/paddle/paddle.js"></script>
    <script type="text/javascript">
     Paddle.Setup({ vendor: 111111 });
    </script>

Link to the documentation if anyone is curious: 

https://developer.paddle.com/classic/getting-started/e830fe7b3cdc1-add-a-paddle-button-to-your-web-page?_gl=1*bm9j6s*_ga*OTY2Nzk3MTU3LjE2OTU5ODk1MzQ.*_ga_9XVE7HZLLZ*MTY5NjYwMjY3NS41LjEuMTY5NjYwMzM2OS41Ni4wLjA.

I have made an example page where you can see the button I want to use for this and the functional paddle button.

https://www.realbiomes.com/test

Thanks!

Hi,

Make top button like this?