EverWeb Widgets

Full Page Media

Thes widgets insert an image, slideshow or video so that it fills the browser or device window and is responsive. They can be used to display media, create a splash page in conjunction with the overlay or be used as a background for any of the responsive widgets which have adjustable background opacity.
The header/navigation widget is designed to be used with full page media and can be positioned at the top or bottom of the browser window.
Please read the instruction page before attempting to use any of the widgets in EverWeb.
Click any widget icon to see the demo …

Widget Instructions

These widgets require certain specific layout values in the Page inspector.
Some of the individual widgets need extra instructions regarding some of the features.
Preparing the media files correctly before importing them into EverWeb is important so the general guidelines on the Instruction page should be followed.

Navigation

The navigation menu is designed to sit on top of any of the full page media widgets. It has a variable opacity background so that the media can be seen beneath it.
The optional heading can use a non web safe or Google hosted font and can be aligned left, center or right. The navigation can have up to 14 links and the last two can be external with a new window option.

Auto Slider

This is a really basic background slideshow which autoplays and has controls for setting the slide time and the transition time.
It can be used as a background for a content page which uses any of the responsive widgets which have variable background opacity.

Content Slider

This autoplay slider has a content container which has a heading and text, The container distance from the top can be set and it can be positioned left or right.
The text can use a web safe font or a non web safe or Google hosted font with a web safe fallback. The container background has variable color and opacity.

Gallery

The gallery uses separate large images and thumbnails. The thumbnail carousel appears on page load but will disappear if the visitor starts to navigate using the directional arrows and reappear when hovered.
The slides have captions which are derived from the alt text attribute and these can be positioned in relation to the top and aligned left or right.

Image

The widget inserts a full size, responsive background image which can be used in conjunction with the Media Overlay widget to create a splash page.
It can also be used as a background for any of the content widgets which have variable background color with an opacity slider.

Media Overlay

The widget covers 50% of the page with a transparent overlay. The color and opacity can be adjusted and the overlay can be positioned left/right on computers or top/bottom on tablets.
The overlay has a centered text panel which has options for a logo, heading and a CTA style link. It can be used to create a splash page using any of the full page media widgets.

Pager Slider

This full page slider has options for a pager and/or directional navigation arrows.
The pager dots can be customised for background color, size, border color and spacing. The active dot can have a contrasting color.
The slider can be set to manual play or autoplay with variable slide and transition times.

Play/Pause Slider

The images in this slider are inserted using the HTML <img> tag so the images can also have alt text for the search engines.
The slider opens in autoplay mode and the visitor can then interact using the combined previous/next and play/pause control. The controls can have their color changed and be positioned in the center top, middle or bottom.

Vegas Animated Slider

This full page slider has twenty four different transitions which can be combined with ten Ken Burns animations to create a variety of unusual effects.
The slider is autoplay with variable slide time and there is an optional timer progress bar which can be placed top or bottom. The height and color of the timer can be adjusted.

MP4 Video

The widget inserts a full page background MP4 video file with settings for mute audio, autoplay and preload.
Since video will not autoplay when the page is viewed on a tablet device, there is a play/pause button which appears when the screen width is less than 1059px. The button text can be changed for other languages. It can be styled and positioned relative to the left or right and the distance from the top can be adjusted to clear the header/navigation.

Infinite Scroll

Endless scrolling is a popular technique for displaying images since it is easy to use for both touch device users and those using a mouse or arrow keys.
Up to ten images can be inserted with optional captions. The first image displays a centered caption, CTA style hyperlink and a chevron down icon to indicated that the visitor should scroll.

© EverWeb Widgets -