Template overrides - Joomladagen 2010 #jd10nl

24
De kracht en schoonheid van template overrides Sander Potjer Sander Potjer Webdesign twi$er: @sanderpotjer web: www.sanderpotjer.nl

description

De kracht en schoonheid van template overrides, gegeven tijdens de Joomladagen 2010

Transcript of Template overrides - Joomladagen 2010 #jd10nl

Page 1: Template overrides - Joomladagen 2010 #jd10nl

De  kracht  en  schoonheid  van  template  overrides

Sander  Potjer

Sander  Potjer  Webdesigntwi$er:  @sanderpotjerweb:  www.sanderpotjer.nl

Page 2: Template overrides - Joomladagen 2010 #jd10nl
Page 3: Template overrides - Joomladagen 2010 #jd10nl

Wat  zijn  Joomla!  template  overrides?

Joomla!  template  overrides  zijn  een  krach=ge  mogelijkheid  om  de  standaard  Joomla!  output  naar  eigen  wens  aan  te  passen.

“Plas<sche  chirurgie  voor  Joomla!”

Page 4: Template overrides - Joomladagen 2010 #jd10nl

Beez  als  voorbeeldBeez  zonder  overrides Beez  met  overrides

Page 5: Template overrides - Joomladagen 2010 #jd10nl

Waarom  gebruiken?

•  Niet  tevreden  met  standaard  output  van  Joomla  &  extensies

•  Tabellen  in  de  template  zijn  not  done!  (ja,  ook  in  J!  1.5...)

•  Output  beïnvloeden  zonder  core  bestanden  aan  te  passen...

•  ...  en  die  aanpassingen  te  verliezen  bij  upgraden

•  Eigen  func<onaliteiten  toevoegen

Page 6: Template overrides - Joomladagen 2010 #jd10nl

Wanneer  te  gebruiken?

•  Bij  MVC  component•  Bij  MVC  module

•  MVC  staat  voor‣  M  =  Model  (bevat  de  applica<e  logica)  ‣  V  =  View  (bevat  de  logica  om  een  pagina  op  te  bouwen)‣  C  =  Controller  (schakel  tussen  het  Model  en  de  View)

•  Wij  bevinden  ons  in  het  ‘view’  gedeelte  van  het  MVC  model

Page 7: Template overrides - Joomladagen 2010 #jd10nl

View  nader  bekeken

•  Meeste  componenten  hebben  meerdere  views    bijv  com_content‣  Archief  ‣  Ar<kel‣  Categorie‣  Voorpagina‣  Sec<e

•  Componenten  en  modules  tonen  informa<e  via  een  “view”

•  Module  kent  meestal  een  view

Page 8: Template overrides - Joomladagen 2010 #jd10nl

View  nader  bekeken

Een  “view”  van  een  component  kan  meerdere  “templates”  beva$en,  bijv  view  categorie  van  com_content

‣  blog_item.php  (item  van  blogweergave)‣  blog_links.php  (lijst  met  links  onder  blogweergave)‣  blog.php  (blogweergave  van  items)‣  blog.xml‣  default_items.php  (item  van  lijst)‣  default.php  (lijst  van  items)‣  default.xml

Page 9: Template overrides - Joomladagen 2010 #jd10nl

Hoe  maak  je  een  override  (in  beeld)?

Page 10: Template overrides - Joomladagen 2010 #jd10nl

Hoe  maak  je  een  override  (in  tekst)?

Maak  van  template  blog_item.php  in  de  sec<on  view  een  override:

origineel

components/com_content/views/sec<on/tmpl/blog_item.php

kopiëren  naar

templates/<naam>/html/com_content/sec<on/blog_item.php

Page 11: Template overrides - Joomladagen 2010 #jd10nl

En  hoe  voor  een  module?

Maak  van  mod_newsflash  voor  de  default  view  een  override:

origineel

modules/mod_newsflash/tmpl/default.php

kopiëren  naar

templates/<naam>/html/mod_newsflash/default.php

Page 12: Template overrides - Joomladagen 2010 #jd10nl

Wanneer  gebruikt  Joomla!  de  overrides?

if  (  com_<naam>  map  bestaat  in  templates/<naam>/html  ){

gebruik  de  override  bestanden  voor  de  output}

else  

{gebruik  de  standaard  view  bestanden  van  extensie

}

Page 13: Template overrides - Joomladagen 2010 #jd10nl

Genoeg  theorie,  nu  de  prak=jk!

Page 14: Template overrides - Joomladagen 2010 #jd10nl

Joomla!  output  verlossen  van  tabellen

Een  goede  standaard  override  set  is  van  Yootheme,  gra<s  te  downloaden  op:  h$p://bit.ly/overrides  

Page 15: Template overrides - Joomladagen 2010 #jd10nl

BuHons  verplaatsen  van  item  in  categorie  blogtemplates/<naam>/html/com_content/category/blog_item.php

Page 16: Template overrides - Joomladagen 2010 #jd10nl

www.louisvangaal.nl  zonder  en  met  overrides

Page 17: Template overrides - Joomladagen 2010 #jd10nl

in  de  override:

Tonen  van  icoon  voor  elke  categorie

in  het  css  bestand:

Page 18: Template overrides - Joomladagen 2010 #jd10nl

Override  van  de  pagina=eBroncode  normaal Broncode  met  override

Met  hulp  van  override  bestand  pagina<on.php  in  de  html  map

Page 19: Template overrides - Joomladagen 2010 #jd10nl

Gebruik  van  “pagina  class  achtervoegsel”Opgeven  van  class  achtervoegsel  in  menuitem Achtervoegsel  oproepen  in  template

Stylen  met  CSS

Voordeel:  maar  één  template  nodig  ipv  10!  

Page 20: Template overrides - Joomladagen 2010 #jd10nl

Gebruik  van  PHP  voor  inkorten  introteksttemplates/<naam>/html/com_content/category/blog_item.php

Page 21: Template overrides - Joomladagen 2010 #jd10nl

Gebruik  van  PHP  voor  eenmalig  tonen  datumtemplates/<naam>/html/com_content/sec<on/blog_item.php

Page 22: Template overrides - Joomladagen 2010 #jd10nl

Wees  crea=ef,  ga  los  met  overrides!

Page 23: Template overrides - Joomladagen 2010 #jd10nl

Vergeet  niet...

•  Updates  in  de  gaten  houden  voor  zowel  extensies  als  core!

•  Veiligheidsverbeteringen  door  te  voeren  in  overrides

Page 24: Template overrides - Joomladagen 2010 #jd10nl

Handige  links  voor  meer  info

h$p://www.joomlacommunity.eu/nieuws/joomla-­‐algemeen/381-­‐tutorial-­‐maak-­‐je-­‐eigen-­‐joomla-­‐template-­‐overrides.html

h$p://www.yootheme.com/member-­‐area/downloads/item/templates-­‐15/template-­‐overrides-­‐15

h$p://docs.joomla.org/MVC

h$p://docs.joomla.org/Understanding_Output_Overrides

h$p://docs.joomla.org/Category:Templates

h$p://docs.joomla.org/Category:Overrides

h$p://docs.joomla.org/How_to_override_the_output_from_the_Joomla!_core

h$p://www.theartohoomla.com/topics/layout-­‐overrides.html