Buttons



Buttons settings


Setting Description
Font family

Heading: This option lets you select the font family used in headings for buttons and links text throughout the website.

Body: This option lets you select the font family used in body text for buttons and links text throughout the website.

Button font size Use the slider to adjust the font size for buttons throughout the website.
Link font size Use the slider to adjust the font size for links across the website.
Border thickness Use the slider to adjust the thickness of the button border.
Button font weight This setting allows you to choose the font weight for the text used in buttons across your website.
Link font weight Similarly, this setting enables you to choose the font weight for links across your website.
Button text transform

The “Button Text Transform” setting allows you to specify how you want the text on buttons to appear in terms of capitalization. Here are the options:

  1. Uppercase: Selecting this option will transform all text on buttons to uppercase letters. For example, if your button text is “Click Here”, it will appear as “CLICK HERE".
  2. Capitalize: Choosing this option will capitalize the first letter of each word in the button text. For instance, "click here" will be displayed as "Click Here."
  3. None: This option means that no text transformation will be applied to the button text. The text will appear exactly as it is entered.
Link text transform

The “Link Text Transform” setting allows you to specify how you want the text on hyperlinks (links) to appear in terms of capitalization. The same options as for button text:

  1. Uppercase
  2. Capitalize
  3. None
Corner radius Use the slider to adjust the corner radius of buttons.
Add icon to inline button

This field you can use for adding an SVG icon to the button. SVG icons (such as an arrow, for example) you can find in free or paid sources. A simple way to do this is to right-click on the SVG file, choose “Open with Notepad” (or any other text editor), and the file's code will be copied to the editor. Alternatively, you can use a text editor like “TextEdit” or a "Visual Studio Code editor" to read the SVG file.

In the "Visual Studio Code editor", you can drag the SVG image from your computer into the editor, copy the code, and then paste it into the "Add icon to link" field. This allows you to easily incorporate custom SVG icons into your button design.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us