Hello
rating: +7+x

Name: Hello

Author: bcammobcammo
License: Creative Commons Attribution-ShareAlike 3.0 License
Tags: bmc clean hello sidebar simple texture topbar

Supports top bar menu *: yes
Supports side bar menu *: yes
* depends on tags: topbar and sidebar

Description:

Say Hello to 2011 with the most impressive, and comprehensive, free BMC theme to arrive at Wikidot yet. Complete with custom buttons, comments, quote & code blocks and hovertips, owindows and a fully customisable layout, the Hello theme will entice you to give your site a fresh new look for the new year.

The theme is a fixed width of 960px, and the sidebar can be positioned on the left, right or not shown at all.

This is the original version of the Hello theme with a light topbar. Also available:

This theme is based on a PSD template by Orman Clark of premium pixels.

How to install

  • go to: your wiki admin panel » appearance » themes
  • choose External CSS theme
  • supply the following URL as the CSS location
http://themes.wdfiles.com/local--code/hello

Code

Notes

Customise it!

You can change the way the theme appears by adding the following code snippets to either individual pages or a live template.

Left sidebar

[[module CSS]]
#page-title {margin-left: 10px;}
#side-bar {float: left;}
#main-content {
    float: right;
    border-right: none;
}
[[/module]]

No sidebar

[[module CSS]]
#side-bar {display: none;}
#main-content {
    width: 100%;
}
#page-content {width: 97%;}
[[/module]]

Custom footer

If you use a custom footer on your site, you may need to adjust the height of the footer's background. To do this, adjust the height property as shown below.

#extra-div-1 {
    position: absolute;
    display: block;
    width: 100%;
    height: 100px; /* If you use a custom footer, change this value */
    background: url(http://themes.wdfiles/local--files/hello/hello-footer-bg.gif) repeat;
    bottom: 0;
    z-index: -1;
}

Support for mobile

To ensure your site renders appropriately for mobile devices, add the following viewport meta tag to all pages on your site:

width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0

Mobile navigation

To enable a mobile-optimised navigation menu, use the following for your top-bar nav page (the nav-mobile div will only be shown in mobile browsers):

[!-- Normal nav --]

[[div class="nav-main"]]
* [[[start | Home]]]
* [# Pages]
 * [/1 Nested]
 * [/2 Nav]
 * [/3 Rocks]
* [[[about | About]]]
* [[[contact | Contact]]]
[[/div]]

[!-- Mobile nav --]

[[div class="nav-mobile"]]
* [# Menu]
 * [[[start | Home]]]
 * [[[about | About]]]
 * [[[contact | Contact]]]
[[/div]]

Browser Support

The theme has been tested in the following browsers, and appears to render properly:

  • Safari 4+
  • Firefox 3.4+
  • Chrome 8+
  • Opera 10+
  • Internet Explorer 8

Changelog

  • May 25, 2014: Mobile-optimised navigation menus (v1.2).
  • May 23, 2014: Improved support for mobile devices (v1.1).
  • January 4, 2010: First release (v1.0).

Feedback

If you've noticed a bug with the theme, or would like to give some suggestions, just head over to http://css3.wikidot.com/contact:themes - I'd love to hear from you.

Similar themes

80.jpg
installbutton.png

HavokRP Official

Author: Reverend FoxReverend Fox
Rating: 1, Comments: 1

Tags: dark easy purple sidebar simple topbar

80.jpg
installbutton.png

Yellow Metal Raw

Author: Joshua DarbyJoshua Darby
Rating: 0, Comments: 0

Tags: topbar

Browse themes by tag

Comments

Add a New Comment
Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License