Trusted, Bureaucrats, Administrators
12,424
edits
Changes
From Amahi Wiki
no edit summary
{{NeedsUpdate}}
= Step by Step of Making a Theme =
Creating a theme is easy . It's mostly one css file a couple of background images. That will get you going quickly. You can later add a lot more refinements to it. The simplest way to start is by forking an existing "base" theme:
* Pick a base theme to start with, say, ''agedashi-1.2''
* Copy the theme directory (if you have an HDA - if not, get the source from git):
* To change the display name of your theme to match that of the directory, edit the settings in
morning-sunshine-1.0/init.rb
* At this point the theme should be visible and selectable in <nowiki>http://hda/setup?tab=themes</nowiki>
* The most important file in the theme is the CSS file, which contains the styling for the theme. The file is located in
style.css
* The rest of the theme look is determined by the images, which are referenced by the platform code
* The theme screenshot file included in the theme should be 640x480 and is located in
theme-sshot.png
* The theme thumbnail file included in the theme should be 64x64 and is located in
theme-thumb.png
* While you are doing updates, you can shrink the screenshot to 320x240 to put it as a screenshot for the app. If you want a logo for the theme you can use this (which will be resized in the browser to 160x120) or make a logo for the theme "app".
* You can change the name of the theme and the color scheme of the piecharts in
init.rb
Optional:
* <code>ret[:headers] = ["foo.js", "bar.js"]</code> — : An array of strings,with names of javascript files to be included for this theme * <code>ret[:gruff_theme] = { ... }</code> — : Theme for the piecharts - see the examples in the other themes* <code>ret[:disable_inheritance] = true</code>: do not inherit from the 'main' theme
= Themes Sources in Git =
i.e
you can add yours there, then contribute it via a git patch. See [[Contribute]] for sending patches via git.
In your git tree,
Then access your test environment as <nowiki>http://localhost:3000</nowiki>
Within the testing tree (in amahi/platform/platform/html), you can add new themes in
each in a directory of it's own. Then you should see the new theme next time you run ./script/server (if you know how to duplicate a database, it may be bestter to run in development mode, no server restarts - see your changes live!) in this location:
To run in development mode, you can duplicate hda_production db into hda_development and simply run:
= Theme "inheritance" from the Default =
This is to make it easier to make themes. One can start with a fairly "thin" theme and enhance it over time by adding new images and improvements.
To not use inheritance from the 'main' theme, you can set disable_inheritance in yout theme with
<code>ret[:disable_inheritance] = true</code>
= Making a Theme into an App =
* Give attribution to your theme if you used any resources out there that like or require attribution
= Updating the Theme=
* Generally you should make a new version of the theme and re-upload it
* If the URL to the source changes, update it
* IMPORTANT: update the [[Developer/sha1sum|signature]] of the theme
* If you want you can update the version string. It's not used at the moment, but it will be in the future to check if there are updates
= Resources =
* Customizable Amahi dashboard tab, in [http://git.amahi.org/?p=amahi.git;a=blob_plain;f=themes/assets/amahi-base-tab.xcf;hb=c4deb554ea9a67d1dcc5ca62f346a3f91a67aef6 gimp xcf] [http://git.amahi.org/?p=amahi.git;a=blob_plain;f=themes/assets/amahi-base-tab.psd;hb=c4deb554ea9a67d1dcc5ca62f346a3f91a67aef6 photoshop psd] [http://git.amahi.org/?p=amahi.git;a=blob_plain;f=themes/assets/amahi-base-tab.txt;hb=c4deb554ea9a67d1dcc5ca62f346a3f91a67aef6 description]
* [http://www.woothemes.com/2010/08/woocons1/ Awesome GPL Icons]
* [http://kuler.adobe.com/ Kuler], or [http://www.colourlovers.com/ Colourlovers], to select theme swatches = Theme Ideas = Many templates are GPL or allow modifications, among them: * [http://spectacu.la/category/themes/ Spectacu.la GPL Themes!]* [http://mikelococo.com/projects/wucoco/ WuCoCo GPL Theme]* [http://diekretzschmars.de/wordpress/themes/dkret-theme/ DKRet GPL Theme]* [http://www.wpdesigner.com/2007/06/07/pride-wordpress-theme/ Pride GPL Theme]* [http://www.styleshout.com/ StyleShout free themes]
= Making a Theme in Less Time =
= Tips =
* Set the background-color of the application icons on the dashboard to white. This will make the icons all consistent: .welcome-logo {background-color: #fff;} .welcome-logo-small {background-color: #fff;}
