Les 5

Drupalversie: 
Drupal 8

Nieuwe sites

Een poging om de snelheid van de sites te verzekeren tijdens de lessen:

De inloggegevens zijn onveranderd gebleven.

Webform (deel 2)

Bevestigingsmail admin

Wanneer een gebruiker een formulier heeft ingevuld op de site is het handig dat dat je daarvan een mail krijgt. Dit is zeer eenvoudig in te stellen via het webform.

  • Open de instellingen van het webform
  • Kies bovenaan voor Emails / Handlers

  • Voeg vervolgens een E-mail toe

  • Bij de instellingen kan je een aantal zaken instellen:
    • Wie is de afzender? Indien je in het formulier het e-mailadres hebt gevraagd, dan kan je dat gebruiken of bijvoorbeeld de voornaam
    • Verder kan je ook kiezen welke elementen moeten worden opgenomen in de mail
  • Sla de instellingen op en test uit!

Bevestigingsmail gebruiker

Voor de gebruiker geeft het altijd een goed gevoel wanneer er na het indienen van een bepaald formulier ook bij hen een mail ter bevestiging toekomt.

  • Voorbereidend werk:
    • Voeg bij jouw formulier een element toe: e-mail confirm
  • Voeg nu bij Email / Handlers een nieuwe E-mail toe
  • Geef dit een logische titel
  • Belangrijk! Kies bij de ontvanger nu het e-mail confirm element uit jouw formulier!

  • Verder gaan we nu de e-mail opstellen. Aanpassingen zullen nodig zijn:
    • Bij het onderwerp kies je voor custom subject... en je vult nu zelf een onderwerp in
    • Bij de body passen we ook aan naar custom body...
    • Hier willen we de naam van de indiener rechtstreeks gebruiken, dat is persoonlijker. Daarvoor het je het token [webform_submission:values:?] nodig. Het vraagteken vervang je nu met de sleutel van het element. Dit kan je opzoeken bij de elementen zelf van het webform.

  • Om de werken te controleren vul je even het formulier in, controleer vervolgens jouw e-mail.

Resultaten

Om de resultaten te bekijken kan je best achter de schermen klikken op resultaten. Vervolgens krijg je een reeks tabbladen. We overlopen deze.

Inzendingen:

  • Deze tonen een lijst van alle ingezonden formulieren met details zoals naam indiener, datum en uur.

Tabel:

  • Dit toont in tabelvorm ook de ingegeven waarden van de elementen in het formulier

Downloaden:

  • Een zeer handige tool. Hiermee kan je alle resultaten downloaden in een overzichtelijke HTML-tabel, te openen met Excel.
  • Bij de formaat opties kies je best een HTML-tabel met de optie te openen in Excel, test gerust de andere opties uit.

  • Bij de onderstaande mogelijkheden kan je ook de afbeelding van de handtekening downloaden, echter is dit enkel de URL, niet zo handig, beter kiezen voor het tweede bolletje.

  • Even testen uiteraard!

Andere instellingen

We overlopen de instellingen van ons eigen gemaakte webformulier klassikaal:

  • Algemene instellingen ⇒ De naam en de beschrijving van het formulier
  • Webform submit button ⇒ Opties voor de submission knop, zoals deactiveren indien geklikt
  • Wizard settings ⇒ werk je met een wizard, dan kan je in stappen of met percentages werken
  • Submission limits ⇒ gaat dit over inschrijvingen voor een cursus? Beperk met deze optie het aantal deelnemers
  • Confirmation settings ⇒ Krijgt de bezoeker het standaard bevestigingsbeeld te zien of verwijs je hem door naar de homepage?

Honeypot

Een webform met bijvoorbeeld invulvakken is voor hackers en ander schorremorrie de ideale manier om in te breken in een site. We moeten deze dus best beveiligen. De ideale module hiervoor is honeypot. Honeypot zal een onzichtbaar invulveld toevoegen aan het formulier, niet zichtbaar voor de gebruiker. Robots echter zullen dit veld ook invullen bij een poging tot inbreken. Het moment dat honeypot merkt dat dit onzichtbaar veld is ingevuld, dan zal het formulier worden geblokkeerd.

  • Schakel Honeypot in op dit formulier

Opdracht

We willen een pagina creëren waar er widescreen 1 afbeelding getoond wordt, wanneer daarop wordt geklikt zal er een pdf zichtbaar en downloadbaar zijn. Met deze oefening breng ik een hele reeks vaardigheden bij elkaar. Volg chronologisch onderstaande stappen. Dit zou normaal doenbaar moeten zijn.

  1. Maak een nieuwe node aan van het type eenvoudige pagina
    1. Titel: handleiding
    2. URL: /handleiding
    3. Menu: link in het hoofdmenu
  2. Download hier de foto
  3. Plaats de foto in de body van de node, dus NIET in het afbeeldingsveld
  4. Sla op en bekijk het voorlopige resultaat
  5. Zorg ervoor dat de css regel van de frontpage enkel op de frontpage staat indien dit niet het geval zou zijn
  6. Zorg ervoor dat de paginatitel niet zichtbaar is, denk eraan dat de page title in Drupal 8 in een blok zit. De page titel is enkel onzichtbaar op de frontpage en deze node (/handleiding)
  7. Download hier de handleiding (dit is mijn eigen cursus, dit om auteursrechtelijke miserie te vermijden)
  8. Plaats deze handleiding op de server via FTP en wel in deze map: .../sites/default/files
  9. Bewerk de pagina /handleiding op jouw site
  10. Leg een link op de afbeelding naar het bestand op de server. Dit doe je door een relatieve link te leggen naar het bestand. In dit geval iets zoals: sites/default/files/naamvanhetbestand.pdf (in Drupal 8 kan je hier eenvoudig de filebrowser openen en vervolgens het bestand aanklikken)
  11. Gebruik CSS voor de volgende aanpassingen:
    1. Er mag geen bovenste balk zichtbaar zoals de menubar, logo,...
    2. De achtergrond kleur moet zwart worden, zo lijkt het één grote foto te zijn

Opmerking: ik ging dit normaal met Nivo-Slider doen, maar deze werkt nog niet op Drupal 8.

Contextuele filters

We werken les 2 af