List

In web design, lists are most commonly created using an unordered list container with a number of list items like this …

<ul>
<li>Item [1]</li>
<li>Item [1]</li>
<li>Item [1]</li>
</ul>

Using CSS, a list can have different types of "markers". There is no such thing as "bullets" or "bullet points" which are terms used in print media.
In HTML, a "bulleted list" is an unordered list so called because the items are not in numerical or alphabetical order.

The list is created using the EverWeb widget API Assets List so it can have up to 100 items and these can be dragged around to reorder them if necessary.
In this application, the EverWeb Widget API Assets List is modified to create a list of links rather than a bunch of images. For those who are not yet familiar with this, here's how it's done …

  • Click the "Add" button and an entry will appear with "Double click to edit"
  • Select this text and then add the data in the boxes provided
  • Once the data has been entered, single click the item in the list and it will become editable
  • Enter a suitable name for the link
  • Repeat as necessary
  • The list can have any amount of items which can be reordered by dragging
  • The list style options are disc|circle|square|none|decimal|decimal-leading-zero|lower-alpha|upper-alpha
  • The list item marker can be positioned inside or outside of the list. In this example the numbers are placed outside the list
  • Both the list item inset and vertical spacing are adjustable
  • The widget can use either a web safe font or a non web safe font with web safe fallback. In the latter case, the font should be self or Google hosted
  • Text hyperlinks can be created and style with color, hover color and text decoration. See the Hyperlinks info page for how to set up hyperlinks and get them to open in a new window if required
  • The list can be made responsive by checking the Full Width box in the Metrics inspector and setting a maximum width

EverWeb Widgets