XXL is Waterfall enabled

Theme details

Theme name: XXL
Theme designer: Henk Vrieselaar
Current version: 5.0
Last updated: 20th May 2018
First released: 20th March 2013
Compatibility: RapidWeaver 6, 7 & 8
GDPR / DSGVO compliant: Yes
Responsive: Yes
Doctype: Valid HTML5
Font Awesome version: 5.0.13
Bootstrap version: 4.1.1
Usage agreement: Click for details
Example website: View online
Download example website: Click here

Support links

10 Minute Quickstart Guide
ThemeFlood Knowledgebase
1-to-1 Technical Support
RapidWeaver Classroom
RapidWeaver Community Forums

Free resources

Bootstrap code snippets
ExtraContent stack & snippet pack
FreeStyle banner stack
Pexels stock photography
Stockio free images & video
Unsplash stock photography

XXL updates

Updates for XXL are free for all existing users. Please see this Knowledgebase page for detailed information about obtaining and installing updates. To request an update for XXL, please click the button below (this launches your email app).
Request A Free Update

Share this page

Introduction

XXL (also sometimes referred to as extra extra large) is a stunning RapidWeaver theme, formally designed by Henk Vrieselaar. If you're looking for a highly customisable, mobile responsive theme that sports full-screen background slideshows, then look no further than XXL! This theme really is something quite special and unlike much else. For building artwork or photography portfolio websites, XXL is perfect for the job.

XXL has quite a long history. Original versions were fixed-width and non-responsive. A couple of additional 'speciality' versions became available; which had variations to the navigation layout or background content. There were various versions named things like 'XXL-2, XXL2-r', XXL2r-Flickr and suchlike. In recent times, we have merged all the best features from these different themes into one single, simple theme named XXL. This new version of XXL is easy to use, fully mobile responsive, features a simple navigation layout and includes the infamous background slideshow.

Allan Hjorth: "Most web pages we perceive in automatic zombie mode: visually, they all follow expected and habitual patterns. In other words: in the visual perceptual structure they all look alike.

XXL takes us out of the automatic perceptual patterns. Maybe, the strength of XXL is precisely this: we actually have to look at the page with "new eyes", because our "automatic mode" is interrupted. It definitely feels different."


As you can see from the live demo site, XXL really makes an impact! It's a lovely theme to work with. These completed webpages work reliably in all modern web browsers and across various devices. XXL will undoubtedly save you a huge amount of time and money; in trying to custom-build something similar with a blank theme and third-party addons. Lots of style and colour setting exist in XXL, so you can make it look like your own! Plus the theme includes a few 'pro' features, like the complete Bootstrap framework and Font Awesome Icons.

Setup with Stacks

The background slider is very easy to configure with the Stacks plugin. You simply need to download and install the free Henk's Slider stack using this link. This stack requires the Stacks plugin, version 3 or above. Stacks is not included with XXL.

