Slide In Nav
Slide in left or right vertical navigation with transparent background and vertically centered animated links.
Slide In Navigation Menu
The navigation slides in fromthe left or right on clicking the "hamburger" icon. The navigation is visible during setup and then hidden by checking a box. The background has an opacity slider so that the page content is partially visible behind it if required.
Icon
The "hamburger" icon can be styled for background color and its opacity, icon color, icon hover color and border radius. It can be positioned left or right and its location adjusted using the values for Position X and Position Y in the widget settings.
The close button has controls for color and hover color.
Links
The links are spaced out vertically and can have a hover scale animation when viewed on computers. The amount of scale is adjusted using a slider.
The links can use a web safe font or a non web safe or Google hosted font with a web safe fallback. There are controls for setting the font size, mobile font size, color and hover color.
Fix
The navigation overlay and the "hamburger" icon are absolutely positioned by default. They can be fixed by checking a box so that they always remain in view no matter what the scroll position of the page content is.
Animations
The slide up/down animation can be set in milliseconds. The navigation link hover animation as created using scale on hover. The scale amount can be adjusted in the widget settings. This animation is turned off on mobile devices for obvious reasons!
Setup
The widget should be the last item on the page and be placed below the footer where it won't effect the page content items.
Animated Hero Image
The first item on the page is created using the RGL Marketing Pan Hero with animation turned on. Follow the link below for more info…
Three Column Footer
The footer has 3 side by side columns when viewed on wider screens. These rearrange themselves as the browser/device screen width is reduced. There is a maximum width setting and a checkbox which should be checked if the various icons are required to be shown.
Left Column
This column has a heading and a text block. The text block can have several lines of text and there are controls for aligning the text for computer and mobile.
If the "Show Icons" box has been checked, a phone number can be added at the bottom. This changes to a "Call Me" phone icon when the page is viewed on smart phones.
Center Column
This column has an optional heading and a text block which has controls for setting different text align on computer and mobile.
If the "Show Icons" box has been checked, an email icon can be inserted at the bottom.
Email Spam Protection
The email link has fields for the title, recipient email address and the email subject. The email address is entered in three boxes for name, domain and domain extension. The @ and the dot are removed to be replaced using javascript. This prevents spammers from harvesting the email addres using scraping software.
Right Column
This has an optional heading and block links. The links can be configured to open internal or external pages and in a new window if required.
Scroll Top
If the "Show Icons" box has been checked, a scroll top icon can be inserted at the bottom. This function has a field for entering a title and a control for setting the scroll time in milliseconds.
© Notice
An optiona; copyright notice can be added below the columns. This has a text field and a checkbox for adding the copyright year with auto update.