How to Make Rounded Corners for ShortPoint Button

Modified on: Mon, 25 Oct, 2021 at 3:10 PM

By default, ShortPoint Button design element has square corners. It is possible to make them rounded.

Before:

After:

If you would like to apply this solution, please follow the steps in this support article.

Step 1. Insert Button Design Element

The Button Design Element can be easily added to your pages using ShortPoint Page Builder.

You can start with adding a ShortPoint web part to your page by clicking the plus sign and selecting ShortPoint from the list of the web parts.

1. Choose the Insert tab in the Ribbon.

2. Click the blue Insert button.

Then, select the Button Design Element from your ShortPoint Page Builder menu:

Step 2. Copy the code

You can use this CSS code:

.shortpoint-btn {    border-radius: 10px !important;}

NoteYou can choose your own border-radius by modifying this property.

Edit the page. Open the settings of the Row where your button is inserted by clicking the cog wheel icon:

Switch to Custom CSS tab:

Paste the code into the Custom CSS field as shown in the animation below:

Then, click Update and Save the page.

That's it. Here is an example of how it may look like on the page:

Did you find it helpful? Yes No

Visit our dedicated courses on ShortPoint Academy

Click Here!