Hyperlocal Academy - deel 2: techniek Mogelijk gemaakt door: • Stimuleringsfonds voor de Journalistiek • Centrum voor Communicatie en Journalistiek

1. Hyperlocal Academy - deel 2: techniek
• uitgaande van het gebruik van het WordPress CMS
• mogelijk gemaakt door Stimuleringsfonds voor de Journalistiek, Centrum voor
Communicatie en Journalistiek en Journalism Lab
!
!
!
door @peterluit
1

2. Wat gaan we doen?
• Onderhouden van de achterliggende techniek
• Externe content aggregatie - hoe werkt dat?
• koppelingen social media
• betaalde of gratis content - de techniek
• meten van resultaten - analytics
• nieuwsbrief, webapps, apps…..
• overige plugins voor uitgeef doeleinden
2

3. Waar gaan we een beetje van uit?
• basiswerking van WordPress is redelijk bekend
• je kent nut en noodzaak van het toepassen van plugins
• je weet wat een vormgevingsthema is en de keuzecriteria voor een website
met uitgeefdoelen te bepalen
• je hebt een idee/visie over advertentie- en redactiestrategie op basis waarvan
de website verder moet worden ontwikkeld
• je bent uiterst nieuwsgierig naar mooie en goed toepasbare technieken voor
je nieuwssite……..
3

4. WordPress - het overzicht
theme
plugin
plugin
plugin
plugin
plugin
1 2 3
2a
2b
(body)
inhoud:
bericht(en)
of pagina
4
wordpress kern

5. Onderhoud van de achterliggende techniek
• de WordPress basis software
• de plugins
• de thema’s
5

6. WordPress basis
• WordPress is opensource software, ca. 20% van alle websites wereldwijd
draaien op dit platform
• Dat maakt WordPress kwetsbaar(der) voor ‘aanvallen’
• De eisen die WordPress stelt aan plugins en thema’s zijn niet overdreven
streng, daardoor kunnen ‘lekjes’ makkelijk ontstaan
• Updates verschijnen dus niet alleen maar voor nieuwe functies, maar ook
voor het verbeteren van bestaande functies
6

7. Testomgeving
• Het is zinvol een (kopie) testomgeving te hebben, die alleen intern bereikbaar
is om de volgende tests te kunnen uitvoeren:
• testen van WordPress updates ten opzichte van bestaande plugins
• blijft een plugin na een update in de totale samenhang van plugins werken
• werken alle plugins in samenhang met het thema
7

8. Upgrades en updates
• WordPress major upgrades lopen via 3.9 - 4.0 - 4.1 en moeten handmatig
worden geïnstalleerd (per jaar ca. 2 upgrades)
• WordPress minor updates lopen van 4.0 - 4.01 - 4.02 en worden automatisch
uitgevoerd (als de webserver het toestaat) (per versie doorgaans 2-3 updates)
• Plugins en thema’s hebben geen ‘afgedwongen’ versie volgorde binnen
WordPress (zeer willekeurige update cycli)
8

9. Elimineer kwetsbaarheden rondom plugins
• installeer alleen plugins voor echt noodzakelijke functies
• analyseer de meerwaarde van betaalde plugins, gratis is niet altijd
automatisch goed, maar betaald is ook geen garantie
• verwijder plugins die niet (meer) worden gebruikt
• let altijd op updates van plugins, installeer ze niet meteen, ga altijd naar de
website van de ontwikkelaar en zoek naar vragen en antwoorden op forum of
weblog
9

10. Elimineer kwetsbaarheden rondom plugins
10

11. Kwetsbaarheden van thema’s
• Thema’s zijn er in vele varianten en vormen de basis voor het genereren van
de output code naar de browser
• maak zorgvuldige afwegingen bij het kiezen van een thema
• ook hier is gratis niet zomaar een afdoende norm
• niet elk thema maakt bijzonder vriendelijke SEO code
• ontwikkel zelf voldoende kennis om eigen instellingen te verwerken in een
zogenaamd ChildTheme op basis van een Framework
11

12. Backup procedures
• bij shared IP hosting pakketten meestal niet het geval
• dan zelf doen dmv plugin(s), helaas: er zijn er velen: WP-DB-Backup
(helaas wat verouderd), BackWPup, WP-DB Manager
Lees beoordelingen: http://www.stateofdigital.com/top-6-wordpress-backup-
plugin-recommendations-for-2013/
• bij VPS (Virtual Private Server), meestal zelf in te stellen, of bij zogenaamde
managed VPS, binnen de SLA met de provider. Ga dit goed na!
• plugin dan niet noodzakelijk
12

