Buttons can be added to any column on a page. A button can be used to link to an external website, an overlay or to another page in the publication. When the element is dragged into a column, a pop-up with link options will appear automatically.

Once you drag a Button into your Publication, click on “Click Me” and can type your text.

In this article

  • Styling a button
  • Linking a button
  • Linking a button
  • Linking a button to a PDF
  • Element settings

Styling a button

The buttons can be styled from the Theme, these settings will apply to all buttons in the publication. Styling a single button can be done in the settings of the button. You can determine the color, shape, border, shadow, and animation of a button. You can adjust the button by simply clicking on the text and typing something.

Linking a button

Hover over your Button. At the top-left corner, a pencil will appear. Click on the pencil icon.

From the Link To menu, click External URL and add your link.

Linking a button to a PDF

Linking a button to a PDF is possible by linking it to an external URL. The external URL is visible when you upload the PDF to the media library and click on the icon’s direct link. This will open the PDF in a new window and show you the CDN code in the URL bar. Use this code to link a button, hotspot or text to an external URL.

Element settings

General settings

In the general settings a link can be added or changed. A button can link to an External URL, a Page, an Overlay, a Document, or a Block. The Background color is the color of the button itself.


The Rounded corners option allows you to round the corners of the button. 

Alignment

With this option, you can change the Horizontal alignment of the content within the element itself. The content can be aligned Left, Center, or Right.

Border

The border option allows you to create a full border or a border on certain sites of your element. All sides at once is selected by default, meaning that when you increase the Border thickness, the same amount of border will appear on all sides at the same time. 

When All sides at once is deselected, the option to increase the amount of the border per side will appear. It is also possible to add more than one border. Every border will have the same color that is selected at the Border color picker. 

Spacing

Spacing can be increased to create more space between the border of the element and the content within the element. 

Shadow

You can add a shadow to most of the elements. Choose the Shadow color with the color picker. After selecting the color you can choose the Horizontal position and Vertical position. The Blur radius can be used to make the shadow less harsh and a little more faded.

Animation

The Entrance animation of the element can be selected in the drop-down menu. This animation will be shown one time when the page is opened. 

Visibility

With this option, it is possible to choose where the element is visible. This allows you to show certain elements on desktop but hide them on mobile, or the other way around. 

Related articles:

Did this answer your question?