Aanpassen website ter voorbereiding nieuw seizoen

/in /door

Let op dat ook de vrijwilligersbijdragen worden meegenomen en over het seizoen aanpassen.

  • Kledingpakketten sponsoren
  • Contactpagina
    • Bestuur vragen actuele lijst van contactpersonen en checken.
    • Lodi Schoon vragen de ontbrekende foto’s aan te vullen.
  • Teampagina’s aanpassen
    • Jeroen Eitink, Hans Lubbertsen en Sam Gersen vragen naar de ingeschreven Teams en de pagina’s updaten
    • Lodi Schoon en Frank Buitink vragen of ze de foto’s willen verzorgen en daarvoor lijst met teams doorgeven voor de teamfoto’s
    • Vanaf 2020/2021 geen programma/standen en de uitslagen meer. We gaan dit niet meer via de teampagina’s aanbieden. Dit alles gaat via Voetbal.nl. Het totale programma per 1-2 weken op Home blijft uiteraard wel zichtbaar.
  • Het Eerste
    • Check bij Marc van Veen voor rugnummers, posities, geboortedata en lengtes en de nieuwe selectie aanpassen.
    • Alle portretfoto’s aanpassen op de https://www.vvspartanijkerk.nl/eerste-elftal/ .
    • Teamfoto in de header aanpassen na uitbrengen presentatiegids. Dit is meestal tijdens de 1e thuiswedstrijd van de competitie.
    • Portretfoto’s van het Eerste aanpassen naar  380×270 px voor in de mediabibliotheek, voor gebruik bij items m.b.t. Speler van de week.
    • Controle op menu of alle Sportlinkcodes nog werkzaam zijn en het programma, de standen van het 1e elftal worden ingeladen
  • Jan de Greef vragen zorg dragen voor het bijhouden van het wedstrijdblokje in de header op Home.
  • Check op Beeldenbank of de foto’s die we regelmatig gebruiken nog actueel zijn. Let ook op foto’s van de Ebbenhorst en tribunes i.v.m. sponsorborden.
  • Check op paginaheaders of de foto’s nog bruikbaar zijn.
  • Check laten uitvoeren door SV of hun pagina’s en contactpersonen nog updates nodig hebben.
  • Check laten uitvoeren door BC of hun pagina’s en contactpersonen nog updates nodig hebben.
  • Evenementenkalender opvragen bij bestuur en aanpassen op de website.
  • Contentplan opstellen en een planning maken m.b.t. columns komend seizoen. (vanaf seizoen 2024/2025 mee gestopt)
  • Check op Programma via link submenu op Home of alle wedstrijden goed worden geladen.
  • Blur op Home van foto Sparta 1 vervangen?

Artikelen fanshop

/in /door

Voor het bijwerken van de fanshop pagina: Fanshop – v.v. Sparta Nijkerk (vvspartanijkerk.nl) Ga je naar deze pagina om te bewerken in WP Pagina bewerken “Fanshop” ‹ v.v. Sparta Nijkerk (vvspartanijkerk.nl) en vandaar uit naar het sectieblok

  • Om te bewerken bekijk: https://gyazo.com/4981c1882d3aa91120617239f2667232 
  • Om de volgorde aan te passen ga naar de gallerij en versleep de afbeeldingen naar de juiste positie.
  • Voeg de gallerij in (button rechtsonderin)
  • Vergeet niet de pagina van de fanshop te updaten.

HHC pagina – blok ‘verstoppen’ en galerij

/in /door

Tevens kan je door een class toe te voegen iets verstoppen. de class is “hide” en kan je bijvoorbeeld zo toepassen:

https://gyazo.com/ae28bf0f20866f785be321d30738a07d

Door de afbeeldingen in de galerij te vervangen dien je deze hierin te slepen. Let op, max 6!

https://gyazo.com/8cb42974c84b29d0b7809528f4fdb9af

 