Install the stack into Stacks, by dragging and dropping the stack icon onto your RapidWeaver dock icon. Launch RapidWeaver and in your project file add a new Stacks page type (if you don't already have a Stacks page in your website). Open the Stacks library and search for Henk's Slider. Drag and drop a copy of the stack into your page. Click the blue '+' button to add images to your slider.

These should be images you've added to your project as Resources or already uploaded to a directory on your web server. Simply provide the links to these images. Ideally images should be less-than 500KB each, to promote faster page loading and smoother playback. Slideshow settings can be adjusted in the theme or the slideshow stack itself.

Not using Stacks? No problem!

The demo download project for XXL includes a page called Snippets. In here, you can access the code snippet needed to configure the background slider on a non-Stacks page. This is good to use for page types like the RapidWeaver blog, styled text, Markdown, HTML code or contact form.

Displaying a Single Background Image

Just use either of the two slideshow methods above, but only include a single image in your slider. In the stack settings, you can turn-off slideshow options like navigation, captions and progress indicators. The slideshow plugin (built into the theme) will now load your single image.

Version 5 of XXL introduces a few other ways of applying a static background image:

Drag and drop banner
As the name suggests, you can drag-and-drop a suitable image into the Banner box, within the RapidWeaver page inspector. This image will get applied to the page background. The image is enlarged to fill the whole page; with the widest side being cropped to fit. An image of 2000px square is recommended, however you are welcome to deviate from these suggested sizes. To keep pages loading fast, it is recommended you keep the image size less-than 400KB. Only RapidWeaver 7 and above supports dragged and dropped images in themes.

CSS background
XXL has 15 sample images included, which you are welcome to use. To apply a background using CSS and one of the sample images, use one of these CSS code snippets in the RapidWeaver custom CSS box:

html { background-image: url(../rw_common/themes/flood/images/editable_images/1.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/2.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/3.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/4.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/5.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/6.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/7.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/8.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/9.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/10.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/11.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/12.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/13.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/14.jpg); }
html { background-image: url(../rw_common/themes/flood/images/editable_images/15.jpg); }

Any of the above code snippets can be modified to include a link to your own background image, instead of an image stored within the theme.

ExtraContent

ExtraContent allows you to add more content then RapidWeaver typically allows. There are 6 ExtraContent areas in the XXL theme:
  • EC1 is at the top of the page, great for adding your social icons, date, time or whatever
  • EC2 is just above the footer
  • ExtraContent3 is below the footer
  • ExtraContent4 is above the menu. Nice for a short message, social icons or a search box
  • ExtraContent5: don’t use this area for text, only for a banner image, slideshow or video in your content
  • ExtraContent6: at the bottom right side of the page. Great for adding a button stack, social icons or a search box. Or put the footer text here.

Sidebar

The sidebar container holds your block page navigation links and optional sidebar content. Added in XXL version 5, the sidebar can now be floated either left or right of the main content container using CSS Flexbox. Additionally you can choose to have the sidebar displayed either above or below the main content container on mobile screen sizes.

Navigation

The simple 'block' navigation links XXL uses makes for an exceptionally easy and user-friendly website for site users. In this theme, navigation links are not hidden behind buttons or only available on mouseover. A user can instantly see where they are in the website and click onto subsequent pages.

Responsive Design

The traditional fixed width design doesn't work any more. Web design needs to be adaptive. The layout needs to be automatically adjusted to fit all display resolution and devices. Rest assured, XXL is a fully responsive theme that looks and works great across a wide range of devices and modern web browsers. Using a theme like XXL, you no longer need to build multiple websites for different screen sizes.

Logo

The Logo and site title have a link with the homepage of your website. By default the logo is above the Title. Optional you can put it at the right side of the Title and Slogan. Add a logo image in the normal way, through the RapidWeaver site settings.

Font Awesome

As mentioned already, XXL includes the complete Font Awesome Icon library (the current version is shown in the theme details on this page). With Font Awesome you have over several hundred icons at your disposal, in any colour and any size you like. And they are completely free for commercial use. No extra addons or plugins need to be purchased, to use basic Font Awesome icons in XXL.

More

The free demo version of XXL 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 periodically in parts of the page (like the banner or footer). Please see this knowledgebase article for more information about the free demo versions provided. Purchasing XXL provides you with a licensed copy of XXL; without any demo restrictions applied.

Clicking this link will take you to a sample website published using XXL. 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 XXL, please don't hesitate to get touch.

* Purchases of XXL includes any applicable VAT payable. As of 1st January 2015, all EU customers are legally required to pay VAT on all digital downloads or electronic services, and receive a full VAT invoice with each purchase. We fully comply with this law and you may claim-back any tax paid (if you are VAT registered or a charity / non-profit organisation exempt from paying VAT).
Thanks! Please check the following:
System requirements
This theme requires RapidWeaver. It will not work with other platforms (like Wordpress). We recommend you aim towards installing the latest version of RapidWeaver and Stacks that your computer is compatible with.

License agreement
You may use this theme an unlimited number of times in personal or commercial projects, request technical support and receive free updates in future.

This theme can be installed or synced onto all computers that you own. You are permitted to make archival backup copies of the theme.

You may not resell or make this theme available for download, remove copyright credits or license information.

The software is provided "as is" without any implied or expressed warranty of merchantability or fitness for purpose. In no event shall the authors or copyright holders be liable for any claim, damages or other liability, whether in an action of contract, tort or otherwise arising from, out of or in connection with the software or the use or other dealings in the software.

For free themes, we are not obliged to provide technical support to customers who have not made a contribution. Additionally credits or attributes in free themes MUST remain intact, unaltered and on display at all times; unless you make a contribution and seek permission to remove them.

Refund policy
By purchasing this theme, you agree that your purchase will be available immediately via digital download and that you waive your statutory right of withdrawal.

All purchases are final and refunds will not be provided (we physically cannot un-download or remove themes from your computer).

You are reminded to make use of the free demo versions already provided on the website, to fully evaluate themes for compatibility and suitability before purchase.

Customer support
If you have questions that relate specifically to this theme, you should make contact via the contact page. For paid themes, we aim to answer all messages within 12 hours, Monday to Friday.

If you require a faster response at weekends or during public holidays, please post your question(s) to the RapidWeaver forums, where a support volunteer may be able to assist you quicker.
Like a lot of websites, ThemeFlood uses cookies and other functionality to give you the best possible experience on our website. If you continue without changing settings, we will assume that you are happy with this.