How to Insert a Button Element on Your Page

To get started, simply drag and drop a Button Element onto your page.

How to change the font of your Button Element

The Button Element makes use of the Google Fonts API to deliver the fonts. Simply start typing the name of a font in the font field for suggestions.

Tips to use the Button Element

  • Use Columns or the Maximum Width setting to size and position buttons, as shown in our Centering guide.
  • Enter Button text and links using the text and href fields. If linking to an outside site, be sure to include the full url of the links, including the "https://" or "http://" at the beginning.
  • Use the Default, Hover, and Active tabs to style button font and backgrounds for different button states.
  • Use tips from the Mobile Responsive and Centering tutorials to make buttons look good across all screens.

Adding a link to your Button Element

Linking your Button Element to another location on your store is an important feature of the element. There are currently two methods of adding a link to the Button Element.

You can paste your link right into the Button Element, or you can search for a page within your Shogun account to link your Button Element into,

In order to keep your buttons mobile-friendly, avoid adding any large side margins to them. Large side margins can cause elements to appear too narrow or even invisible on smaller screens.

Did this answer your question?