How to place a donate button in the center of block when a popup modal is embedded (Squarespace)

The easiest way of centering donate buttons on Squarespace is to add a custom CSS on the container (div) your popup button is placed.

As you can see, the "Donate" button is not centered on the page below, so we can center it by following the simple steps below.

Step 1

On square space click on "Design":

Then, click on "Custom CSS":

Step 2

You will see that a text editor opened, there you can write custom CSS.


To center the button, you need to find the id of the div where your button is placed, to do that you need to inspect the page. In the case of the image below, it is block-01f7feb443899486a975.

Step 3

Once knowing the div id, you can copy and paste it on your custom CSS field. Don't forget that you need to add a # before it (so the CSS can select the right div).

Step 4

Finally, write the code of your preference to center the button. In this case, it was used "text-align: center;".



Here it is the result: