help.sitevision.se always refers to the latest version of Sitevision

Add bullet list

By clicking the Add bullet list link, you will see a new view. Here you set how the bullet list should look.

Add bulletlist

You do not set colour in the list, e.g. Blue numbered list. The list will be in that colour and that font used in the paragraph on the page where the editor adds a bullet list.

Editorial information

Name

Here you enter a descriptive name in the Name field.

Description

Enter a description here if you want.

Bullet list

Icon

Here you can choose between:

    • Bullet
    • Circle
    • Square
    • None

    Distance (CSS padding)

    Here you set the distance for the entire list.

    • Top
    • Down
    • Left
    • Right

    That is, if you set 1em distance at the top and bottom there is a distance at the top of the list.

    Margins (CSS margin)

    Here you set the margins for the entire list.

    • Top
    • Down
    • Left
    • Right

    That is, if you set 1em margin at the top and bottom there is a margin at the top of the list.

    Bullet distance (CSS padding)

    Here you set bullet distance. That is, distance between bullets

    • Top
    • Down
    • Left
    • Right

    That is, if you set 1em distance at the top and bottom there will be more space between each bullet in the list.

    Bullet margins (CSS margin)

    Here you set bullet margin. That is, the margin between bullets

    • Top
    • Down
    • Left
    • Right

    That is, if you set 1em margin at the top and bottom, there will be more space between each bullet in the list.

    CSS

    CSS class name

    Here you can see the CSS class name for the bullet list.

    Custom CSS/LESS

    Here you can enter your own CSS to specify how the list should look or behave.

    Custom CSS to specify an image as a bullet

    For example, if you want an image (an arrow) as a bullet list, enter:

    list-style-image: url("/images/<idnummer till bild>/pil.png")

    Custom bullet list

    Resultat av bild som punktlistetyp

    To get the ID number of the image: Go to the image archive -> Select current image -> The address appears on the right. Copy from/images.

    The page published:

    Did the information help you?