際際滷

際際滷Share a Scribd company logo
De	
 kracht	
 en	
 schoonheid	
 van	
 template	
 overrides

                                 Sander	
 Potjer



 Sander	
 Potjer	
 Webdesign
 twi$er:	
 @sanderpotjer
 web:	
 www.sanderpotjer.nl
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!
Beez	
 als	
 voorbeeld
Beez	
 zonder	
 overrides                Beez	
 met	
 overrides
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
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
View	
 nader	
 bekeken
	
 Componenten	
 en	
 modules	
 tonen	
 informa<e	
 via	
 een	
 view
	
 Module	
 kent	
 meestal	
 een	
 view
	
 Meeste	
 componenten	
 hebben	
 meerdere	
 views
   	
 	
 bijv	
 com_content
           	
 Archief	
 
           	
 Ar<kel
           	
 Categorie
           	
 Voorpagina
           	
 Sec<e
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
Hoe	
 maak	
 je	
 een	
 override	
 (in	
 beeld)?
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
En	
 hoe	
 voor	
 een	
 module?
Maak	
 van	
 mod_news鍖ash	
 voor	
 de	
 default	
 view	
 een	
 override:

                                   origineel

modules/mod_news鍖ash/tmpl/default.php

                                kopi谷ren	
 naar

templates/<naam>/html/mod_news鍖ash/default.php
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
}
Genoeg	
 theorie,	
 nu	
 de	
 prak=jk!
Joomla!	
 output	
 verlossen	
 van	
 tabellen
Een	
 goede	
 standaard	
 override	
 set	
 is	
 van	
 Yootheme,	
 gra<s	
 te	
 
downloaden	
 op:	
 h$p://bit.ly/overrides
BuHons	
 verplaatsen	
 van	
 item	
 in	
 categorie	
 blog
templates/<naam>/html/com_content/category/blog_item.php
www.louisvangaal.nl	
 zonder	
 en	
 met	
 overrides
Tonen	
 van	
 icoon	
 voor	
 elke	
 categorie

in	
 de	
 override:


in	
 het	
 css	
 bestand:
Override	
 van	
 de	
 pagina=e
Broncode	
 normaal                                                            Broncode	
 met	
 override




Met	
 hulp	
 van	
 override	
 bestand	
 pagina<on.php	
 in	
 de	
 html	
 map
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!
Gebruik	
 van	
 PHP	
 voor	
 inkorten	
 introtekst
templates/<naam>/html/com_content/category/blog_item.php
Gebruik	
 van	
 PHP	
 voor	
 eenmalig	
 tonen	
 datum
templates/<naam>/html/com_content/sec<on/blog_item.php
Wees	
 crea=ef,	
 ga	
 los	
 met	
 overrides!
Vergeet	
 niet...
	
 Updates	
 in	
 de	
 gaten	
 houden	
 voor	
 zowel	
 extensies	
 als	
 core!
	
 Veiligheidsverbeteringen	
 door	
 te	
 voeren	
 in	
 overrides
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

More Related Content

Template overrides - Joomladagen 2010 #jd10nl

  • 1. De kracht en schoonheid van template overrides Sander Potjer Sander Potjer Webdesign twi$er: @sanderpotjer web: www.sanderpotjer.nl
  • 3. 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!
  • 4. Beez als voorbeeld Beez zonder overrides Beez met overrides
  • 5. 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
  • 6. 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
  • 7. View nader bekeken Componenten en modules tonen informa<e via een view Module kent meestal een view Meeste componenten hebben meerdere views bijv com_content Archief Ar<kel Categorie Voorpagina Sec<e
  • 8. 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
  • 9. Hoe maak je een override (in beeld)?
  • 10. 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
  • 11. En hoe voor een module? Maak van mod_news鍖ash voor de default view een override: origineel modules/mod_news鍖ash/tmpl/default.php kopi谷ren naar templates/<naam>/html/mod_news鍖ash/default.php
  • 12. 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 }
  • 13. Genoeg theorie, nu de prak=jk!
  • 14. Joomla! output verlossen van tabellen Een goede standaard override set is van Yootheme, gra<s te downloaden op: h$p://bit.ly/overrides
  • 15. BuHons verplaatsen van item in categorie blog templates/<naam>/html/com_content/category/blog_item.php
  • 17. Tonen van icoon voor elke categorie in de override: in het css bestand:
  • 18. Override van de pagina=e Broncode normaal Broncode met override Met hulp van override bestand pagina<on.php in de html map
  • 19. 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!
  • 20. Gebruik van PHP voor inkorten introtekst templates/<naam>/html/com_content/category/blog_item.php
  • 21. Gebruik van PHP voor eenmalig tonen datum templates/<naam>/html/com_content/sec<on/blog_item.php
  • 22. Wees crea=ef, ga los met overrides!
  • 23. Vergeet niet... Updates in de gaten houden voor zowel extensies als core! Veiligheidsverbeteringen door te voeren in overrides
  • 24. 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