Registratie bezoekers wedstrijden Sparta 1 (corona-maatregel)

/in /door
  1. Dit is een pagina in WordPress, deze kan aangepast worden onder het kopje Pagina’s. Vanuit een nieuwsbericht kun je verwijzen naar deze pagina.
  2. Deze pagina kan per wedstrijd gekopieerd worden en naar wens worden aangepast qua tekst. Wanneer je deze kopieert, geef je zeer waarschijnlijk ook een unieke URL mee. Deze URL zal ook meegenomen moeten worden in het nieuw te maken nieuwsitem. Dus wanneer je teksten kopieert vanuit een vorig nieuwsitem goed op letten dat je de nieuwe Registratiepagina URL overneemt.
  3. Onderaan staat het formulier dat gebruikt wordt: screenshot.
  4. De naam van het formulier is Registreren thuiswedstrijd. Dit formulier kan per wedstrijd gekopieerd worden en ingesteld worden op de registratiepagina voor die wedstrijd. Let op bij het kopiëren van een formulier krijgt deze een nieuw id nummer. Deze moet worden aangepast op de Registratiepagina.
    De tag {Title pagina10 }in de melding en PDF kun je op deze manier instellen:  https://gyazo.com/41b8bc92d826e556ec38a8149f7e9741. Daarmee pakt hij automatisch de titel van de pagina waar het formulier op geplaatst is. Daarom is het van belang dat de naam van de Registratiepagina steeds dezelfde opbouw heeft per wedstrijd. In de PDF gaat dit daarna ook automatisch goed, we halen daar ook de naam van de pagina op. Kortom, kwestie van de paginatitel goed neerzetten en je bent er 🙂
  5. In WordPress kun je bij de instellingen van dit formulier aangeven wat de limiet is: screenshot
  6. Nadat het formulier is ingevuld, krijgt de bezoeker een bevestigingsmail met daarin een PDF die meegenomen dient te worden.
Er is nog wel een oplossing denkbaar waarbij je de streepjescode op de PDF kunt scannen, en dat dit direct in een online spreadsheet de daadwerkelijke bezoekers registreert. Daar zouden we wel even in moeten duiken maar kan een mooie uitbreiding zijn.

Aanmaken downloadbuttons

/in /door

Mollie koppelen aan een formulier

/in /door

Het is nu mogelijk om aan een formulier de mogelijkheid tot betalen toe te voegen. Via deze link vind je de uitgebreide instructies (vanaf stap 3). Om de API key te gebruiken is toegang tot Mollie nodig. Dat heeft Erik Plug. Bart Nieuwenweg van Draad kan hier ook bij.

Een testpagina is aangemaakt en te zien op https://www.vvspartanijkerk.nl/mollie-test. Er is ook een testformulier aangemaakt: Mollie test. Hier kun je ook zien hoe het ingesteld moet worden. In dit formulier is de Test API-key gekoppeld zodat je de gehele flow kunt volgen zonder te betalen. Om echte betalingen mogelijk te maken moet de Live API-key gebruikt worden.

Aanmaken tabellen

/in /door

Tabellen kunnen niet in WordPress worden ingekopieeerd vanuit Word of Excel. Deze worden niet goed geschaald op de verschillende devices. Om dit af te vangen is de Plugin NinjaTables Pro toegevoegd.

De tabel wordt hierin aangemaakt zie als voorbeeld: Jaarplanning activiteiten 2018-2019

Handmatig aanmaken tabel

  1. Add Table
  2. Geef de tabel een herkenbare naam
  3. Add Columns
  4. Add Data -> dit zijn de regels die je onder de kolommen wilt tonen
    1. Check even de Add at Last of First staat aangevinkt en welke jouw voorkeur heeft (werk je van beneden naar boven of van boven naar beneden?)
    2. Vinkje aan bij Continue adding
  5. Wanneer klaar klik op de shortcode bovenaan de pagina en kopieer deze in je Nieuwsitem of Pagina

