• Like
Blank Template für Joomla!
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

Blank Template für Joomla!

  • 3,468 views
Published

Vorstellung des Blank Template für Joomla! (http://blank.vc) mit all seinen Features und Addons.

Vorstellung des Blank Template für Joomla! (http://blank.vc) mit all seinen Features und Addons.

Published in Business , Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
3,468
On SlideShare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
17
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n

Transcript

  • 1. Blank Template für Joomla!Ein praktischer Einstieg in die Template-Entwicklung
  • 2. Download• http://blank.vc
  • 3. Features• CSS-Reset• Modernizr• Twitter Bootstrap• PIE• Compressor ...
  • 4. Voraussetzung• Joomla! (lokal oder auf Webspace)• Editor (Notepad++, TextWrangler)• FTP-Client (WinSCP, Cyperduck)• Browser (Firefox mit Firebug, Chrome)
  • 5. Skills?• PHP• HTML und CSS• JavaScript• J!-API• XML
  • 6. Anfang• Download http://blank.vc• Entpacken
  • 7. index.php
  • 8. Quelltext
  • 9. templateDetails.xml
  • 10. • Infos• Dateien• Modulpositionen• Parameter
  • 11. index.php erweitern
  • 12. • Cascading Stylesheets• Modernizr• Browserweiche• Twitter Bootstrap• PIE
  • 13. index.html<html><body bgcolor="#FFFFFF"></body></html> Is‘n Sicherheitsding.
  • 14. template.css.php• Parameterabfrage• Compressor• Dateienimplemetierung
  • 15. template.css.php Parameterabfrage
  • 16. template.css.php Compressor
  • 17. template.css.php Dateienimplemetierung
  • 18. CSS-Reset /* quick‘n‘dirty */* {margin:0; padding:0;}
  • 19. CSS-Reset reset.css
  • 20. CSS Link
  • 21. CSS Link
  • 22. ModernizrGenerator unter http://modernizr.com
  • 23. Modernizr/js/modernizr-2.6.2.js
  • 24. Modernizr
  • 25. Modernizr <html class=“no-js“><html class=" js no-flexbox canvas canvastext postmessageno-websqldatabase indexeddb hashchange historydraganddrop websockets rgba hsla multiplebgsbackgroundsize borderimage borderradius boxshadowtextshadow opacity cssanimations csscolumns cssgradientsno-cssreflections csstransforms csstransforms3dcsstransitions fontface generatedcontent video audiolocalstorage sessionstorage webworkers applicationcache">
  • 26. Browserweiche <html class=“no-js“>
  • 27. Twitter Bootstraphttp://twitter.github.com/bootstrap/
  • 28. Twitter Bootstrap
  • 29. Bootstrap Components• Button groups • Alerts• Button dropdowns • Progress bars• Tabs, pills, and lists • Modals• Navbar • Dropdowns• Labels • Tooltips• Badges • Popovers• Page headers • Accordion Thumbnails Carousel
  • 30. Bootstrap Beispiel http://itr.im/2c7
  • 31. BootstrapVoraussetzung jQuery http://jquery.com
  • 32. PIE PIE.htchttp://css3pie.com
  • 33. PIE
  • 34. JavaScripte
  • 35. template.js.php• Header• Parameterabfrage• Dateienimplementierung
  • 36. template.js.php Header
  • 37. template.js.php Parameterabfrage
  • 38. template.js.php Dateienimplementierung
  • 39. War‘s das?
  • 40. Nö!• debug module• pageclass• generator tag• mobile addons
  • 41. debug module index.php<jdoc:include type="modules" name="debug" />
  • 42. debug module templateDetails.xml<positions> <position>debug</position></positions>
  • 43. pageclass index.php
  • 44. generator tag$this->setGenerator(null);
  • 45. mobile addons
  • 46. Und jetzt?• Overrides• Sprachdateien• Druckversion• Fehler- und Offline-Seite• Bilder und Icons
  • 47. Overrides /html/
  • 48. Overrides
  • 49. Overrides
  • 50. Overrides
  • 51. Overrides
  • 52. Overrides
  • 53. Overrides
  • 54. Overrides
  • 55. Sprachdateien
  • 56. Sprachdateien
  • 57. Sprachdateien
  • 58. Sprachdateien
  • 59. Sprachdateien
  • 60. Sprachdateien
  • 61. Druckversion component.php print.css
  • 62. Fehlerseite error.php error.css
  • 63. Offline-Seite offline.php offline.css
  • 64. Bilder & Icons /images/ /psd/
  • 65. - ENDE -
  • 66. Fragen?