UIkit for SiteOrigin Page Builder free WordPress plugin

Echelon combines the web’s best frontend framework (UIkit) with SiteOrigin’s ease of use to create premium level pages at unbelieable speeds. We have included over 30 widgets, 15 core features and a library of over 240 ready to use interface blocks, making the unparalled frontend power of UIkit available to anyone who can use SiteOrigin Page Builder. A word of caution, UIkit is highly addictive, once you start using UIkit you may find it hard to stop. UIkit for SiteOrigin Simple Modifier System What makes building premium pages with Echelon so easy is it’s simple modifier system. Echelon widgets are comprised from two parts Data and Modifiers. The Data section of a widget determines what will be displayed and the Modifiers section determines how it will look, simple right? For an example let’s take the Text widget. You enter some text into the the Data section and choose the Text Large modifier. The text is now displayed the same size as all text set as large. A simple, easy and fast system for creating pages. Decide later that all large text is to small? No problem, adjust the size in the Customiser and all the text across your site will be adjusted with a single click. Flexible Combinations While our widgets are simple enough to use individually Echelon is unique as all our widgets are designed to be combined together. Combine Loops with Sliders and Filters, Overlays with Light Boxes, Modals with Galleries, Off Canvas with Menus the possiblilites are endless, flexible and intuative. Reuse Your Content Building on the global nature of Echelon we have included a build it once and reuse it system called Echelon Layouts. They provide an area in the WordPress administration (Admin > Echelon Layouts) to store and organize layouts along with a dedicated widget (Reuse Layout) for displaying the content anywhere on your website. If you update the content in the Echelon Layout it will update in all areas you have it displayed. Highly Interactive UIkit has a large array of front end Animations and Transitions available, as such Echelon is by default a highly interactive frontend right out of the box. We didnt stop there though, alongside the baked in interactivity we have included two specific interaction features. The Animate feature will add entrance animations to any widget, row or cell, while the Hover Transition feature with add transition animations to widgets when hovered or focused. You can also trigger Transitions on widgets when using them inside the Slider widget and in loads of other places across the plugin. Better Positioning If you have ever tried to layout widgets horizontally without using columns or a tried to add a dynamic label to a widget you will know its not easy to position elements with Page Builder. UIkit has a plethora of positioning options so theres no reason Page Builder can’t use them aswell. From absolute and relative postioning to responsive flex box options Echelon can better position your widgets than ever before. Responsive Visibility Sometimes its just not possbile to have desktop layouts degrade properly and a dedicated replacement section is needed. Echelon provides a simple Visbility feature to hide widgets rows or cells from certain sized screens. Choose if an element should be displayed on mobiles, tablets, desktops or any combintion of the three. Background Images Unfortunately SiteOrigin’s background image features are lackluster and minimal, Echelon supercharges backgrounds with some key features sadly missing in the Page Builder core. Choose which image size to use for the background, position the background image, blend the background image with the background color and disable the image responsively are just some of the awesome background image features available with Echelon. Custom Color Palette You know those little color squares displayed under the various color pickers? Thats the Color Palette. Would be great if you could set those to colors of your choosing, now you do just that by going to Appearance > Customise > Echelon > Custom Palette. Theme Generation UIkit uses a lot of CSS and is highly customisable. We have built a bespoke theme compiler to allow you create and customise a custom UIkit theme from the WordPress Customiser. Simply set your options and Echelon will output a bespoke theme just for you. Recent Posts / Products SiteOrigin allows to you to build templates for loops (Recent Posts, Recent Products) and include them via PHP. Echelon takes this up a notch and provides a easy system to buld loop templates with Page Builder itself. It’s super easy too, just add an Echelon Layout and fill with Tempalte tags, WooCommerce Tags and ACF fields then feed it into the Custom Loop widget. Prime We love UIkit and SiteOrigin but we are also fond of electricty and food. Echelon Prime is our paid version and upgrades many of the widgets and features while adding some Prime specific functionality. Echelon is an unlimited product so we have two Prime plans available one for single developers and one for teams. Features List Animate: Add entrace animations to widgets rows and cells. Animated Gradient: Color changing background gradients. Attribute: Toggle Modal and Off Canvas widgets from any page element. Background: Supercharged background image options. Background RGBA: Transparent background colors. Cell Flex: Layout widgets in a cell horizontally and vertically. Custom Palette: Choose your own colors for the color picker palettes. Helper: Add handy additional CSS classes to elements. Highlight: Make a widget more prominent. Hover Transition: Trigger transition animations on hover and focus. Linked Widgets: Link entire widgets to URLs (static, dynamic and loop support). Parallax: Animate CSS properties relative to the scroll position. Position: Better positioning of page elements. Scrollspy: Toggle CSS classes when elemetns enter and leave the view port. Sticky: Keep widgets visible when the page is scrolled. Widgets List Before & After: Compare the visual difference between two images with a configurable slider. Button: A variety of buttons that take your plugin styles with an optional label. Card: Text, link and image based cards with optional transitions. Comment: Proudly display the positive feedback you have received from your customers. Custom Loop: Create loops for posts and products using Echelon Layout templates. Count Query Result: Display the number of posts found from a SiteOrigin posts query. Counter: Animated the count between two numbers with optional grouping. Description List: Header and text based alternative to standard bullet and number lists. Divider: Horizontal, vertical and icon dividers in two widths. Feature: Highlight important business information with icon and text boxes. Filter: Use tabs to filter items in a grid or masonry layout. Heading: Various heading styles for pages and sections. Icon List: Create text lists with flexible icon based bullets. Label (Prime): Small labels to stick on things and draw attention. Lightbox Gallery: Grid based lightbox galleries, using the Image Component widget. Modal: Content and video modal popups, toggled via buttons or other widgets. Navigator (Prime): Quickly move between page sections with a sidebar navigator. Off Canvas: Mobile style off canvas menus and content areas. Overlay: Overlay two sets of content with optional transitions. Pricing: Card based pricing boxes for subscribers and plans. Radial: Static and animated process radial odometers. Reuse Layout: Display the content of an Echelon Layout anywhere on your website. Slabtext: Automatically format texts in blocks with a trendy slab effect. Slider: Versatile and flexible slider to load other widgets into. Slideshow (Prime): Animated lightbox image slideshows with transitions and overlays. Smooth Scroll: Automatically scrolls all on page links smoothly. Tabs: Text and icon tabs whose content is built with Page Builder. Text: Display text with size, alignment and Google font options. Text Rotator: Rotate words to better convey your message and highlights. Twitter Feed: Display your latest tweets as a list or vertical slider. Typeriter: Typed text effect widget. Video: Inline and autoplay videos, with or without covers. Awesome you have made it to the bottom, all that’s left now is to get Echelon installed and start building premium quality pages. UIkit for SiteOrigin