Sinds Joomla 3.1 kun je tags gebruiken in Joomla. Wat is het, hoe werkt het, wat heb je eraan? Dit is mijn presentatie voor de Nederlandse Joomladagen 2014.

1. ERIC TIGGELER | JOOMLA!DAGEN 2014

2. Eric Tiggeler
Tekstschrijver
Schrijfboeken
Boeken over Joomla:
www.joomla.erictiggeler.nl

4. NIEUW
SINDS
JOOMLA 3.1:
TAGS

5. TAGS
1. Waarom heb je tags nodig?
2. Hoe werken tags?
3. Tags maken en toewijzen
4. Wat ziet de bezoeker?
5. Menulinks naar tagpagina’s
6. Modules voor tags
7. De moraal

6. 1 WAAROM
HEB JE TAGS
NODIG?

7. Tags lossen een
probleem op
waarvan je nog niet
wist dat je het had.

8. Joomla 1.5 : The bad old days
 Vaste structuur
 Sectie, categorie, artikel
Artikel
Categorie
Sectie Recepten
Lunch
Lunchrecept
1
Lunchrecept
2
Diner
Dinerrecept
1
Dinerrecept
2

9. Joomla 1.5 : The bad old days
 Vaste structuur
 Sectie, categorie, artikel
 Dus altijd 2 niveaus tot het artikelniveau,
zelfs als je maar 1 niveau nodig had:

10. Joomla 1.6: de doorbraak!
 Categorieën en subcategorieën
 Geen beperkingen meer bij het indelen
 Na jaren eindelijk ‘nested categories’!

11. Werken met categorieën
 Een voorbeeld: recepten onderverdelen
 In dit geval drie categorieniveaus
Artikel
Categorieniveau 3
Categorieniveau 2
Categorieniveau 1 Recepten
Lunch
Snelklaar
Lunchrecept
1
Lunchrecept
2
Vegetarisch
Lunchrecept
3
Diner
Vlees
Recept 1 Recept 2

12. Toch nog beperkingen (1)
 Elk artikel kan in maar 1 categorie zitten
 Receptensite: waar laat je vegetarische
recepten?
Artikel
Categorieniveau 3
Categorieniveau 2
Categorieniveau 1 Recepten
Lunch
Snelklaar
Lunchrecept
1
Lunchrecept
2
Vegetarisch
Lunchrecept
3
Diner
Vlees
Recept 1
Vegetarisch
Recept 1

13. Toch nog beperkingen (2)
 Je moet twee of meer keren
een categorie ‘Vegetarisch’ maken:
Artikel
Categorieniveau 3
Categorieniveau 2
Categorieniveau 1 Recepten
Lunch
Snelklaar
Lunchrecept
1
Lunchrecept
2
Vegetarisch
Lunchrecept
3
Diner
Vlees
Recept 1
Vegetarisch
Recept 1

14. Toch nog beperkingen (3)
 Filmsite: in welke categorie past dit
artikel?
Four
weddings
and a funeral
Categorie:
Comedy
Categorie:
Romcom
Categorie:
Dramaof of ?

15. Toch nog beperkingen (3)
 Een onmogelijke keuze …
Four
weddings
and a funeral
Categorie:
Comedy
Categorie:
Romcom
Categorie:
Dramaof of ?

16. Het probleem met categorieën
 Soms past een kenmerk (‘vegetarisch’) in
meer dan één categorie
 Soms lastig om de indeling eenvoudig
en logisch te houden (‘comedy’?
‘romcom’?)

17. Dat is het probleem
dat je oplost met

18. Makkelijker indelen (1)
 Een oplossing voor onze receptensite
 We hebben genoeg aan deze categorieën:
Artikelen
Categorieniveau 2
Categorieniveau 1 Recepten
Lunch
Lunchrecept
1
Lunchrecept
2
Lunchrecept
3
Diner
Recept 1 Recept 2

19. Makkelijker indelen (2)
 Voeg de tag ‘Vegetarisch’ toe
 Die staat los van de categoriestructuur
Artikelen
Categorieniveau 2
Categorieniveau 1 Recepten
Lunch
Lunchrecept
1
Lunchrecept
2
Lunchrecept
3
Diner
Recept 1 Recept 2
Tag: ‘Vegetarisch’

20. Makkelijker indelen (3)
 In de filmsite hoef je niet langer te
kiezen:
Four
weddings
and a funeral
Categorie:
Comedy
Categorie:
Romcom
Categorie:
Dramaof of ?

21. Makkelijker indelen (4)
 Wijs meerdere tags toe aan 1 artikel:
Four
weddings
and a funeral
Tag:
Comedy
Tag:
Romcom
Tag:
Dramaén én !

22. Voordelen van tags
 Tags zijn labels die je aan content hangt
 Verschil met categorieën: je zit
niet vast aan een boomstructuur
 Per artikel zoveel tags als je wilt
 Makkelijker bij indelen en terugvinden

23. Voordelen van tags
 Categorieën: brede ‘containers’.