Importeren van tabel (CSV or SJON files)

Instructie

 

Aanmaken Nieuwsitem

/in /door
  • Voeg een nieuwe toe
  • Titel invoeren, bij voorkeur kort en krachtig.
  • Voer tekst in.
    Wanneer dit vanuit een Word document wordt overgenomen, eerst in Notepad zetten en dan overnemen in WordPress. Tekst neemt daardoor geen Word code mee
  • Denk aan de opmaak.
    • Gebruik kopjes vanuit de editor
    • Koptekst 1 is Titel
    • Koptekst 2 is de eerste die je in de tekst gebruikt

  • Gebruik van externe links?
    • Altijd laten open in een nieuw venster.
  • Gebruik van buttons?
    • Gebruik ‘Voeg thema shortcode in’ in editor
    • Kies Sparta elementen
    • Kies Download knop
      • Tekst die je op button wilt tonen
      • URL waar de button naar toe moet linken
      • Kies altijd: Openen in nieuw venster
      • Opslaan
    • Wil je gegevens van een contactpersoon opnemen, kies dan voor een contact knop. Dan komt er een formulier achter de button (AVG proof)
  • Toevoegen afbeeldingen in de tekst
    • Kies voor Media toevoegen
    • Kies je bestand en upload deze in de mediabibliotheek mapje Nieuws (NIET media library of beeldenbank)
    • Controleer altijd de afmeting en in welke grootte je deze wilt tonen. Klein/gemiddeld/volledig
    • Kies altijd voor link naar Mediabestand zodat deze op kleiner devices apart opkomt en groter/beter leesbaar wordt getoond. Linken naar andere locatie/URL kan ook maar dan graag laten open in apart venster.
  • Standaard wordt het nieuwsitem op Home. Onder het blok tekstinvoer is er een optie om aan te geven dat je dit nieuwsitem niet op Home wilt tonen -> Vinkje aan bij Verbergen op Home
  • Kies je categorie.
    • Meerder opties zijn mogelijk. Relevant voor de filtering vanuit het Nieuwsoverzicht
  • Wil je een nieuwsitem uitlichten op de betreffende pagina (Jeugd, BC, SV) dan ook ‘Businessclub uitgelicht’ als categerie aanvinken. Altijd i.c.m. met Businessclub. Er wordt nl niet gefilterd op Uitgelichte items.
    Let op!

    • Max. 2 items uitlichten per categorie (dus 2 BC items, 2 Jeugditems, 2 SV items)
      • Tyno Koelewijn bepaalt welke 2 uit te lichten op BC pagina
      • Rob Schoon of Nanne Visser bepalen welke 2 op Jeugd anders webmaster
      • Jan van den Hoff bepaalt welke 2 op SV pagina of anders webmaster
      • Webmaster of verzoek van bestuur of OC welke er op Home (Header) worden uitgelicht
    • Heb je meer dan 2 items uitgelicht worden alleen de 2 meest recente getoond. De oudere items komen dan bij het Laatste nieuws terug op volgorde van publicatiedatum
    • Uitgelicht nieuws wordt op de desktop getoond in een groter formaat, rekening houden met afbeelding. Zie Uitgelicht afbeelding
  • Uitgelichte afbeelding
    • Formaat Nieuwsitem 380×270
    • Formaat Uitgelicht Nieuwsitem 510×270
    • Verwerken kan eenvoudig via gratis tool https://www.befunky.com/create/ 
      • Open -> kies afbeelding van je pc
      • Resize -> breng of naar 510/380 breedte of naar 270 hoogte waarbij de andere waarde (breedte of hoogte) groter blijft dan het gewenste breedte of hoogte
      • Crop -> breng de breedte of hoogte naar 510/380 of 270
      • Save -> opslaan op locatie eigen pc
    • Uploaden in WP in map Nieuws
      • Niet in Media Library en niet in de beeldenbank
    • Bij voorkeur gebruik van foto’s geen logo’s
    • Geen foto beschikbaar?
      • Check de Beeldenbank onder mapje nieuws in Media bibliotheek
      • Geen passende? Kies dat Default of Default.grey in mapje Core Let op: staan 2 formaten in deze map. Voor Nieuws 540×540 en voor Uitgelichte Nieuwsitems 510×270. Wees wel bewust dat wanneer het Uitgelichte Nieuws naar Laatste Nieuws gaat de afbeelding wordt bijgesneden automatisch en valt het logo weg. Idealiter zou je de uitgelichte afbeelding moeten vervangen voor die van 540×540.
    • Zorg er voor dat het belangrijkste deel van de afbeelding in het midden staat. In het Nieuwsoverzicht wordt de afbeelding naar 270×270 teruggebracht op de desktop en tablet.
  • Nieuwsitem laten vervallen na bepaalde datum?
    • Rechterzijde blok Post Expirator
    • Vinkje aan -> enable
    • Vul datum en tijd in wanneer het item niet meer zichtbaar moet zijn
    • How to expire: Draft. Kies niet voor delete want dat ontstaan er 404 meldingen (pagina niet gevonden)

