Sphere Theme
Naturally Infected
The main idea of the sphere theme is based on observations of the colors in nature: the transitions from light to dark and vice versa aren't based on just adding white or black colors. The colors mostly have some yellow parts in it when going to white and blue when going to black. This effect has been noted quiet early in chromatics (e.g. divition of the color wheel in bright/dark and warm/cold). My idea was to implement this in Sphere.
Additionally to that basis the sphere theme implements
many new features which work for you in the background.
Two of them are worth mentioning here: the navigation and
tooltips.
As the menu is not static but animated I can't fully
describe the effect here. Just try it out. When you hover
the navbar with the mouse the menu is softly expanded
downward, overlaying the header image in a
semi-transparent layer. The whole menu is built as a site
map, so your visitors are able to directly go to any part
of your site. Also every menu entry softly changes from
the inactive to the active state.
The tooltips is another great feature of the sphere
theme. When you hover a link in the main content, a
tooltip will pop up showing the link target (URL) and a
small description in a semitransparent layer.
Features Overview
- Add your own custom header images (up to 10)
- Add your own custom footer images (up to 10)
- Custom Colors available for many parts of the layout (body, footer, navbar, content, ...)
- The coolest menu ever implemented for RapidWeaver
- Tooltips
- Greybox included
- 6 Font Families
- 3 Sidebar positions: left/right/hide
- 4 different content widths
- 5 body background overlays
- Bottom Fades for a great effect
- Many navbar item widths
- Automatic Image Resizing
The features in detail
Custom Header and Footer Images
You can choose up to 10 different header images in JPG Format and 10 footer images in PNG format. You will also receive ten images to start with. Here are the header images:
Tooltips
The main purpose of tooltips is to give your visitors some clues about where they will be directed if they click on a link on the page. The tooltips implemented in the sphere theme are placed in a semitransparent layer which will be shown whenever you hover a link in the main content with the mouse. They also follows the mouse pointer.
A beatiful menu style
Well, the best thing to describe it is to let you see it. Please have also a look at the Sphere Preview Site
Greybox included
Ever wanted to have a cool AJAX effect on your site but it was too difficult to make it work? With the Sphere theme it is really easy as the greybox project is preinstalled! You probably already have seen the greybox in action. It is used widely on this site to show you the images in full screen mode. The greybox system is similar to the lightbox one, except you not only are able to open images in a translucent layer but whole websites. So you can show additional information to the user without opening a new window or redirecting him to another site - and this means: he will stay longer on your site!
As you view this content you already have seen how greybox works, as this whole page is displayed in a greybox layer. Other examples can be found on this site when choosing to view the online examples or even by adding a theme in the shopping cart.
If you want to find more information about greybox or like to see more examples, you can visit the project's homepage at http://www.orangoo.com/labs/GreyBox/
Automatic Image Resizing
This really cool feature is implemented in most modern browsers: When the browser window is resized the image in your content is also resized. So your visitors will not get too small or big images on their screen. They will fit perfectly no matter which screen size they have.
Font Families
In the Sphere theme you can choose between 6 different font families:
Where to put the sidebar?
Do you need a sidebar? Where should it be placed? Just one click and the sidebar will be repositioned to the left or right side - or you can also choose to have no sidebar at all.
Easy manage your own custom header footer images with the SIA utility
Included with the theme you will find a nice little utility to easily manage your own custom header and footer images. Just choose the images you want to be displayed in the header and click on Place. The Sphere Image Admin Utility will do the rest.
Free Online Support and Updates
If something should not work well, you can get free online support from me. You can contact me and I will give you help making the best out of this template. I will probably also make some changes to the design itself, all for free.
Limitations
Following are some know limitations of the sphere theme:
- 3rd Party Plugins
- I have tested the theme with many third-party
plugins available. Most of them work without any
problem. In the newest version, also the important
plug-ins of yourhead will work (payloom, carousel,
accordion). Be sure to update your plugins for the
plugin compatibility. Other plugins may break the
sphere effects and tooltips. This not only is ugly but
also it leads to not display the submenu entries. But
there is a fix and it is included with the theme.
There also seems to be a problem with the simple viewer plugin as it renders in the forground and will be placed over the footer until you scroll.
And last but not least: if you use the payloom plugin, the payloom preview simply won't work. - Background Overlay not fixed in IE6/Win
- The chosen background overlay does not work properly with IE6/Win. The background color will also scroll with the content.
- Limitation in submenu entries
- Only up to 7 submenu entries are supported. Without hard coding the theme files it is not possible to overcome this restriction. If you are interested to change the code, contact me and I will give you some hints.