Skinning MindTouch Deki

Click here to load reader

  • date post

    08-May-2015
  • Category

    Technology

  • view

    4.147
  • download

    0

Embed Size (px)

description

Learn how to skin MindTouch Deki quickly and efficiently

Transcript of Skinning MindTouch Deki

  • 1.Skinning MindTouch Deki Presented By Damien Howley

2. Overview

  • Introduction
  • Resources
  • What is skinning?
  • Audience experience
  • Templates vs. Skins
  • CSS modifications
    • File system architecture
    • CSS variables
  • Questions

3. Introduction

  • Damien Howley
    • title: Graphic Designer / Evangelist
    • email: [email_address]
    • twitter: @DamienH
    • contribution: Created Fiesta Skin

4. Resources

  • Wiki Documentation
    • http://wiki.developer.mindtouch.com
    • http://wiki.developer.mindtouch.com/MindTouch_Deki/Skinning
  • Fiesta
    • http://wiki.developer.mindtouch.com/MindTouch_Deki/Skinning/Fiesta
  • Forums
    • http://forums.developer.mindtouch.com/
  • MindTouch
    • http://www.mindtouch.com
    • http://www.mindtouch.com/blog

5. What is skinning?

  • Skinning is the process of creating or modifying the look & feed of your Deki.
    • HTML markup
    • CSS styles

6. Audience experience

  • Who has tried to skin MindTouch Deki?
    • why/why not?
    • successes / frustrations?
    • why do you want to skin MindTouch Deki?

7. Templates vs Skins

  • Template(php, html)

Skins(CSS) ace base fiesta Mindtouch, blue, neutral wireframe pro, caesious Sunset, wireframe, grazing-green, smokey-ocean, summer-city, Mindtouch, sunflower-rainbow, christmas-blizzard, charcoal-forest, sunrise-fog, sky-tangerine, rustic-azure, maroon-flash, cobalt-marine 8. Template vs Skins Ace Fiesta 9. Templates vs Skins

  • Other Templates
    • Deki CMS
    • Deuce(Kilen Woods)

10. CSS modifications

  • How do I change the CSS?
    • Control Panel
    • File system

11. CSS modifications

  • Using the control panel to modify the CSS
    • DekiControl Panel Visual Appearance

12. CSS modifications

  • Using the file system to modify the CSS
    • File System192.168.xxx.xxxdrivevarwwwdeki-xxxskins

13. CSS modifications

  • Using the file system to modify the CSS
    • File System192.168.xxx.xxxdrivevarwwwdeki-xxxskinsfiesta
  • _common.css
  • _style.css
  • Fiesta.php

14. CSS modifications

  • Using the file system to modify the CSS
    • File System192.168.xxx.xxxdrivevarwwwdeki-xxxskinsfiestagrazing-green
  • _content.css
  • css.php
  • style.css

15. CSS modifications

  • CSS variables(PHP in CSS)
    • File System192.168.xxx.xxxdrivevarwwwdeki-xxxskinsfiestagrazing-greenstyle.css
    • Proposed Spec for CSS 3

16. CSS hierarchy

  • Template
    • Template Styles (_common.css)
    • Skin
      • Consolidated style css (_style.css)
      • Unique style css (/style.css)
        • Control paneloverride template styles
      • Unique content css (/content.css)
        • Control paneloverride content styles

17. Recap

  • What is skinning?
  • Resources
  • Templates vs. Skins
  • CSS modifications
    • File system architecture
    • CSS variables

18. Questions

  • Does anyone have any questions?
    • things that are unclear?
    • barriers to skinning?

19. Contact Me

  • Damien Howley
    • title: Graphic Designer / Evangelist
    • email: [email_address]
    • twitter: @DamienH