Vergeet vooral niet te publiceren!

 

 

 

Header op Home

/in /door

Aandachtspunten bij het aanmaken van een Header op Home

  • Bij voorkeur minimaal 2-3 items anders gaat hetzelfde item rouleren, is niet fraai
  • Post Expirator is mogelijk wanneer het nieuws een tijdelijk karakter heeft
  • Video’s niet geheel laten afspelen, maar verkort (30 sec?) Anders blijft de video alle aandacht vragen. Als er nog andere items zijn komen die niet meer in beeld.
  • Bij voorkeur wedstrijdverslag van vorige week in concept zetten wanneer er een nieuwe is. Dus geen 2 in de Header
  • Bij voorkeur variëren met nieuws dat vereniging breed is. Niet de indruk willen wekken dat de site alleen voor en van het Eerste is.
  • Begeleidende afbeelding 1920×840

Bewerken afbeelding Header naar 1920×840

  • Zoek een geschikte foto uit, bij voorkeur met een zo groot mogelijk formaat. Minimaal 1920 breed is eigenlijk nodig voor het scherpste beeld
  • Sla deze op op je computer
  • Open het gratis fotobewerkingsprogramma Be Funky: https://www.befunky.com/create/
  • Klik op Open / Computer en selecteer jouw gekozen foto
  • Kies voor optie Resize, links in het menu
  • De foto’s van Marjet zijn vaak te klein, maar omdat er over de Header een donkere gloed komt zie je vaak niet dat deze minder scherp is als je deze gaat vergroten. Pas de width aan naar 1920 en kies het vinkje om de bewerking toe te passen
  • Kies daarna de optie Crop en pas nu de Height aan naar hoogte 840. Let op dat je de width op 1920 houdt!
  • Er ontstaat nu een frame die je nog naar wens kunt verschuiven voordat je gedeelten gaat wegknippen. Doe dat om een zo mooi mogelijk geheel te behouden.
  • Heb je dit naar wens verschoven klik dan op het vinkje om de bewerking toe te passen.  Jouw foto is nu naar formaat 1920×840 bijgewerkt
  • Kies voor Save (middenboven) en sla deze op op je computer
  • Nu kan je de afbeelding via de Media bibliotheek uploaden
  • Kies hiervoor het mapje Headers
    • Headers voor eenmalige specifiek gebruikte afbeeldingen
    • Map Headers Home – beeldenbank alleen gebruiken voor Headers geschikt voor algemeen herhaaldelijk gebruik

Menu’s

/in /door

Beheer van de menu’s kan via Weergave > Menu’s of deze directe link: https://www.vvspartanijkerk.nl/wp-admin/nav-menus.php (werkt alleen als je bent ingelogd).

