View Cart
Previews
Overview
Pushing boundaries
With the Iconic theme we continue to push the boundaries of what RapidWeaver can do, taking things right to the edge—literally—with our brand new edge-to-edge content area feature! Iconic also has six unique ExtraContent areas, a clean polished look, built-in icon font, drop down navigation and more.
It also uses the RapidWeaver 5 Resources for adding your own background images to the ExtraContent area 1, which serves as a header area.
Make mine modern
We’ve incorporated a series of features in the Iconic theme that will benefit you and your visitors. These new features are designed for the modern browsers that your visitors are using: Safari, Chrome, FireFox and Internet Explorer 9+. The Iconic theme is IE 8 compatible.
Note: While your site will display OK in IE8, it will not live up to the high standards of other modern browsers. It will lack some of the refinements such as rounded corners, drop shadows, etc.
Theme tutorials
Here are some tutorials and walk through videos to preview Iconic’s features and show you how to use some of the amazing features found in the this theme.
I strongly encourage you to take a few minutes to watch them all, and be sure to bookmark this page so you can come back and reference them when you’re building your own sites.
Features
Header
The Iconic theme doesn’t have a traditional banner area. It makes use of the theme’s amazing ExtraContent area 1 as its header area.
This method allows for you to create amazingly powerful headers for your pages that can contain not only images, but text, carousels, buttons and so much more when making your pages with Stacks.
We’ve also included features in the theme that allow you to use your own images, as well as some beautiful built-in patterns, for the background of this great ExtraContent area 1.
Be sure to read the ExtraContent section to learn more and of course watch the ExtraContent tutorial video above to get a better understanding of how it works!
In addition to the header ExtraContent area, you can also modify the title bar space. You can change the height, the font styling and alignment of the title bar. You can also hide the title bar on a page-by-page basis. These things all affect the site title, slogan, and logo which are contained in the title bar.
You’re also able to hide individual items in the title bar on a page-by-page basis, such as the slogan and logo. The slogan is hidden by default.
Background
This theme allows you to use the RapidWeaver color picker to choose a color that best suits your site. You can also choose from several background overlays. These overlays provide depth and texture to your site background by layering textured images over top of your chosen background color.
Width
We’ve included several width options for you to choose from in the Iconic theme:
• 1,260 px
• 1,160 px
• 1,060 px
• 960 px
• 860 px
• 760 px
• 660 px (no sidebar)
• 560 px (no sidebar)
• 460 px (no sidebar)
Color picker
The Iconic theme has a vast array of choices when it comes to color pickers. Here is a list of all of them:
• Sidebar Stripe
• Site Title Font
• Site Slogan Font
• Site Slogan Divider
• ExtraContent Area 1 Background
• ExtraContent Area 2 Button Icon
• ExtraContent Area 2 Button Background
• ExtraContent Area 2 Button Hover / Selected
• Site Title Bar Background
• Background Color
• Content Text
• Sidebar Text
• Content Links
• Sidebar Links
• Sidebar Background
• Social Badges - Hover
• ExtraContent area 1 - Text
• ExtraContent area 2 - Text
• ExtraContent area 2 - Background
• ExtraContent area 3 - Text
• ExtraContent area 4 - Text
• ExtraContent area 5 - Text
• ExtraContent area 5 - Background
• ExtraContent area 5 - Links
• Blog Badge Background
• Footer Text
• Footer Links
Fonts
Included in the Iconic theme are a number of font options for your site title:
• Lucida Grande
• Museo Slab
• Museo Sans
• Georgia
• Colaborate Thin
• Colaborate Bold
• Crete
• Unna
Blog
We’ve continued our trend of making the RapidWeaver blog page feel special and have added features to help your blog posts stand out. We’ve included our Blog Entry Topper feature in the Iconic theme. If you’re new to our themes, or just new to the Blog Entry Topper, be sure to check out the Blog Entry topper tutorial video.
In addition to the Blog Entry Topper we’ve included a very special way to do Blog Badges in this theme. We’ve come up with a system to allow you to place a different badge on each individual blog entry. To do so you must simply copy and paste a snippet of code into your blog entry. For instructions on how to do this properly watch the Blog Badge tutorial video.
Below is the snippet you’ll need when making your blog badges. Copy it and paste it into your blog entry, at the bottom of the entry, as shown in the tutorial video. Once you do that, modify the icon name to reflect the icon you wish to use. The icon name is bolded below. A full list of icon names are listed at the bottom of this page in the Font Awesome icon font chart.
When pasting your code snippet in your blog entry you must do one or both of these things:
• Paste as Plain Text (Command-Alt-V)
• Highlight your snippet once pasted and apply Ignore Formatting in RapidWeaver (Option-.)
<i class="blogBadge icon-pencil"></i>
Site logo
The site logo appears in the title bar on the Iconic theme. It is to the left, or right of the site title, depending on your Site Title and Slogan Alignment choices. You can hide the site logo on a page-by-page basis.
There are no size restrictions on the image size you use for your logo, but the theme will size the image to fit within the bounds of the title bar.
ExtraContent
This theme sports 6 different ExtraContent areas that are unique and powerful. With so many wonderful ExtraContent areas we decided to build in an option in the Special section of the Styles tab that will make all of the ExtraContent areas visible as well as label them for you to give you an idea of where they’re located.
The ExtraContent areas are located below the title bar, making for a wonderful header area, in a hidden, collapsable area below the header section, in and below the side bar, and more!
Since the ExtraContent area 1 is your header area for your site we’ve provided several background styles, as well as the ability to use your own images for the background via the RapidWeaver 5 Resources section. You can also style the ExtraContent area 1 with several different overlay styles to give your ExtraContent area 1 background some real style.
With the ExtraContent area 2 being a hidden area above the content area, we’ve made it so that you can customize the icon and look and feel of the button that triggers the opening and closing of this ExtraContent area.
One of the more unique ExtraContent areas is number 6. It just has to be seen to be believed. So be sure to watch our ExtraContent tutorial video to see where they’re all located as well as to see how to use them to your advantage!
Code
Social Badges
The Iconic theme allows you to place select social networking badges in the menu bar. We’ve included several snippets in the Extras folder of the DMG file you received when you purchased your theme. You’ll install and use these to make use of the Social Networking Badges in the Iconic theme. Be sure to watch the Social Badges video tutorial to see how to install and use these badges.
The social badges included in the Iconic theme are:
• Amazon
• App Store
• Dribbble
• Facebook
• Heart / Favorite
• LinkedIN
• Picasa
• Pintrest
• RSS
• Skype
• Star / Favorite
• Steam
• Twitter
• Vimeo
• Yahoo!
• YouTube
Misc
Photo Album LightBox
Iconic has a beautiful photo LightBox built-in that provides you an alternate display method for your RapidWeaver Photo album pages. You can toggle this on and off on a page-by-page basis, and is off by default.
Breadcrumb Trail
While you can turn the breadcrumb on and off for your entire site in the RapidWeaver site setup pane, the Iconic theme allows you to remove the breadcrumb trail on a page-by-page basis.
Bullet Points
We’ve added a option to allow you to customize the look of your bulleted lists in your content area. Select one of the icon styled bullet options on a page-by-page basis:
• Checkboxes
• Arrow
• Arrow 2
• Document
• Stars
• Plain
• No Bullets
Misc
Icon Font
Need an icon somewhere on your page? No problem. We’ve included a great icon font just for this purpose. The Font Awesome font allows you to easily insert a quick snippet of code (below) that will put an icon of your choosing on the page. The snippet is below, but please be sure to watch the Font Awesome tutorial video to learn the proper way to use this incredible font.
When pasting your code snippet into your pages you must insert it as plain text, like so:
• Paste as Plain Text (Command-Alt-V)
<i class="icon-pencil"></i>
Font Awesome Icon Chart
icon-glass
icon-music
icon-search
icon-envelope
icon-heart
icon-star
icon-star-empty
icon-user
icon-film
icon-th-large
icon-th
icon-th-list
icon-ok
icon-remove
icon-zoom-in
icon-zoom-out
icon-off
icon-signal
icon-cog
icon-trash
icon-home
icon-file
icon-time
icon-road
icon-download-alt
icon-download
icon-upload
icon-inbox
icon-play-circle
icon-repeat
icon-refresh
icon-list-alt
icon-lock
icon-flag
icon-headphones
icon-volume-off
icon-volume-down
icon-volume-up
icon-qrcode
icon-barcode
icon-tag
icon-tags
icon-book
icon-bookmark
icon-print
icon-camera
icon-font
icon-bold
icon-italic
icon-text-height
icon-text-width
icon-align-left
icon-align-center
icon-align-right
icon-align-justify
icon-list
icon-indent-left
icon-indent-right
icon-facetime-video
icon-picture
icon-pencil
icon-map-marker
icon-adjust
icon-tint
icon-edit
icon-share
icon-check
icon-move
icon-step-backward
icon-fast-backward
icon-backward
icon-play
icon-pause
icon-stop
icon-forward
icon-fast-forward
icon-step-forward
icon-eject
icon-chevron-left
icon-chevron-right
icon-plus-sign
icon-minus-sign
icon-remove-sign
icon-ok-sign
icon-question-sign
icon-info-sign
icon-screenshot
icon-remove-circle
icon-ok-circle
icon-ban-circle
icon-arrow-left
icon-arrow-right
icon-arrow-up
icon-arrow-down
icon-share-alt
icon-resize-full
icon-resize-small
icon-plus
icon-minus
icon-asterisk
icon-exclamation-sign
icon-gift
icon-leaf
icon-fire
icon-eye-open
icon-eye-close
icon-warning-sign
icon-plane
icon-calendar
icon-random
icon-comment
icon-magnet
icon-chevron-up
icon-chevron-down
icon-retweet
icon-shopping-cart
icon-folder-close
icon-folder-open
icon-resize-vertical
icon-resize-horizontal
icon-bar-chart
icon-twitter-sign
icon-facebook-sign
icon-camera-retro
icon-key
icon-cogs
icon-comments
icon-thumbs-up
icon-thumbs-down
icon-star-half
icon-heart-empty
icon-signout
icon-linkedin-sign
icon-pushpin
icon-external-link
icon-signin
icon-trophy
icon-github-sign
icon-upload-alt
icon-lemon
icon-phone
icon-check-empty
icon-bookmark-empty
icon-phone-sign
icon-twitter
icon-facebook
icon-github
icon-unlock
icon-credit-card
icon-rss
icon-hdd
icon-bullhorn
icon-bell
icon-certificate
icon-hand-right
icon-hand-left
icon-hand-up
icon-hand-down
icon-circle-arrow-left
icon-circle-arrow-right
icon-circle-arrow-up
icon-circle-arrow-down
icon-globe
icon-wrench
icon-tasks
icon-filter
icon-briefcase
icon-fullscreen
icon-group
icon-link
icon-cloud
icon-beaker
icon-cut
icon-copy
icon-paper-clip
icon-save
icon-sign-blank
icon-reorder
icon-list-ul
icon-list-ol
icon-strikethrough
icon-underline
icon-table
icon-magic
icon-truck
icon-pinterest
icon-pinterest-sign
icon-google-plus-sign
icon-google-plus
icon-money
icon-caret-down
icon-caret-up
icon-caret-left
icon-caret-right
icon-columns
icon-sort
icon-sort-down
icon-sort-up
icon-envelope-alt
icon-linkedin
icon-undo
icon-legal
icon-dashboard
icon-comment-alt
icon-comments-alt
icon-bolt
icon-sitemap
icon-umbrella
icon-paste
icon-user-md
Supported browsers
Our themes support a wide variety of web browsers. We test each theme in these modern browsers to make sure that your sites will look good, and function properly. We highly suggest Safari on the Mac and PC as it is one of the most standards compliant browsers on the market today.
Safari
FireFox
Chrome
Opera 10+
IE 8+