Introduction
This theme was originally designed and developed by Henk Vriesslaar. The theme gets its name because it places the normal top-positioned menu bar at the bottom of the screen. Therefore the rest of the page is almost an entirely blank canvas to do whatever you want with! Traditionally this theme was always a good design for simple e-commence websites, photography portfolios or more content-heavy websites.The theme received an extensive overhaul in late 2019. Much of the older, Javascript derived source code got replaced with modern HTML and CSS. The menu bar is now animated and pops-up from the bottom. The theme also gained an entirely new choice of colour and style options. For the first time in its history, the Upside Down theme is now fully mobile responsive.
Because Upside Down makes use of some special API features in RapidWeaver, this latest incarnation of the theme is only compatible with RapidWeaver 8 and above.
Navigation
On both mobile and desktop, the menu bar pops-up from the bottom, when the hamburger icon is clicked. Only your parent page links are listed in the menu bar. Subpages can still be created within the website, but you will need to link to these manually with your own links. To ensure the hamburger icon is centred, you have Hamberger Menu Button Position settings; from where you can change the Starting At and Ending At properties. To retain an asymmetrical appearance, it is recommended your website has an equal number of parent navigation links.Main page area
This is largely a blank area with very minimal styling. Your title, slogan body content and sidebar can be easily toggled on and off in the theme style settings as required. Plenty of colour and style options are provided for all this content. The alignment can also be adjusted.Body background
Upside Down has a slightly freckled / textured background pattern applied by default. This works well to give completed pages a less flat appearance. Many dozens of different background textures are available to choose from. Alternatively you have a checkbox in the theme Miscellaneous style settings to replace the background texture with a dragged-and-dropped RapidWeaver banner image, that will be stretched to make a background image.Agile and lightweight
This theme does not include jQuery or any other Javascript libraries. Instead we use pure HTML, CSS and native Javascript for all the coding. The end result is webpages that load super-quickly.
ExtraContent enabled
This theme has 14 ExtraContent containers spread throughout the page design. Ideal for any additional content you want to display, including links and social media icons. Upside Down also includes the free variant of Font Awesome Icons, which are useful to create social networking buttons.Customising text labels
The text labels of items in the Upside Down footer are readily customisable with simple CSS code:#lastUpdated:before {
content: 'Updated: ';
}
#breadcrumb:before {
content: 'Viewing ';
}
This makes it easier to translate these text strings into different languages, for multilingual websites.Includes RWFontKit
You have over 125 web safe and embedded font faces to use in Upside Down. These can be applied to the site title, headings, content and navigation text. You also have options to change font sizing, line heights and letter spacing. What's clever about this system is that you do not need to buy additional font plugins or get stuck in writing complicated code. Upside Down includes everything you need to quickly change font styling.More
The free trial version of Upside Down can be downloaded using this link. There is no time limit imposed on the demo version, but page navigation links are disabled in the demo version. Watermarks may appear in parts of the page (like the banner or footer). Purchasing Upside Down provides you with a licensed copy of Upside Down; without any demo restrictions applied.Clicking this link will take you to a sample website published using Upside Down. This may give you a better insight into how this theme looks and behaves. If you're interested to see how the demo website was built, the same project file can be downloaded here and opened in RapidWeaver. Feel free to use this file as the basis for a new website.
If you have any other questions about Upside Down, please don't hesitate to get touch.