Tags: gericht inspelen op wat bezoekers
zoeken.
 Categorieën liggen min of meer vast.
Tags kun je blijven toevoegen.
 Tags bieden bezoekers extra navigatie,
naast gewone menu’s en hyperlinks.
 SEO- voordeel: ook voor zoekmachines
zijn tags een extra ingang.

24. 2 DE
GROTE
TAGSTEST

25. Tags in een testsite
 Installeer Joomla 3.x

26. Startpunt: Joomla installeren
 De nieuwste versie is 3.2.3
 We maken een ‘Receptenbank’

27. Joomla geïnstalleerd
 Resultaat: lege, nieuwe site

28. Extra: kleur en logo aangepast
 De site is klaar om te vullen!

29. De site vullen in 3 stappen
 Normaal gesproken volg je in Joomla
deze drie stappen. Dat doen we nu ook:
 1 Categorieën maken
 2 Artikelen maken
 3 Menulinks maken

30. Stap 1: categorieën maken
Artikelen
Categorieniveau 2
Categorieniveau 1 Recepten
Ontbijt
Ontbijt-
recept 1
Lunch
Lunchrecept
1
Lunchrecept
2
Lunchrecept
3
Diner
Recept 1 Recept 2
Op de receptensite hebben we
deze categorieën nodig:

31. Stap 1: categorieën maken
 1 hoofdcategorie, 3 subcategorieën
 Recepten
 Ontbijt
 Lunch
 Diner

32. Stap 2: artikelen maken
 Artikelen (recepten) in de categorieën
Ontbijt, Lunch en Diner
 Enkele artikelen zijn
‘Speciaal’ (Featured)

33. Stap 3: menulinks maken
 Drie Categorieblog-menulinks
 categorie Ontbijt
 categorie Lunch
 categorie Diner

34. Resultaat: een website! (1)
homepage

35. Resultaat: een website! (2)
Categoriepagina ‘Diner’

36. Klaar? Nee, niet klaar
 Tot versie 3.0 was je klaar met:
 1. categorieën
 2. artikelen (+ Speciale artikelen)
 3. menu vullen
 Sinds Joomla 3.1 komt daarbij:
 4. tags maken en toewijzen

37. 3 TAGS
MAKEN EN
TOEWIJZEN

38. Tags maken: twee manieren
 Manier 1: Componenten > Tags > Nieuw

39. Een eerste tag maken
 Voor onze receptendatabase:
 Tags > Nieuw > ‘Vegetarisch’

40. De tag is klaar
 Lijst met tags verschijnt in de Tags-
component

41. Tags in de Tag-component
 Je kunt die tags ook nog rubriceren in
hoofd- en subtags. Een voorbeeld van
een andere site:

42. Tags toewijzen aan artikelen
 Open een artikel
 Klik op invoerveld Tags en er verschijnt
een dropdownlijst
 Kies uit de beschikbare tags

43. Tags maken: tweede manier
 Een tag maken direct vanuit een artikel
 Typ een nieuwe tag in het vak Tags
 Enter, Opslaan, klaar!

44. Snelle invoermethode: nadelen
 Als iedereen tags kan maken vanuit een
artikel:
 Kans op wildgroei:
te veel tags,
overlappende tags,
tags met tikfouten
 Je kunt tags niet groeperen: je kunt ze niet
toewijzen aan een ‘hoofdtag’

45. Oplossing: de optie ‘Nested’
 Standaard kan iedereen tags maken
vanuit het artikel. (‘AJAX’-methode)
 Wil je dat niet? Ga naar Tags > Opties
 Kies dan optie ‘Nested’
 Dan kun je vanuit een artikel tags nog
wel toewijzen, maar niet aanmaken

46. 4 WAT
ZIET DE
BEZOEKER?

47. Waar verschijnen tags?
 Aan elk artikel voeg je zoveel tags toe
als je wilt

48. Waar verschijnen tags? (1)
 Tag-labels verschijnen:
 boven het volledige artikel

49. Waar verschijnen tags? (2)
 Bij teasers van Speciale artikelen

50. Waar verschijnen tags? (3)
 Niet op blogpagina’s!

51. Waar verschijnen tags? (4)
 Voor blogpagina’s is een template
override nodig van het bestand
blog_item.php.
 Daarin ontbreekt code om tags te laten
zien.

52. Waar verschijnen tags? (4)
 Je kunt dit aanpassen door een
aangepaste kopie (override) te maken
van blog_item.php
 Te vinden in
componentscom_contentviewscategorytmpl
 Meer uitleg over de ontbrekende code:
 http://forum.joomla.org/viewtopic.php?f=706&t=80192
5

53. Waar verschijnen tags? (5)
 Resultaat van de template override:
blogpagina met tags:

54. Zo zien resultaatpagina’s eruit
 Klik op de tag ‘Vegetarisch’ bij het artikel
 Resultaat: eenvoudige lijst met titels

