EverWeb Widgets

Responsive Grid Marketing Widgets [2]

Widgets for displaying products and services using the responsive grid layout module for better options with less code.
Click any widget icon to see the demo …

View CartAdd To Cart

Animated Hero Slider

The slider is full width, fixed height. The height for the various devices can be set and there is a checkbox to turn on viewport height for all devices if required.
Animated items are an h1 heading, a text block with a heading and a paragraph and a link. This items are all optional.

Animated Switch Slider

The slider is full width with a fixed height when viewed on computers. On mobile devices it switches to responsive width and height and them becomes viewport height on mobile phones to fill the height of the screen.
There is a checkbox to turn on viewport height for all devices if required and navigation is by directional arrows, pager dots and by swiping on touch devices.

Corner Tab Grid

Each grid item has an image with alt text which can be configured as a link to internal or external pages and open in a new window if required.
There are corner tabs and an overlay caption at the bottom. A top caption can be made visible on a per item basis to add additional info or price.

Corner Tab Gallery

This is the gallery version of the Corner Tab Grid. When a thumbnail is clicked or tapped, a larger version of the image opens in a lightbox slideshow.
The slider has image captions which are derived from the thumbnail's alt text, a slide counter and directional arrows which are replaced by swiping on touch devices.

Overlapping Images

This is a more dramatic way of providing image links to other products or services. Three images animate in and are laid out diagonally with an overlap.
The images overlap from top left to bottom right. This can be changed by applying a z-index to images [1] and [2] to bring them to the front. The center image can overlap both the top and bottom image by increasing its z-index.

Product Image Carousel

The carousel can have up to 48 images with options for captions and image links. The slides sit side by side with the info text when viewed on computers and slide above or below when viewed on mobile devices.
The slides can be navigated using the pager or grab and drag on computers. They can be swiped on touch devices. Autoplay is available when the carousel is displayed on computers.

Sale Tag Grid

Each grid item has an image with alt text which can be configured as a link to internal or external pages and open in a new window if required.
The caption and price are inline and there is a paragraph below for more info. A sale price can be indicated with a different color. When this is present, there is a checkbox to strike through the list price.

Sale Tag Gallery

This is the gallery version of the Sale Tag Grid. When a thumbnail is clicked or tapped, a larger version of the image opens in a lightbox slideshow.
The slider has image captions which are derived from the thumbnail's alt text, a slide counter and directional arrows which are replaced by swiping on touch devices.

Product Gallery

The product image gallery is positioned to the left with the thumbnails below. The description is to the right and has a heading and a paragraph for describing the product. On mobile, the text appears below the images.
Hovering a thumbnail - or clicking on touch devices - cause a larger version of the image to appear in the gallery stage.

Scale Grid

Each item in the grid has an image with a hover scale effect option when viewed on computers, a heading, text description and a CTA style link.
The image has an optional overlay caption which appears on hover when viewed on computers and on page load when viewed on touch devices.

Scale Gallery

This is the gallery version of the widget above. When a thumbnail is clicked or tapped, a larger version of the image opens in a lightbox slideshow.
The slider has image captions which are derived from the thumbnail's alt text, a slide counter and directional arrows which are replaced by swiping on touch devices.

Fade On Scroll Hero Image

The image is full width, fixed height. The height can be adjusted for the different devices and it is full height on mobile phones in portrait mode to fill the screen. There is a checkbox to set the image to Viewport Height on all devices.
The image remains fixed when viewed on computers and the content below scrolls over it as it fades.

© EverWeb Widgets -