EverWeb Widgets

Hero Image

Centered Text Section

Info Link

Hero Image

The widget inserts a full with, fixed height image and adds a centered text element. This is centered both horizontally and vertically and has options for a heading, text and a CTA style internal link.
The text can use a web safe font or a non web safe or Google hosted font with a web safe fallback.
Images can be stacked or used in conjunction with suitable header/navigation and responsive container widgets to create a fully responsive page.
Image
The image should have a high aspect ratio and have sufficient quality when viewed on wide screens. The image used in the demo is 1600px wide by 600px in height. If two are more are used on the same page, the image file size should be kept as low as possible without compromising quality too much.
Text
The h1 heading has controls for font size, letter spacing, color, text shadow radius and color and font style and weight.
The info text section has controls for font size and color.
CTA Link
The link tab has controls for font size, color, hover color, background color and opacity and border width. It is configured as an internal link to another page of the site.
Spacing
There is a control for adjusting the vertical spacing between the items..
Parallax Effect
The banner has an optional parallax effect which requires checking a box and setting the "Scroll Ratio". This allows the content below to scroll over the slider at a different speed from that of the slider.
The lower the value for ratio - the slower the speed of the slide over layer.
See THIS page for how this works with a slide over transparent layer.

© EverWeb Widgets -