Text & List Widget

This text area is an HTML5 <article> element with an h1 heading, a paragraph and an optional CTA style link.
The link can be configured to open internal or external pages and in a new window if required.
The right hand item has a heading, an intro paragraph and a list.
The list can have up to 48 items and the available styles are disc, circle, square, none, decimal, decimal-leading-zero, lower-alpha and upper-alpha.
The list position can be inside or outside and there are controls for adjusting the inset and vertcial spacing.
Since this is a grid layout, the columns can be set to align vertically using auto, start, center and end.
When the device screen width is less than the break point, the list will position itself below the the text block.

FAQ

Amsterdam Weekend Break

Creating a list …

Click the "Add" button and select the entry in the list

Enter the list item text

Click the entry in the list again and it will become editable

Enter a name or number for the list item to make it easy to identify

List items can be reordered by dragging them up or down

Set the font size, vertical spacing and list style type

Set the list item inset from the left

Try both inside and outside positions to see the difference between them

When the text content and list are unequal in height, try the different settings for "Align Content" to see the options in action

Scroll To The Top

The last item inserted on this page is a smooth scroll to the top button which sticks to the bottom of the browser or device window. It can be positioned left or right and its distance set in relation to the browser/device window edge and bottom.
There are controls for setting the icon color, hover color, background color and its opacity and the background hover opacity. The hover delay animation and the scroll to the top time are set in milliseconds.

Responsive Grid Footer

On wider screens, the footer has three columns. The first item in the left column is the option for a phone number that switches to a "Call Me" button on phones. Several links can be added below it and these can open internal or external pages and in a new window if required.
The middle column has centered text and a checkbox to add the copyright year which will be automatically updated.
In the right column, the email icon sits below the smooth scroll to the top chevron.
The email address is added in three parts - name, domain name and domain extension . The @ and the period are added using Javascript to stop the email address being collected by spammers using scraping software.
If viewing this page on a computer, reduce the browser width to see how the items rearrange themselves at different screen/device widths.

EverWeb Widgets

Text & List Widget

Amsterdam Weekend Break

Scroll To The Top

Responsive Grid Footer