Loading...
 
Skip to main content

History: Theme Revamp

Source of version: 25 (current)

Copy to clipboard
            {syntax type="markdown"  editor="wysiwyg"} This is a global plan to revamp the theme infrastructure in Tiki. This is led by the ((tw:UX Team)). Please join us!

As of Tiki11, the Tiki theme infrastructure is increasingly due for a revamp to take advantage of advances in technology

- Take advantage of [http://www.smarty.net/v3_overview|Smarty 3] enhancements, especially Template Inheritance.
- ((dev:HTML5))
- CSS3
- ((Bootstrap Transition Preps))
- http://www.sitepoint.com/native-css-variables/
- http://html.adobe.com/webstandards/cssregions/
- https://en.wikipedia.org/wiki/Responsive_web_design
- http://www.cmscritic.com/why-responsive-design-is-so-important/


Thus, in Tiki 13, we are going all out on [http://www.h-online.com/open/news/item/Mobile-first-Bootstrap-3-is-almost-ready-1866134.html|"Mobile-first" Bootstrap 3.0]

[http://tiki.org/tiki-view_forum_thread.php?comments_parentId=46596|read up on the proposal, discussion and decision]

{maketoc title=""}

# When

- Any non-disruptive work should be done as soon as possible. Ex.: ((Fonts)).
- For disruptive work (ex.: CSS consolidation), ((doc:Tiki13)) after the Tiki12LTS would be a great time to revamp the whole theme management in Tiki.


The bulk of the work could be done at one or two ((tw:TikiFest Design Revamp))

# For whom

There are 3 target audiences

## I just want to pick a nice theme

Here, we need more nicer bundled themes in Tiki. Ideally, we'd have access to ((Web Template Repositories)) like https://dev.tiki.org/CSS+Frameworks+and+Preprocessors#Bootstrap_themes_repositories

For them, themes is just one of a thousand features and they just pick it. (Can be documented at doc.tiki.org)

## Point & Click themer

- Improve ((doc:Theme Generator)) or use some like https://dev.tiki.org/CSS+Frameworks+and+Preprocessors#Bootstrap_theme_generators
- Make it easier to create a menu
- Improve Module handling

## Professional designers

- They like things like Skeleton.css or http://dev.tiki.org/CSS+Frameworks+and+Preprocessors#Twitter_Bootstrap
- How to avoid to get in their way


All the action should be on themes.tiki.org

# Todo

- [http://dev.tiki.org/wish1582|Use any font in Tiki (not just web fonts) HTML5]

# To discuss

- ((dev:Why Tiki themes never look WOW))
- ((dev:CSS Frameworks and Preprocessors)) 
    - ((dev:Using Less CSS with Tiki))
- Deployment of themes: Mods or profiles? If we continue with mods, we should improve them
- [http://article.gmane.org/gmane.comp.cms.tiki.devel/21224|theme & css work], including Simplification of CSS 
    \+ One target: reduce module content specific rules with module zone specific rules (needed because a module can be placed anywhere, and different zones have different colors, etc.) 
    - Consolidation of stylesheet files
    
    - Rethink function and location of various CSS files (css directory vs. styles directory, feature-specific (admin.css) vs. global (layout.css and theme stylesheets), etc. 
         Reduce redundant rules (no need to specify *body* in three or four files, etc.)
- http://www.ohloh.net/p/assetic which can also do LESS, SASS, etc. and there is a http://github.com/widmogrod/zf2-assetic-module,
- [http://article.gmane.org/gmane.comp.cms.tiki.devel/21224]
- ((dev:CSS framework))(s) ?
- SVG Icons using Raphael
- CSS3 Buttons
- ((dev:Sprite Generator)) for small icons
- Discuss theme strategy of other CMSs to see what we can learn and improve ([http://markjaquith.wordpress.com/2010/07/17/why-wordpress-themes-are-derivative-of-wordpress/|WordPress], etc.)
- etc.

# Related topics

- ((dev:Print))
- ((dev:Mobile))
- ((dev:Accessibility))

# Related links

- http://www.slideshare.net/Webnific/cms-comparisson-3850088
- http://coding.smashingmagazine.com/2010/05/03/joomla-and-wordpress-a-matter-of-mental-models/
- http://www.majordojo.com/2011/02/how-did-wordpress-win.php
- http://mashable.com/2011/09/30/website-usability-tools/



{DIV(class=titlebar)}alias{DIV}


- (alias(Themes Revamp))