Annoying fact: Your website's 'Home' button will usually reload your home page if clicked when you are already on the home page.The same will happen if you click on the link of any page that you are already on. Confusing, or what? Menupilator can deactivate the 'Home' link and any other link on your site to avoid confusion.
Does your client want you to add a new page to an already bursting navigation bar? You could shorten the page titles in the page settings to make room for another menu item, but this might damage SEO results. You could, however, shorten the page titles using Menupilator and leave the SEO results intact (I just altered a page title from "Wir über uns" to "About Us" with three mouse clicks).
If you need to highlight a specific menu item e.g. so that a visitor immediately sees how to contact you, Menupilator can quickly do the job. Menupilator can also trigger a lightbox instead of opening a new page. It could also trigger a dropdown that offers different language versions of your site.
Here's a list of everything the new stack can do. Menupilator comes in handy when you want to:
Damn, I recently purchased a stack specifically to alter a menu's function. If only Menupilator had been around then, it's much more flexible.
Image Sector allows you to create new, shapable background images for RapidWeaver like seldom before. And without the hassle.
SVG Scalable Vector Graphics. Images that can be incredibly tiny, but can scale up (or down) to any size without losing their crisp edges.
For some time now, we have had the possibility of adding SVG images to RapidWeaver and nowadays even MS browsers are able to display said images.
Obviously SVG is ideal for use as section masks or section dividers and 1LD resolves the problem that those little grey cells may have when trying to work out how to implement said masks.
What do we need? Image Sector and some page sections…
The simplest transitions (obviously) are those that divide a page horizontally.
Image Sector's delivers ten different shapes by default, plus the option to add your own custom shape. The latter, of course involves the use of Adobe Illustrator, Affinity Designer, or the included free shape tool. With just a few mouse clicks, you can divide your page just as you wish. The added advantage is that each of the SVG masks that you use can be used as an image frame. Your text floats over a masked image and looks incredible!
Image Sector delivers more than 30 pre-designed presets, plus over 600 icon paths. With the added advantage that you can design your own masks anything is possible!
And – if you're stuck for an SVG and the image that you have in mind is too complicated, you can also use an image (ideally a png) to mask your section. If you use the appropriate colour combination, your content may even run into and over the image and still look good.
The internet is no longer a static entity. With the abundance of information to be displayed in the confined space of a web page, it makes sense to hide some details until the user really needs it. Aside from that, moving elements can make a page more interesting. The Fluid demo page is extremely interesting with elements that move when clicked and slide into view when the page is scrolled — the page simply begs for your attention.
But Fluid isn't simply about motion, it allows you, as the demo page shows, to build complete web pages that include floating menus and most of the page content you need.
Using the Fluid Suite, you can add Buttons, Icons, Images and Text in addition to the default Fluid stack the Fluid Container, State Manager and Trigger.
The main Fluid stack supplies the JS necessary for any transitions whilst the Fluid Container will accommodate any of the other stacks. The Trigger stack defines when/how a transition should take place and the State Manager allows you to define the transition.
Just about any imaginable state is possible; from simply changing an element's colour upon hover, over opacity, rotation, zoom or positioning etc. on hover, click or page movement. There are many more transitions (z-Index, Object Size etc.) available.
So back to the 'learning curve'. After viewing the initial demo project with 11 pages of examples, I felt a little daunted. I contacted Skyler and he supplied a project with five pages that made things a whole lot more understandable!
Three things that you'll need to remember before you commit to Fluid:
Fluid is an amazing product that will allow you to build RW pages that you never imagined before.
Fluid has a fairly steep learning curve that is aided by Skyler's new demo project.
Less is more! You might want to let rip and animate everything on you newest RW pages. But don't overdo it!
Too much movement eventually distracts from your content, in addition to which the JS necessary to move all of your page elements can quickly become quite large.
Your project size might not matter to users in areas with good internet accessibility, but always remember that the JS necessary for any animation adds to the project size and your product might be viewed on a mobile phone or in other areas where every Kb costs your visitor valuable $.
Far, far away, in a land where the red Indians live, another stack has been created. This new stack, Seams, can not only add a jagged line between two sections, it can add a wave, angles or – well there's a choice of twenty-three different transitions, plus the option to add your own in SVG form. The Seams can be any colour you wish, they can also float behind content and Seams can be nested to produce some very interesting effects.
JW promises that you're going to have fun adding Seams to your pages and I can assure you that if, like me, you don't view the tutorials or consult the demo document, you're going to have hours of fun. It took me an age to work out exactly what you can do with Seams (discovering what you can't do is a lot easier).
Main Stack settings
Size and Position
Canvas Height – px
Position – Top, Float, Bottom
Add Bottom Seam – Deactivated by default
Content – Top, Float, Bottom – adds a content container to the child stack.
Child Stack settings
Varies, depending on the seam chosen. Allows you to fully customise each transition.
Check out the demo page at the Weaver's Space and get some inspiration for you next section dividers!
Multithemes LUX won't, however, allow you to switch your brain off entirely. Once you've decided on a colour scheme (25 different elements beg your attention), you then need to choose from one of fifteen headline fonts and five fonts for your content. You then have the option to include a background image for each page (tiled, or as a cover image) and then there's an option for an (actually ten different) HTML5 animation overlay, which can be used as an overlay for the background image, or for one of the optional colour backgrounds.
Remember Extra Content? ExtraContent came about when a handful of 3rd party developers got together to address the need for more content spaces in RapidWeaver.
While the content area and sidebar are ample space for the vast majority of RapidWeaver users, there are some who want more ﬂexibility to add content in ways keeping with todays modern web designs.
LUX comes with an Extra Content stack and three options for its positioning 1) Below the Header, 2) Below the page content 3) Within the Menu dropdown.
Which brings me to the navigation menu. The menu is just that: Top right is the word "Menu" with a Plus button. Clicking either opens a navigation overlay which is either just over 50% of the page width or, optionally (Nav Wide), approximately 95% of the viewport width. Extra Content 3 is positioned below the navigation bar that appears, so it's feasible to add a map of your location to the menu, along with company details.
LUX is a theme with a straightforward, very clean design that is enhanced by an unusual, but very useful navigation and some interesting animations for each page load. The animations are only displayed once on each page so they are subtle rather than overbearing. LUX has been tested and found compatible with all modern browsers. The theme can be customised with dozens of options, allowing you to create, your very own individual site.
Criticism: I only found one point: I can choose from 15 different Google fonts for my headlines, but only have five standard web fonts for the content – the standard web fonts don't always harmonise with the header fonts.
*CD = Corporate Design: The standardised design elements that are associated with a company's visual appearance.
Not to be confused with:
CI = Corporate Identity or corporate image: the manner which a corporation, firm or business presents themselves to the public internally and externally.
Links to the developers ® All trademarks cited on this page are the property of their respective owners.
Do you have a question regarding RapidWeaver?
Would you like help with your new project?
Would you like us to build your new RapidWeaver website?
Don’t miss a post!
Sign up for our monthly newsletter.
A monthly digest of all the latest updates from our RapidWeaver blog, keeping you up to date with the hottest new stacks and themes.
265 Moo 2
Mae Na Toeng Nai, Pai
Mae Hong Son
We design websites and print-products for small businesses at reasonable prices. We specialise in Responsive Web Design.
We do not harvest or sell personal information.
© rjh web design 2010—16