Alexander Schmidt | #jd11de | http://itr.im/bjt

Template-Entwicklung

unter Joomla!

Blank Joomla Template

http://blank.vc

Features

Blank Joomla Template
  • CSS-Reset
  • Modernizr
  • PIE (Cross-Browser CSS3)
  • Compressor
  • CSS-Variablen ...

Software?

[ˈsɒf(t)wɛː]

Programme

  • Webserver mit Joomla!

  • Editor

    - Notepad++, TextWrangler
  • FTP-Client

    - WinSCP, Cyperduck
  • Browser

    - Firefox mit Firebug
Skills? PHP + JS + CSS + HTML + XML + J!-API
Start

BJT Herunterladen

und

Entpacken

wichtigste Datei

index.php

Quelltext

zweitwichtigste Datei

templateDetails.xml

  • Infos
  • Installationsdateien
  • Modulpositionen
  • Parameter

index.php erweitern

  • Cascading Style Sheet
  • Modernizr
  • Browserweiche (IE)
  • PIE (Cross-Browser CSS3)
  • Debug-Modul

Cascading Style Sheet

Cascading Style Sheet

template.css.php

Cascading Style Sheet

template.css

Cascading Style Sheet

index.php

Modernizr

Generator unter http://modernizr.com

Modernizr

Abspeichern im Ordner js

Modernizr

index.php

Script laden

Modernizr

<html class="no-js">

<html class="js canvas canvastext no-geolocation rgba hsla no-multiplebgs borderimage borderradius boxshadow opacity cssanimations no-csscolumns no-cssgradients cssreflections csstransforms csstransforms3d csstransitions video audio localstorage sessionstorage webworkers applicationcache fontface">

Browserweiche

index.php

PIE

PIE.htc

http://css3pie.com

 

 

 

PIE

Abspeichern im Ordner js

PIE

template.css

Debug-Modul

index.php

Debug-Modul

templateDetails.xml
  • pageclass
  • generator tag
  • mobile addons
index.php

pageclass

index.php

generator tag

index.php

mobile addons

index.php
index.php

Und nun?

  • Overrides
  • Sprachdateien
  • Printversion
  • Fehler- und Offline-Seite
  • Bilder und Icons
Blank Joomla Template

Overrides

Overrides

Sprachdateien

Sprachdateien

templateDetails.xml

Sprachdateien

Fehler- und Offline-Seite

Bilder und Icons

Zu guter Letzt ...

Workarround

  • Download BJT http://blank.vc
  • Entpacken und umbenennen
  • templateDetails.xml bearbeiten
    - Infos ausfüllen
    - Sprachdateien ändern
  • languages ➞ Dateinamen ändern
  • Bilder erstellen
    - template_preview.png
    - template_thumbnail.png
    - favicon.ico
  • Template-Ordner zippen

FERTIG ZUR INSTALLATION!