How to use buttons in Array

At the top of 'Lists & Sliders' the first option you will come across is 'Buttons'. You can drag and drop this option onto your page and five examples of further buttons will appear. You can also add and remove very easily. To remove any button simply float your mouse over the top right hand corner of the button you wish to remove and select the black 'x' that appears, this will remove that button. To add a button you simply click the black plus sign (+) in the bottom left hand corner. Here you may add up to six buttons in each row across the page.

5 buttons in a row

You can select a border colour, background colour and text colour on each button by selecting on one of the circle's in the top left hand corner of the button. To change the border colour select the first circle in the top left hand corner of your button, the second circle will change the background colour and the third circle will change the text colour. Once you click on one of these options a box will appear in which you can choose from a range of colours by either typing in the colour code at the top or clicking on a particular colour on the colour chart.

colour chart

You can also add an icon by selecting the circle with a triangle in it. Once selected you will be able to choose from a range of pre made icons by clicking on the 'button icon'. You also have an option to change the position of your chosen icon to be on the left or right hand side of your button. Once you press 'save' your icon will appear in your button of choice. To remove the icon you have chosen simply click on the circle with the triangle in it and select 'remove icon'.

icon box

icon list

On the bottom right hand corner of a button you will find a circular icon. By clicking on this icon you are able to switch between an 'active or inactive' state.

activeinactive state

Radio List Field

To the right of your screen in Array you will find the radio list field for buttons. Here you have more options to edit your buttons. You can add a title, make them visible & editable to everyone, admin only or hide them. You can also change your buttons shape to a circle rather than a rectangle or a symbol by selecting the drop down box next to list type. Below this you will also find an option for list direction which allows you to change your list direction from horizontal to vertical.Screenshot 2023-07-07 at 09.31.47