Introduction
ThemeFlood was the first company to pioneer the use of the Twitter Bootstrap framework within RapidWeaver themes. Bootstrap is by-far the most popular and successful web development frontend framework; which easily surpasses all other frameworks within the same category. Bootstrap has become the best for number of reasons; including its opensource mantra, ease of use, strength and efficiencies. We now include the Bootstrap framework in all ThemeFlood theme designs, and many theme users absolutely love it!Just about every publishing platform has at least one theme named 'Bootstrap'. As a token gesture in reflection of the strength and flexibility Bootstrap has empowered our theme designs with, the Bootstrap theme celebrates this brilliant framework and is provided on this page as a free theme for you to download and use. This Bootstrap theme is ideal to use as it is, but can be modified and extended a lot further.
Colour pickers
Within the theme style settings, you;ll find over 45 colour pickers. These let you easily customise the colour scheme of your webpages and effortless change the colouring of common elements like the navigation, header, body content and footer. By default we use the default Bootstrap 4 colour scheme, but you can change this to match your own style tastes or corporate branding.Enhanced navigation
The navigation components supplied with Bootstrap are a little flat, it's fair to say. In this theme we've opted for a toggle navigation layout on smaller screens and an animated drop-down menu on wider screens. The system of navigation implemented in this theme ties-into the navigation links that RapidWeaver generates, so you do not need to hand-code or purchase additional navigation addons. Navigation in Bootstrap is designed to help your website users effortlessly navigate quickly through your webpages. Multiple levels of navigation links are supported. If drop-down menu's are not your preferred flavour, simply toggle to either a split or block navigation layout in the theme settings; just like you can in many of our premium theme designs!Style settings
A basic array of style settings are built into the free Bootstrap theme, permitting you to customise several key aspects of page design and layout. These include options to change the navigation bar, header and footer alignment, change the sidebar positioning and toggle a couple of extra useful settings like a reduced header height, breadcrumb links and hide the logo, navigation bar, site title or site slogan.Social networking buttons
Social networking is a vital aspect in many websites. Bootstrap includes the Font Awesome icon library; instantly giving you access to over 600 quality font icons. ExtraContent 2 (in the website navigation bar) is perfect for displaying a couple of linked buttons that point to your favourite social networking hangouts. The live demo site and downloadable website file provide a prime example of these social networking icons and a clear idea of how to get them setup in your own projects.Use the Bootstrap code snippets!
You've probably already seen on this website that every RapidWeaver theme is accompanied with a FREE Bootstrap snippets pack (the link is within the sidebar of every theme product page like this one). If you have already browsed the examples on the Bootstrap website, then these snippets make it faster and easier to get many of these components into your webpages. Everything like headings, grids, tables, buttons, nav blocks, image sliders, tabs and collapsable accordions are supported. If you're a novice RapidWeaver user struggling to comprehend the synergy between code and content, then these snippets are very educational. And if you are an experienced designer wanting greater flexibility, the snippets work equally as well for building more sophisticated webpages.Customising the toggle menu button text, breadcrumb prefix and last updated prefix
These labels are easily customised with the following CSS code:#menuToggleTitle:before {
content: 'Menu';
}
#lastUpdated:before {
content: 'Last Updated: '
}
#breadcrumb:before {
content: 'Viewing';
}
This code allows you to change the text shown. Enter CSS code in your General > Code > CSS or Page Inspector > Code > CSS settings.