How to get text in a circle on Squarespace

If you're looking to create a circular text box in Squarespace 7.1 (Fluid Engine), there are two main methods you can use. Here's a quick breakdown of both approaches, along with the pros and cons for each.

Method 1: Using a Text Block with Rounded Corners

1. Add a Text Block to your page.

2. Use the Style Background tool and apply a stroke (border).

3. Set the Corner Radius to the maximum (999) to create a circle-like effect.

4. Adjust Padding to control how the text fits within the circle.

5. Resize the box so that the width and height are equal.

6. Center the Text by aligning it both vertically and horizontally.

Pros:

• Easily reposition the circular text box.

• Simple and quick method.

Cons:

• The shape might distort on different screen sizes (may become an oval).

Method 2: Using a Shape Block with a Text Overlay

1. Add a Shape Block and set it to a circle.

2. Turn off the "stretch" option to keep the shape perfectly round.

3. Remove the Background or make it transparent.

4. Add a Stroke (border) to define the circle.

5. Insert a Text Block and position it on top of the circle.

6. Ensure the text box width matches the shape and adjust the padding.

Pros:

• The circle remains perfectly round on all screen sizes.

Cons:

• Aligning the text inside the circle can be tricky, especially in mobile view.

Method 1 is fast and flexible but may lead to shape issues on varying screen sizes. Method 2 guarantees a perfect circle but requires more manual adjustment for text alignment. Try both and see what works best for your Squarespace site!

Let me know if you give this method a try!