Description:
The Flower themes are designed to be simple, attractive and flexible. Available in a range of colours, these themes are sure to suit all of your needs.
The theme is a fixed width of 960px, and the sidebar can be position on the left, right or not displayed at all, to maximise the screen real estate. It also includes customised buttons, comments and blockquotes.
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/green-flower
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; border-left: 1px solid #ccc; } [[/module]]
No sidebar
[[module CSS]] #side-bar {display: none;} #main-content { width: 100%; border: none; } #page-content { width: 97%; } [[/module]]
Browser Support
The theme has been tested in the following browsers, and appears to render properly:
- Safari 4+
- Firefox 3.4+
- Chrome 6+
- Opera 9.6+
- Internet Explorer 8
Changelog
- November 17, 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 - we'd love to hear from you.
Similar themes
|
Browse themes by tag
2.0
3d
3d-buttons
610nm
and
and/or
ardeol
articles
band
base
beige
black
blog
bloo
blue
bmc
border
boring
brown
business
camo
cat
chocholate
christian
christmas
city
clan
claret
claus
clay
clean
coffe
coke
colorful
company
contest
contest-win
corperate
corporate
corporation
creative
crimson
cross
css3
css3-buttons
curved
d14
dark
dashed
deep
|
how can i change the width of the theme? i want to to maximise the screen real estate because now i see that it doesn't cover my screen from side to side.
Im trying to have a left hand sidebar and adjust the width of the theme
As a quick answer, but not a solution…
If you'd like to alter the theme yourself, I noticed that this theme is actually based off of one the alternate colourings, "Pink Flower". Have a look at the code for Pink Flower (and use that as a template rather than Green Flower)! I'm currently looking through the code, but chances are someone will already have a response by the time I've done anything productive! ;)
EDIT: Here's an example of what happens when you alter some width values (the link is to one of my older wikis, mostly a sandbox for me now): http://xironmanx-creating-an-account.wikidot.com/ The left sidebar originally worked for me, however, once I played with the widths (mainly top bar and body), the text alignment was thrown off. I accidentally made the container too small, so now I can't change the code on site manager!
EDIT2: Here's the direct link to Pink Flower. Please look at bcammo's code for the left sidebar: http://themes.wikidot.com/pink-flower
Hope it helps!… somewhat! :)
Okay, so we'll start off by installing the theme on your site. Create a new page called admin:themes, and copy the following code into it…
Then, in your site manager, go to Appearance » Themes, select 'Or use an external theme', and in the text box put the following:
Now when you change the code on the admin:themes page, it will affect the theme on your site. If you would like to make it wider, you'll just need to adjust the width of the following:
and maybe…
If you want to make it take up the whole width of your screen, use width: 100% for the #container-wrap, and something appropriate for the others - trial and error will be your friend :)
If you need any more help feel free to ask.
Cheers,
Bryce
BMC Creative | RoaringApps | @brycecammo
Thank you Bryce! Brilliant code snippet and guide. Now hopefully I find the right tab stop to change my site's width…!