SAVE A BUNDLE

Buy three themes and save 20% off your purchase. Use the discount code 3PACK during checkout!
Navigator theme screenshot
Navigator
Navigator

A responsive, minimal theme with beautiful styling and a unique navigation, that comes packed with a large assortment of theme variations and color pickers.

Overview

MODERN

Our Navigator theme is built on a modern, responsive foundation that provides you with a robust template for designing sites for yourself and your clients. You'll be able to create site after site, all of which will look great on your visitors' desktop computers and their mobile devices alike.

This theme makes use of some of the newest web technologies in order to provide you and your visitors with a great experience, while still allowing you to build robust, feature packed sites.

And best of all Navigator's minimal design let's your content shine.

FEATURE PACKED

RapidWeaver's Page Inspector provides a quick and elegant way for you to customize various facets of the Navigator theme with just a few clicks of the mouse. Here are a few highlights:

  • Customizable banners
  • Over 45 color pickers
  • Seven ExtraContent areas
  • Beautiful, easy to use, animated navigation
  • Responsive video embeds and photo album Lightbox
  • Social Media Badges

For a full, detailed rundown of all the the Navigator theme has to offer, click the Details tab above.

Responsive

The Navigator theme uses Foundation's tried-and-true CSS to form a solid, responsive basis to help you build better responsive sites.

Stock Banners

Navigator comes with 20 different stock banners built-in so that you can get up and running without being a professional photographer or Photoshop guru!

Custom Banners

Have an image or photograph you'd like to use as your banner? Navigator makes that easy to do through its 15 custom banner slots. Watch our banners tutorial video for more info.

Navigation

Navigator provides a slick, modern navigation setup as well as gives you the choice of 13 different animation effects for the opening and closing the the navigation pop-out.

ExtraContent

This theme comes with 7 different ExtraContent areas. Several in the main content area of the theme, as well as one that can act as a banner and one in the navigation pop-out.

Edge-to-edge

You can choose to have the content of your ExtraContent areas go edge-to-edge in the browser to create some wonderful, modern layouts for your site designs.

Logo

Your logo will appear big and bold at the top of the navigation pop-out. Just drag-and-drop it into the Site Logo well in the Site Setup and you're good to go. You can hide it on a page-by-page basis.

Title Bar

Navigator's title bar is locked to the top of the browser. This allows your visitors constant access to the navigation toggle and site title. You can choose from either translucent white or black for the background.

Animations

You can choose from a couple different animations for the site title and navigation toggle icon. The site slogan can be animated as well, and banner can be set to fade in when the page loads.

Slogan

Navigator's logo appears center on your banner image. You have a choice of several fonts for the slogan, as well as the ability to choose translucent backgrounds and a border for the slogan.

Fonts

Included in the Navigator theme is the ability to choose different fonts for the Site Title, Slogan, Headers and Body text, letting you get that custom look you need for your site design.

Width

While Navigator is a responsive, flexible theme, you can still set a max-width for your content, ranging from 700 - 1,200 px, or the full 100% width of the browser window for an edge-to-edge look.

Divider

Add a nice accent line between the banner and main content area of your site using the Banner / Content Divider. You can choose from 7 different divider weights, or none at all.

Sidebar

Navigator allows you to place the sidebar on either the right- or left-hand side of your page, or hide it altogether. Navigator's built-in sidebar is fully responsive as well.

Social Badges

Navigator comes with a set of social media badges. Just add one of the pre-built badge snippets to the sidebar and edit the link and you're good to go. Badges appear in the navigation pop-out.

Color Picker

The Navigator theme has over 45 different color pickers that allows you to quickly and easily change the look and feel of your site, on a page-by-page basis, with just a click of the mouse.

Responsive Videos

When you embed a YouTube or Vimeo video on your page, you can enable the theme's Responsive Video Embeds option, in the toggles section that will make your videos responsive.

Misc Toggles

The toggles section of the Navigator theme variations offers you the ability to add a lightbox to the photo album page, hide the logo and slogan, fade in the banner and photo album thumbnails when the page loads, and more.

Requirements

The Navigator requires RapidWeaver v6. It uses a new navigation property set provided in RapidWeaver 6 to make the theme's unique navigation really shine.

Compatibility

Due to the nature of the specialized animation effects for the navigation in this theme there are possible compatibility issues with some stacks. Watch the video to learn more.

Navigation

Navigation

Banners

Banners

ExtraContent Areas

ExtraContent Areas

Social Badges

Social Badges

Compatibility

Compatibility

Social Snippets

The Navigator theme uses a special code snippet to help you easily place your badges for various social media sites on your page. On this page you'll find a snippet for each of the badges that are supported in this theme.

Replace the # (hashtag) in the double-quotes with the URL you wish your badge to link to.

Twitter

<a class="myBadge twitter" href="#"></a>

Facebook

<a class="myBadge facebook" href="#"></a>

LinkedIn

<a class="myBadge linkedin" href="#"></a>

YouTube

<a class="myBadge youtube" href="#"></a>

Xing

<a class="myBadge xing" href="#"></a>

Stack Overflow

<a class="myBadge soverflow" href="#"></a>

Behance

<a class="myBadge behance" href="#"></a>

RSS

<a class="myBadge rss" href="#"></a>

Sound Cloud

<a class="myBadge soundcloud" href="#"></a>

Google Plus

<a class="myBadge google-plus" href="#"></a>

Instagram

<a class="myBadge instagram" href="#"></a>

Skype

<a class="myBadge skype" href="#"></a>

Apple

<a class="myBadge apple" href="#"></a>

Email

<a class="myBadge email" href="#"></a>

Pinterest

<a class="myBadge pinterest" href="#"></a>

Vine

<a class="myBadge vine" href="#"></a>

Comments

<a class="myBadge comments" href="#"></a>

Dribbble

<a class="myBadge dribbble" href="#"></a>

Github

<a class="myBadge github" href="#"></a>

Tumblr

<a class="myBadge tumblr" href="#"></a>

Windows

<a class="myBadge windows" href="#"></a>

Android

<a class="myBadge android" href="#"></a>

Dropbox

<a class="myBadge dropbox" href="#"></a>

Tumblr

<a class="myBadge tumblr" href="#"></a>

Pencil

<a class="myBadge pencil" href="#"></a>