Er zijn diverse menu’s, die verschillende functies hebben. Hierbij de lijst, voorzien van functie:

  1. Main menu – dit zijn de hoofditems die je ziet op elke pagina
  2. Top menu – dit zijn de kleine menu-items boven het main menu
  3. Jeugd menu – hier worden de jeugdteams weergegeven op de jeugdpagina. Dit menu wordt dynamisch gevuld o.b.v. de teamnamen
  4. Teams segment – hiermee wordt het menu met alle teams opgebouwd. Dit menu wordt dynamisch gevuld o.b.v. de teamnamen
  5. Business Club – hiermee worden de snel naar knoppen op de BC pagina bepaald
  6. Vereniging Segment – hiermee wordt het megamenu onder Vereniging opgebouwd.
  7. Socket Menu – hiermee worden de linkjes onderaan de pagina beheerd (privacy reglement)
  8. Jeugdpagina menu – hiermee worden de snel naar knoppen op de jeugdpagina bepaald
  9. Snelmenu home – dit bepaalt de snel naar knoppen op de homepage
  10. Competitie quick menu – dit bepaalt de snel naar knoppen op https://www.vvspartanijkerk.nl/competitie/
  11. Supporters quick menu – dit bepaalt de snel naar knoppen op https://www.vvspartanijkerk.nl/supporters/
  12. Footer menu – wedstrijden – dit bepaalt de links onderaan iedere pagina
  13. Footer menu – onze club – dit bepaalt de links onderaan iedere pagina
  14. Nested pages – deze hoeft door jullie niet gebruikt te worden
  15. Footer menu – jeugd – dit bepaalt de links onderaan iedere pagina

Aanpassen van menu’s

Voor het aanpassen van menu’s, of het maken van een nieuw menu geeft deze handleiding een goede weergave: https://www.wplounge.nl/beginners/menus/

Footermenu -> Aanpassen bij Weergaven -> Widgets en dan is het Footer – column*. Hier kan je een menu kiezen of op de plek van de menu’s het menu aanpassen

Disable link in menu

Om een menu-item niet door te laten klikken naar een pagina pas je dit aan door achter het menu-item bij subitem met je muis te klikken, dan verschijnt er een instellingsicoontje met de tekst Uber en opent het volgende scherm, daar kan je de link ‘disablen’:

Om het menu een kopje mee te geven:

  • Als eerst moet het item een CSS Class meekrijgen (klasse-titel)

  • En als je dan op “uber” klikt, kun je daar de titel invullen:

 

  • En even zorgen dat de layout dan op “automatic” staat.

 

Sportlink

/in /door

Om de team- en poulecode’s op te halen van alle teams kun je gebruik maken van de volgende url:

https://data.sportlink.com/teams?clientId=T7Q2hf2RAf

Onderstaande is niet meer van toepassing omdat Voetbal.nl meer en meer in gebruik is genomen:

  • Begin van het seizoen invullen
    • Teamcode
    • Poulecode (competitie)
    • Bekercode (poule)
  • Check speeldagen kalender op de data van de vervolgwedstrijden (inhaal/bekerrondes) daarvoor de codes vervangen voor nieuwe
    • bekercode ronde 1 (oktober gespeeld rondom herfstvakantie Cat.  A en november Cat. B)
    • bekercode ronde 2 (december – januari)
    • bekercode ronde 3 (februari/maart rondom voorjaarsvakantie)
    • bekercode ronde 4 (eind maart)
    • bekercode ronde 5 (eind april, begin mei/meivakantie)
    • finales juni (weekend Hemelvaart en/of weekend van Pinksteren)

Lettertype & Kleuren

/in /door

Lettertypen en kleuren Sparta website:

Oswald medium – 35px (titel) 15px (buttons)

Aller Regular – 16px (Broodtekst)

Aller Bold – 16px (Tekst titels)

 

Oranje – #ED7B01

Donkergrijs – #2F2F2F