Styling a list in Freeway Pro

Publishing date: 17-12-2011

In HTML and and for that reason also in Freeway Pro a list item is something treated in a special way. If you do not style a list item, it will be generated and displayed in the standard (in my opinion ugly) way. For that reason, you can style a list, so it will match the appearance of your website.

This article shows you how you can style your lists in Freeway Pro.

Here is the standard way your list will be shown if you do not style it. As you can see this does not match the style of my website because it uses the Times New Roman font.

Line 1
Line 2
- Line 3
- Line 4

This website is using the Helvetica font and I would like my list to also use that font.

line 1
line 2
- line 3
- line 4

There are different ways you can style your lists in Freeway Pro. One will affect every list in your website project at once and the other one can be use on one page or even applied in different styles to different blocks with list items in one HTML item.

This one will change every list in your Freeway Pro project

Go to your Style Palet
Click on the wheel icon
Choose Adjust Styles
Make a new style by clicking on the plus in the lower left corner
In the Tag field type li
Choose the way you want to style your list
Click Ok and every list item in your website project will change at once

Style01

This one can be applied to a list item on a single page

Go to your Style Palet
Click on the wheel icon
Choose Adjust Styles
Make a new style by clicking on the plus in the lower left corner
Type nothing in the Tag field
Type an name in the Name field (for example list)
Choose the way you want to style your list
Click Ok
Select the indented list item you want to style and click on the .list in the Style Palet

Style02

EXTRA TIP!

Standard your indented list will get a filled bullet and your nested list (list within a list) will get an open bullet. You can even go further, and for example if you go two levels deep you will get a square filled bullet. Click here to see an axample of a list with more nested levels.

In this page you do not see bullets, but a small arrow. To achieve this, you need a Freeway Pro action called List Item Images that you can download here: http://www.freewayactions.com/product.php?id=010

>> Click here to go back to the homepage