Nieuw sinds Joomla 3.1: tags. In deze presentatie een uitgebreide verkenning van de mogelijkheden. Deze 'reloaded' versie gaat dieper in op de praktische toepassing.

1. ERIC TIGGELER | JOOMLA HEERENVEEN

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

3. NIEUW IN
JOOMLA
3.1.x: TAGS

4. TAGS
1. Waarom tags?
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

5. 1 WAAROM
HEB JE TAGS
NODIG?

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

7. 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

8. Joomla 1.5 : The bad old days
 Vaste structuur
 Sectie, categorie, artikel

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!
 Subcategorieën
 Geen beperkingen meer bij het indelen

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
Hoofdcategorie 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 keer een categorie
‘Vegetarisch’ maken:
Artikel
Categorieniveau 3
Categorieniveau 2
Hoofdcategorie Recepten
Lunch
Snelklaar
Lunchrecept
1
Lunchrecept
2
Vegetarisch
Lunchrecept
3
Diner
Vlees
Recept 1
Vegetarisch
Recept 1

14. 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
 Voor contentbeheerders
 Voor bezoekers

15. Dat is het probleem
dat je oplost met

16. Wat is het, wat kun je ermee?
 Een label dat 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

17. Kortom: veelbelovend!
 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

18. Kortom: veelbelovend!
 De tag ‘Vegetarisch’ is onafhankelijk van de
categoriestructuur
Artikelen
Categorieniveau 2
Categorieniveau 1 Recepten
Lunch
Lunchrecept
1
Lunchrecept
2
Lunchrecept
3
Diner
Recept 1 Recept 2
Tag: ‘Vegetarisch’

19. 2 DE
GROTE
TAGSTEST

20. Tags in een testsite
 Installeer Joomla 3.1 of hoger

21. Startpunt: 3.1 installeren
 We maken een ‘Receptenbank’

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

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

24. De site vullen in 3 stappen
 Normaal gesproken volg je in Joomla deze
drie stappen:
 1 Categorieën maken
 2 Artikelen maken
 3 Menulinks maken

25. Stap 1: categorieën maken
 In dit voorbeeld:
1 hoofdcategorie, 3 subcategorieën
 Recepten
 Ontbijt
 Lunch
 Diner

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

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

28. Resultaat: een website! (1)
homepage

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

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

31. 3 TAGS
MAKEN EN
TOEWIJZEN

32. Vanaf 3.1: tags toevoegen
 Componenten > Tags

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

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

35. Tags in de Tag-component
 Je kunt die tags ook nog rubriceren in hoofd-
en subtags

36. Zo kun je groepjes tags maken
 Denk aan wat
webwinkels doen
 Helpt je bezoeker
selecties te maken

37. Tags toewijzen aan artikelen
 Open een artikel
 Gegevens > Tags
 Type tot de tag wordt
gevonden
 Autocomplete - Enter!

38. Nog sneller tags maken
 Een tag maken direct vanuit een artikel
 Typ een nieuwe tag in het vak Tags
 Enter, Opslaan, klaar!

39. 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’

40. Oplossing: de optie ‘Nested’
 Standaard kan iedereen tags maken vanuit het
artikel. (‘AJAX’-methode)
 Wil je dat niet? Kies dan optie ‘Nested’. Dat is
selecteren in een lijst met beschikbare tags

41. Meerdere tags per artikel
 Aan elk artikel voeg je zoveel tags toe als
nodig zijn

42. 4 WAT
ZIET DE
BEZOEKER?

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

44. Waar verschijnen tags? (2)
 Bij teasers van Speciale artikelen
 Maar alleen als je kiest voor ‘Plaatsing van
artikelinformatie’: ‘Onder’ of ‘Verdelen’

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

46. 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.
 Meer uitleg:
 http://forum.joomla.org/viewtopic.php?f=706&t=80192
5

47. Waar verschijnen tags? (5)
 Resultaat van de template override:

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

49. Zo kleed je de resultaatpagina aan
 Componenten > Tags > Opties
 Tagnaam: Toon
 Tagafbeelding: Toon
 Beschrijving tag: Toon

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

51. Is dat alles? Nee!
 Tagresultaten kun je 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.

52. 5 TAGS
VIA
MENULINKS

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

54. Menulinks naar tagpagina’s
 Menu > Main Menu > Nieuw
 Drie nieuwe menu-itemtypes
 Getagde Items
 Compacte lijst met getagde items
 Lijst van getagde items

55. Hoe werken die menulinks?
 Voorbeeld: Getagde Items

56. Hoe werken die menulinks?
 Voorbeeld: Tagged items

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

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

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

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

61. 6 MODULES
VOOR
TAGS

62. 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:

63. Hoe werkt Populaire Tags?
 Modules > Nieuw > Populaire Tags

64. Resultaat van Popular Tags
 Zo ziet het resultaat eruit:

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

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

67. 7 TAGS:
CONCLUSIE

68. Praktijkvoorbeelden
 Eenvoudige toepassing: Joomladocumenten.nl
 Handig: Joomlaversies niet als categorie,
maar als tag

69. Praktijkvoorbeelden
 Uitgebreide toepassing:
Plantennamen.info

70. Praktijkvoorbeelden
 Alle artikelen geordend met tags

71. Praktijkvoorbeelden
 Bezoeker kan klikken op kleuren of
plantenfamilies

72. Praktijkvoorbeelden
 Zoeken op kleur, stap 1

73. Praktijkvoorbeelden
 Zoeken op kleur, stap 2

74. Praktijkvoorbeelden
 Zoeken op kleur, stap 3

75. Praktijkvoorbeelden
 Zo dus niet doen: nietszeggende tags als
‘toename’ en ‘twee uur’

76. Gebruik tags zoals je wil:
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

77. Je kunt er nog veel meer mee
 Ook o.a. Contactpersonen kun je taggen
 Ook batchverwerking (meerdere artikelen
tegelijk aan tag toewijzen) mogelijk

78. Je kunt tags ook categoriseren
 Helpt je bezoeker
selecties te maken
 Denk aan wat
webwinkels doen

79. Wat nog niet kan ….
 Bezoekers zelf laten filteren op meerdere tags
 Bijvoorbeeld: bezoeker wil alle content zien
met tags (drie zoekcriteria)

80. Als je zo’n oplossing zoekt …
 Dat zit nog niet in de component Tags
 Wel in de component Fields and Filters (www.kextensions.com)
 Daarmee maak je velden die je bij het schrijven van artikelen kunt
aanvinken (bijv. Soort gerecht: Vegetarisch/Vlees/Gevogelte)
 Vervolgens maak je een filter zodat bezoekers zelf kunnen selecteren op
die velden

81. Fields & Filters: voorbeeld
 Bezoekers laten filteren

82. Zo werkt filteren
 Bezoekers vinkt velden aan en klikt op
Selecteer

83. ENJOY!

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