55. Zo maak je de resultaatpagina
aantrekkelijker
 Componenten > Tags > Opties
 Tagnaam: Toon
 Tagafbeelding: Toon
 Beschrijving tag: Toon

56. Nog mooier: teasers tonen
 Componenten
> Tags > Opties
 Itemafbeeldingen:
Toon
 Itembeschrijving:
Toon

57. Is dat alles? Nee!
 Tagresultaten kun je aan de bezoeker
laten zien op drie manieren:
 1 Automatisch: via de tag-als-hyperlink
 2 Via menulinks naar tagpagina’s
 3 Via twee nieuwe modules
 Alleen manier 1 hebben we nu gezien.

58. 5
MENULINKS
NAAR TAG-
PAGINA’S

59. Menulinks naar tagpagina’s
 Menu’s > Hoofdmenu > Nieuw
 Drie nieuwe menu-itemtypes

60. Menulinks naar tagpagina’s
 Drie nieuwe menu-itemtypes:
 Getagde items
 Compacte lijst met getagde items
 Lijst van alle tags

61. Hoe werken die menulinks?
 Voorbeeld: Getagde items

62. Hoe werken die menulinks?
 Resultaat: Getagde items met de tag
‘Pasta’

63. De menulink aanpassen
 Via de opties pas je de weergave aan

64. Resultaat: aangepaste weergave
 Van lijst artikeltitels naar lijst teasers
 Lijkt op List Layout en Blog Layout

65. Meer tags combineren in 1 lijst
 Een menulink kan ook pagina’s tonen
met combinaties van tags:
bijvoorbeeld Vegetarisch + Pasta

66. Tags combineren in 1 lijst
 ‘Vegetarisch’ + ‘Pasta’ =

67. 6 MODULES
VOOR
TAGS

68. Tags in een module tonen
 Je kunt tagresultaten laten zien:
 1 Via de tag-als-hyperlink
 2Via menulinks
 3 Maar ook via twee nieuwe modules:

69. Hoe werkt Populaire Tags?
 Modulebeheer > Nieuw > Populaire Tags

70. Resultaat van Populaire Tags
 Zo ziet het resultaat eruit:

71. Resultaat van Populaire Tags
 Voorbeeld van een override: Popular
Tags in de template Purity III van
Joomlart
 http://www.joomlart.com/demo/#purity_iii

72. Module Gelijksoortige tags
 Toont geen ‘vergelijkbare tags’ …
maar wel: ‘gelijksoortige artikelen’
 Dat zijn artikelen die een of meer tags
gemeen hebben met huidige artikel
 Nuttig om bezoekers naar gerelateerde
content te leiden (van ‘Pasta’ naar
‘Pasta’, ‘Vegetarisch’)

73. Module Gelijksoortige tags
 Je bepaalt zelf hoeveel tags moeten
overeenkomen met huidige artikel:
1 of meer

74. Module Gelijksoortige tags
 Het resultaat op de site:

75. Tag-modules in de JED
 Modules in de Joomla Extensions Directory
 Similar Tags With Introtext
and Images
 Dropdown Tags
 Fancy
TagCloud

76. 7 TAGS:
CONCLUSIE

77. Praktijkvoorbeeld
 Uitgebreide toepassing van tags:
Plantennamen.info

78. Praktijkvoorbeeld
 Alle artikelen geordend met tags

79. Praktijkvoorbeeld
 Bezoeker kan klikken op kleuren of
plantenfamilies

80. Praktijkvoorbeeld
 Zoeken op kleur, stap 1

81. Praktijkvoorbeeld
 Zoeken op kleur, stap 2

82. Praktijkvoorbeeld
 Zoeken op kleur, stap 3

83. Wanneer een categorie,
wanneer een tag?
 Een categorie is een brede hoofdgroep,
bijvoorbeeld: ‘Cakes’, ‘Taarten’
 Een tag helpt je bezoeker om dwars
door die hoofdgroepen heen te zoeken
 Tags benoemen vaak eigenschappen:
denk aan ‘vegetarisch’, ‘beginner’,
‘groen’, ‘comedy’.
 Ter vergelijking: categorieën kun je zien
als de ‘hoofdstuktitels’, en tags als
‘trefwoorden in het register’.

84. Gebruik tags zoals je wilt:
Als aanvulling op categorieën
 Categoriestructuur voor de ‘grote lijn’
 Tags voor meer specifieke kenmerken
Alternatief voor categorieën
 Volwaardig, superflexibel
indelingssysteem
 … dat ook zonder categorieën kan

85. Ontdek wat je nog meer met
Tags in Joomla kan …
 Maak hoofd- en
subtags
 Lijkt op wat
webwinkels doen

86. Ontdek wat je nog meer met
Tags in Joomla kan …
 Ook o.a. Contactpersonen kun je taggen
 Ook batchverwerking (meerdere
artikelen tegelijk aan tag toewijzen)
mogelijk

87. Experimenteer en enjoy!

88. VRAGEN?
Eric Tiggeler
Deze presentatie:
www.slideshare.net
www.joomla.erictiggeler.nl