EverWeb Widgets

Responsive 2

These widgets are used to create fully responsive content. They can be used in combination with the Hero widgets.
Check out the Responsive Info page to find out how to set up responsive content in EverWeb.

Image Grid

The widget creates a responsive image grid with a heading, text description and an optional footer for creating a fully responsive page.
The number of images per row changes with the browser or device width. The images can have a one or two line caption.

Info Grid

The grid has images with a text description and an info link. The number of images per row changes with the browser or device width.
The widget uses jQuery to keep the grid item heights equal despite different amounts of text content. There is an optional h1 heading and descriptive text which can be placed before or after the grid.

News or Blog Grid

Each item in the grid has an image to the left and a text block to the right when viewed on computers. The items sit side by side in pairs. On tablets in portrait mode, the text slides below the image and on mobil phones, the right item slides below the left.
Each text block has date field, heading, text and a CTA style hyperlink.

Random Image Grid

The grid is used to display random sized images which are arranged in columns. The number of columns reduces with the browser or device screen width.
The images can have a centered overlay caption with adjustable background opacity. By default, each image is a hyperlink but this can be negated if required.

Product Info Grid

The grid items display an image to the left and a text block with heading, price/info, text and a CTA style link. The items are display in pairs on wider screens.
On tablet devices, the text slides over the image with a transparent overlay and the items remain in pairs.
On mobile phones, the right hand item slides below the left.

Brand Grid

Being able to accommodate up to one hundred items, the grid can be used as an illustrated navigation. Each item has an image to the left and text block to the right and are stacked one above the other.
The text block has a heading for the item name, a paragraph and a CTA style link tab.
As the browser or device width decreases, the text slides below the image.

Switch Grid

Each grid item has an image with optional info link, heading and text.. The items appear in rows of three when viewed on computers with the text below. On tablets the text switches to the right of the image and the items are arranged in a column. On smart phones, the text switches below the image again.
The jQuery matchHeight plugin is used to keep the items height equal despite varying content.

Audio MP3 Playlist Player

The player is in an HTML5 container along with text description and an image.
The audio MP3 player can accommodate up to one hundred tracks. As one track is selected the previously playing one stops. The player progresses through all the tracks and indicates the playing track with a color change and playing icon.

MP4 Video

Insert an MP4 video and a poster image into a responsive container with video title and text description for the search engines.
The container can be styled with a border and/or box shadow and has a CTA link tab and an optional footer with auto copyright update and scroll to the top functions.

Video JS

Insert an MP4 video and a poster image into a responsive container with video title and text description for the search engines using the VideoJS script for a uniform look in all browsers.
The container can be styled with a border and/or box shadow and has a CTA link tab and an optional footer with auto copyright update and scroll to the top functions.

Vimeo

Insert a Vimeo video into a responsive container with video title and text description for the search engines.
The container can be styled with a border and/or box shadow and has a CTA link tab which can be used to link to the Vimeo website.
There is an optional footer with auto copyright update and scroll to the top functions.

YouTube

Insert a YouTube video into a responsive container with video title and text description for the search engines.
The container can be styled with a border and/or box shadow and has a CTA link tab which can be used to link to the YouTube page for comments.
There is an optional footer with auto copyright update and scroll to the top functions.

© EverWeb Widgets -