Thrive Knowledge Base

How to Use the Styled List and Toggle Elements

The user interface of the Thrive editor has been upgraded!
Please, check out the changes here, before proceeding.

'Styled List'

The 'Styled list' is basically a bullet point list but with more complex options. Let's see what those are:


The first option is that you can change the icons. You only have to click on 'Edit' icon and then choose one of the icons from the pop-up window. You will see that all the icons from the list will be changed to the one that you have chosen.


Next, you can change the spacing between the items of the list. All you have to do is drag the slider under the option or enter a value manually in the box next to it.

Add, remove, rearrange

Adding or deleting elements from the list is easily done as well. You can add new elements to the list by clicking on the 'Add new' button and you can remove any element by clicking on the 'x' next to it..

In case you want to rearrange the elements of your list, you'll have to hover your mouse over the dotted line next to its name and then drag & drop it to the desired position.

Note: if you wish you can customize any element of the 'Styled List' individually too. All you have to do is click on the specific element and then on the lock-unlock button. This way you won't be styling the grouped elements simultaneously anymore, but one by one.  


The 'Toggle' element is useful if you want to place compiled information on your page that you only want to be visible if the user clicks on the toggle.

In order to use this element, first drag & drop it to your page and then, click on the toggle, just like a user would. Now, you can drag any kind of element in the 'Toggle'.

'Toggle' options

This element comes with a few options of its own. You have the possibility to change the 'Hover color' (the color the toggle has if visitors hover their mouse over it) by clicking on the box and selecting another color than the default one.

You also have the option of adding new toggles, by clicking on the 'Add new toggle' button, as well as reordering them by clicking on the 'Reorder toggles' button and then, dragging & placing them to the right position.

Last, but not least, you can change the name/headline of the toggles. You just have to click on them, thus you'll access the 'Inline text', and change them to suit your purposes.

Naturally, the more general options, which are available for every Thrive Architect element, are also available for the 'Styled List' and the 'Toggle' elements.

In case you want to find out more about the general options or about how other elements in Thrive Architect work, just follow this link to access other articles and tutorials.

Hopefully, this article was useful for you. If so, please give us a smile below. :)