Image
RapidWeaver Theme

Tesla Pro

A simple, but elegant, responsive theme for RapidWeaver that provides you a clean, crisp canvas on which to build your portfolio, blog or small business site.

This page outlines the settings included in the Tesla Pro theme and talks about what they do, and how they affect the theme's display and functionality. In addition we have a tutorial and walk-thru video below that helps get you started using the theme, as well as gives you an idea what it can do before purchase. For examples of the theme in action, please visit its product page.


Tutorial Videos

We've created several tutorial videos that walk you through using the major features of the theme. These are a good resource for both before and after your purchase. Watch them now to get an idea of some of the interesting things this theme can do, and follow along with them later after your purchase to help in building your new site.

Banners

ExtraContent Areas

Social Badges

Responsive Video Embeds


What does this do?

Below we'll have a look at what each of the settings within the Tesla Pro theme can do. This page is good reference both in the event that you get stuck when building your site in RapidWeaver, as well as to get an idea of what controls and settings exist within the theme before you make your purchase.

Image

Theme Toggles

RESPONSIVE VIDEO EMBEDS
If you're going to be including video embeds from YouTube or Vimeo on your page you'll want to enable this feature. This features applies a bit of javascript code to the page which will make these embeds responsive. The video above covers this setting.

SITE TITLE & SITE SLOGAN SHADOWS
We've included two settings here to allow you to independently add or remove a drop shadow from the Site Title and / or Site Slogan for your page.

HIDE SITE TITLE BORDER
Tesla Pro has a decorative border applied to the bottom of the Site Title by default. Using this feature you can disable this border if needed.

HIDE SCROLL DOWN
Tesla's full browser window height banner has the option of including a scroll down button toward the bottom the banner. Clicking this button allows the visitor to have the window scroll to just below the banner. You can use this setting to hide that button if you don't want it available to visitors.

HIDE SCROLL UP
The Tesla Pro theme has a scroll to top button that appears at the bottom of the browser window as the visitor scrolls through the page. Clicking this button takes the visitor back to the top of the page. You can use this setting to hide that button if you'd like to omit it from the page.

ENABLE PHOTO ALBUM LIGHTBOX
Enabling this feature allows your photo album page images to open in a beautiful pop-up lightbox, further adding to the usefulness of the photo album page that comes with RapidWeaver. The video above covers this setting.

ANIMATE SCROLL DOWN
Enabling this feature will give the Scroll Down button, which is in the banner area, a nice subtle effect to sue your visitors to click it to scroll downwards.

Image

Maximum Content Width

Tesla Pro offers multiple preset widths for the main content area of the theme. This allows you to adjust the content area to your liking and needs.

Image

Banner Area

BANNER BACKGROUND
We offer several stock banners built into the Tesla Pro theme. Additionally you can use your own images to create custom banners for your page. We have a video at the upper portion of this page that walks you through doing just this.

SITE TITLE & SITE SLOGAN
The RapidWeaver Site Title & Site Slogan for this theme appears in the banner section of the page. You can customize their appearance by adjusting the font styling. We offer several preset font choices to choose from for both.

Image

Body Font

In addition to the font styling for the Site Title & Site Slogan you can also adjust the font type for the main body content of the theme here as well. Choose from one of the preset font choices for your page's content.

Image

Sidebar

The sidebar for your page can be placed on the left- or right-hand side of the page. This helps you organize your content how you like. I'd you're not in need of a sidebar you can feel free to hide it as well.

Image

Color Pickers

We've provided a great deal of customizable color pickers for the Tesla Pro theme. This allows you to personalize your RapidWeaver site as you like. Below are a list of the remaining color pickers for Tesla Pro:

  • (Site) Background
  • Content Text
  • Link Color
  • Site Title
  • Site Title Divider
  • Site Slogan
  • Scroll Down Background
  • Scroll Down Foreground
  • Scroll Up Background
  • Scroll Up Foreground
  • Social Badge Foreground
  • Social Badge Foreground - Hover
  • Social Badge Background - Hover
  • Current Page Background (Navigation)
  • Current Page Foreground (Navigation)
  • Sub Navigation Text
  • Sub Navigation Background
  • Current Page Text (Navigation)
  • Current Page Background (Navigation)
Image

Social Badge Snippets

You're able to insert social media badges onto your pages via small code snippets, which we've provided below. Be sure to watch our Social Badges video to learn how to use them.

Badge Snippets Badge Snippets
Twitter

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

Google Plus

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

Dribbble

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

Facebook

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

Instagram

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

Github

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

LinkedIn

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

Skype

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

Tumblr

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

YouTube

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

Apple

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

Windows

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

Xing

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

Email

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

Vimeo

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

Pintrest

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