13. Optimaliseren database
• Plugins en thema’s schrijven in de MySQL database
• bij het verwijderen worden niet altijd netjes de niet meer gebruikte tabellen
verwijderd
• verwijderen van niet gebruikte tabellen kan o.a. met de plugin
WP-Optimize (https://wordpress.org/plugins/wp-optimize/)
• maak altijd eerst een volledige back-up van de database!
13

14. Optimaliseren database
14

15. Externe content aggregatie
• RSS feeds zijn voor dit doel het meest geschikt
• Aantal tools beperkt, maar goed genoeg
15

16. Content overnemen van andere bronnen
• Altijd nagaan in hoeverre de bron dat toestaat.
• controleer of mogelijke plugins welke inhoud waar wordt overgenomen en
in welke status inhoud wordt gezet (liefst status ‘draft', want je wilt
doorgaans niet alle content per keer publiceren)
• controleer of je de artikelen al dan niet met een extra ‘editorial plugin’ kunt
plannen (datum/tijd) voor publicatie (al dan niet met een redactionele
bewerking)
• ga na in hoeverre bronnen van derden de overname van gedeeltelijke - of
gehele artikelen toestaan i.v.m. auteursrechtelijke aspecten
16

17. Content overnemen van andere bronnen
• Vier mogelijke oplossingen
• WP RSS Aggregator (basis is eenvoudig, add-ons moeten betaald worden)
• WPeMatico
• WP RSS Multi Importer (gratis en uitgebreid)
• AutoBlog van http://premium.wpmudev.org (betaald)
17

18. Voorbeeld WP RSS Aggregator
18

19. Voorbeeld AutoBlog
19

20. Waar plaatsen?
• Let bij alle mogelijk plugin op de mogelijke locaties waar geaggregeerde
content geplaatst kan worden:
• in de body als ‘samenvatting’ met link naar de bron, afhankelijk van datum/
tijd (probeer creatief onderscheid te maken met eigen content)
• in de body als geheel bericht (pas op copyright aspecten)
• in widgets in de sidebars, meestal weergegeven als feed, titel met een link
naar de bron
20

21. Koppelingen social media
• algemene knoppen voor een link naar gebruikte kanalen
• knoppen om getoonde inhoud te delen
• mogelijkheden om tijdlijnen van social media kanalen te tonen
21

22. Koppelingen social media - mogelijkheden
• Tweet genereren bij publicatie van een artikel (WP to Twitter)
• maak geautomatiseerd een tweet met Titel en URL
• Via Twitter doorsturen naar Facebook (dat doe je in Twitter instellingen)
• is dat echt wenselijk - bepaal doelen rondom je social media beleid
• Talloze ‘share’ buttons, per bericht, algemene volg knoppen etc.
22

23. Wat staat centraal?
eigen inhoud
website
filmpjes
presentaties
brochures
Facebook
LinkedIn
twitter
nieuwsbrief

24. Verkeer genereren naar centraal medium
eigen inhoud
je eigen website
centraal!
filmpjes
presentaties
brochures
Facebook
LinkedIn
twitter
nieuwsbrief

25. Verwijzing naar social media kanalen, feed en email
25

26. Delen van een artikel, tonen van een tijdlijn
26

27. Twitterberichten als tijdlijn doe je via Twitter widget
27

28. Plaatsen in WordPress widget
28

29. Betaalde content versus gratis content
• wie betaalt wat?
• belang adverteerders
• betaal bereidheid abonnees
29

30. Betaalde content versus gratis content
• De vraagstukken
• betalen consumenten on-line voor nieuws of voor gedegen
achtergronden?
• hoe regel je het betalen?
• hoe regel je de login gegevens?
• welk financieel belang mag/moet een adverteerder hebben in het gehele
businessmodel van de titel?
30

31. Verschillende betaalmuren
• meteen voor alles bij aangaan van een (jaar)abonnement - all you can read
• eerst gratis proefperiode (tijd, aantal), daarna betalen - let goed op mogelijke
aanwezige functionaliteit bij plugin keuze
• soms gratis content om betaalde content te promoten (bijvoorbeeld gratis
artikel per week, of gratis promotie periodes)
• betalen per artikel (eventueel gedifferentieerd) - pay per view
• betalen voor een auteur
• Leren van Elinea, Blendle, MyJour, de Correspondent etc.
31

32. Abonnementenbeheer: zelf doen of uitbesteden?
• de criteria
• aantallen te verwachten abonnees voor premium content
• administratieve handelingen (verschillen B2B en B2C), eenmalig, herhalend
32

33. Informatiebronnen
• Leadin: http://leadin.com/plugins/wordpress-paywall/
• op http://www.chrislema.com veel artikelen over ‘lidmaatschap websites’,
keuzes plugin, betaalmogelijkheden etc.
33

34. Een start met S2Member Pro
34
• http://www.s2member.com/pro/
• Paypal integratie
• API’s voor koppelingen externe systemen
• verschillende toegang niveaus (per artikel in te stellen)
• toegang restricties per account
• eigen te maken inschrijf formulieren

35. Voorbeeld op printmedianieuws.nl
35

36. Meten van resultaten, SEO en Google Analytics
• wat doe je met SEO voor wat?
• Google Analytics integreren
36

37. Zoekmachine optimalisatie met ‘yoast’ plugin
37

38. Zoekmachine optimalisatie (SEO)
38

39. Zoekmachine optimalisatie (SEO)
39

40. Zoekmachine optimalisatie (SEO)
40

41. Zoekmachine optimalisatie (SEO)
41

42. Google Analytics
• maak account aan bij http://www.google.com/analytics/
• voeg de te analyseren website toe
• je krijgt een UA code, bijvoorbeeld UA-12345678-9
42

43. De meest gebruikte plugin
43

44. Extra in je dashboard, nu nog met Google
Analytics Dashboard for WP
44

45. Gebruik maken van MailChimp voor nieuwsbrief
• Wat is MailChimp?
• Hoe maak je er gebruik van binnen WordPress?
45

46. Wat is MailChimp?
• Een Amerikaans web-based e-mail marketing systeem
• een forse omgeving op zichzelf (vergt echt wel wat tijd)
• integratie met WordPress door middel van MailChimp plugin of stukje
JavaScript code in een widget voor meer geavanceerde e-mail nieuwsbrief
inschrijfformulier
46

47. Wat is MailChimp?
• Hoe kan het volledig geautomatiseerd werken?
• RSS feed van berichten op basis van bepaalde frequentie
47

48. Wat is MailChimp?
• MailChimp werkt met zogenaamde ‘tags’ die per bericht de content vanaf de
website ophaalt
• *|RSSITEM:TITLE|* = de titel van elk artikel
• *|RSSITEM:CONTENT|* = de inhoud van elk artikel
48

49. Wat is MailChimp?
• Wat moet je dus doen (samenvattende aandachtspunten)
• account aanmaken in MailChimp
• een lijst van ontvangers (handmatig of via excel sheet) #toestemming?
• MailChimp plugin activeren en lijst kiezen, formulier in widget plaatsen
• een campagne maken op basis van RSS feed (voor geautomatiseerde
nieuwsbrief), frequentie, tijd ontvangst instellen
• een template kiezen voor de vormgeving en inhoud plaatsen (tags)
• de campagne starten 49

50. Relevante plugins voor uitgever
• een paar voorbeelden
50

51. Typen plugins
• advertenties
• gerelateerde berichten
• print-to-web
• auteursprofielen
• betaalmuren/ledenwebsites
51

52. Advertenties
• door middel van een slider (zie http://www.golfbaanspraarwoude.nl)
• https://wordpress.org/plugins/logo-slider/
52

53. Advertenties
• door middel van een ‘roulerende’ banner in een widget
• https://wordpress.org/plugins/useful-banner-manager/
53

54. Advertenties
• De volgende plugin leunt al tegen on-line advertentie management aan
• AdRotate: https://www.adrotateplugin.com
• Vanaf 29 euro voor één website
54

55. Advertenties (*)
• OpenX integratie: plaats advertenties vanuit een extern on-line advertentie
management systeem
• https://wordpress.org/plugins/openx-wordpress-widget/
• OpenX heet tegenwoordig Revive Addserver (http://www.revive-adserver.
com/)
• webservice voor het meten van advertentie bewegingen
• is een vak op zichzelf, termen als CPM, CPC, CPA etc.
55

56. Revive Addserver - opensource
56

57. Gerelateerde berichten
• De bekende ‘Lees ook…’
• https://wordpress.org/plugins/yet-another-related-posts-plugin/
57

58. Print-to-web
• Een op papier lijkende online PDF-Reader
• https://wordpress.org/plugins/issuu-embed/
58

59. Auteursprofielen
• Onderaan een artikel: gegevens en (optioneel) koppelingen social media
kanalen per auteur
• https://wordpress.org/plugins/author-bio-box/
59

60. Tot slot: mobiel
• responsive
• webapps
• apps
60

61. Aspecten bij responsive design
• ontwerper bepaalt in principe de volgorde van de opbouw
• stel: website is linker sidebar, content, rechter sidebar
• voorbeeld op mobiel: content, linker sidebar, rechter sidebar
• aanpassen in style.css via @media (*)
• let goed op of thema responsieve design aanbiedt!
• responsive design is geen vervanging van een native app!
61

62. Voorbeelden smartphone
• ontwerper bepaalt in principe de volgorde van de opbouw
• stel: website is linker sidebar, content, rechter sidebar
• voorbeeld op mobiel: content, linker sidebar, rechter sidebar
62

63. Voorbeelden tablet
• ontwerper bepaalt in principe de volgorde van de opbouw
• stel: website is linker sidebar, content, rechter sidebar
• voorbeeld op mobiel: content, linker sidebar, rechter sidebar
63

64. Webapp met WPTouch
• WPTouch is een plug-in met ingebouwde thema’s voor mobiele weergave op
smartphone en tablets
64

65. Native apps
• Native apps worden geleverd via de appstores van o.a. Apple, Google en
Microsoft
• Bepaal doelstellingen rondom responsieve, webapps of native
• Let goed op integratie mogelijkheden van bestaande content
• Inmiddels vele ‘app generatoren’ vanaf bijna gratis…..
65

66. Hyperlocal Academy - techniek
!
!
!
!
!
!
door @peterluit
66