Ga naar inhoud

Opmaak en bouwstenen

Alle bouwstenen die je in deze handleiding kunt gebruiken, elk met de Markdown die hem maakt. Klik op Markdown om de bron te zien; alle tabbladen op deze pagina schakelen dan tegelijk om.

Tekst

Tekst kan vet, cursief, gemarkeerd, onderstreept of doorgehaald zijn. Een knopnaam zet je vet: klik op Afrekenen. Iets wat je letterlijk typt, zet je tussen backticks: typ NL004495445B01.

Tekst kan **vet**, *cursief*, ==gemarkeerd==, ^^onderstreept^^ of ~~doorgehaald~~ zijn.
Een knopnaam zet je **vet**: klik op **Afrekenen**. Iets wat je letterlijk typt, zet je tussen
backticks: typ `NL004495445B01`.

Een nieuwe alinea begint na een lege regel. Eén enkele regelovergang in de tekst doet niets: je mag je zinnen dus gewoon over meer regels verdelen.

Koppen

De titel van de pagina is een kop met één #; die heeft elke pagina precies één keer. Daaronder gebruik je ## voor de onderdelen en ### voor de stukken daarin. Die koppen vormen de inhoudsopgave rechts op deze pagina.

# Titel van de pagina

## Onderdeel

### Stuk van een onderdeel

Lijsten

Stappen, genummerd:

  1. Ga naar Aanbod.
  2. Klik op Inschrijven.
  3. Klik op Boeken & Betalen.

Een opsomming:

  • EHBO
  • BHV
  • Reanimatie & AED

Een afvinklijst:

  • Plek in het mandje
  • Voucher toegepast
  • Afgerekend
1. Ga naar **Aanbod**.
2. Klik op **Inschrijven**.
3. Klik op **Boeken & Betalen**.

- EHBO
- BHV
- Reanimatie & AED

- [x] Plek in het mandje
- [x] Voucher toegepast
- [ ] Afgerekend

Zet een lege regel vóór een lijst, anders ziet MkDocs hem als gewone tekst.

Tabellen

Soort Duur Prijs
EHBO Basis 2 dagen € 85,00
BHV Basis 4 dagen € 595,00
Reanimatie & AED Herhaling 3 uur € 45,00
| Soort | Duur | Prijs |
| --- | :---: | ---: |
| EHBO Basis | 2 dagen | € 85,00 |
| BHV Basis | 4 dagen | € 595,00 |
| Reanimatie & AED Herhaling | 3 uur | € 45,00 |

De dubbele punten in de tweede regel bepalen de uitlijning: :---: centreert, ---: lijnt rechts uit (handig voor bedragen).

Meldingen

Een melding (admonition) haalt iets uit de lopende tekst. Kies het soort dat past:

Goed om te weten

Een opmerking bij de tekst.

Tip

Een handigheidje. Zonder eigen titel staat er de naam van het soort.

Informatie

Achtergrond die niet iedereen nodig heeft.

Gelukt

Zo ziet het eruit als het goed gaat.

Let op

Iets waar mensen vaak over struikelen.

Pas op

Iets wat niet terug te draaien is.

!!! note "Goed om te weten"

    Een opmerking bij de tekst.

!!! tip

    Een handigheidje. Zonder eigen titel staat er de naam van het soort.

!!! info "Informatie"

    Achtergrond die niet iedereen nodig heeft.

!!! success "Gelukt"

    Zo ziet het eruit als het goed gaat.

!!! warning "Let op"

    Iets waar mensen vaak over struikelen.

!!! danger "Pas op"

    Iets wat niet terug te draaien is.

Er zijn er nog meer: abstract, question, failure, bug, example en quote. De tekst in een melding springt vier spaties in.

Inklapbaar

Met ??? in plaats van !!! is de melding ingeklapt; met ???+ staat hij open maar kan hij dicht. Goed voor een vraag met antwoord, of voor details die niet iedereen hoeft te lezen.

Kan ik me voor twee bijeenkomsten tegelijk inschrijven?

Ja. Zet ze allebei in je winkelmandje en reken ze in één keer af.

Voorbeeld van een voucher

Een voucher van € 50,00 op een inschrijving van € 85,00: je betaalt nog € 35,00.

??? question "Kan ik me voor twee bijeenkomsten tegelijk inschrijven?"

    Ja. Zet ze allebei in je winkelmandje en reken ze in één keer af.

???+ example "Voorbeeld van een voucher"

    Een voucher van € 50,00 op een inschrijving van € 85,00: je betaalt nog € 35,00.

Tabbladen

Tabbladen zijn handig als iets anders werkt op de telefoon dan op de computer, of voor een deelnemer dan voor een beheerder. Deze hele pagina gebruikt ze ook.

Het menu staat altijd links in beeld.

Tik op linksboven om het menu te openen.

=== "Op de computer"

    Het menu staat altijd links in beeld.

=== "Op de telefoon"

    Tik op :material-menu: linksboven om het menu te openen.

Tabbladen met dezelfde titel schakelen samen om, op de hele pagina. Probeer maar: klik hier op Markdown en scrol omhoog.

Codeblokken

Voor tekst die iemand letterlijk moet overnemen: een opdracht, een stuk configuratie. Rechtsboven in elk codeblok staat een kopieerknop.

De site lokaal bekijken
1
2
3
cd src/EventOps.Help
source .venv/bin/activate
mkdocs serve
```bash title="De site lokaal bekijken" linenums="1" hl_lines="3"
cd src/EventOps.Help
source .venv/bin/activate
mkdocs serve
```

Na de drie backticks komt de taal (bash, yaml, markdown, text), daarna eventueel een titel, regelnummers en regels die oplichten.

Annotaties in een codeblok

Een genummerde toelichting bij een regel: zet # (1)! achter de regel, en onder het codeblok een genummerde lijst.

nav:
  - Deelnemers:                     # (1)!
      - deelnemers/index.md         # (2)!
  1. Een groep in het menu.
  2. De eigen pagina van de groep.
```yaml
nav:
  - Deelnemers:                     # (1)!
      - deelnemers/index.md         # (2)!
```

1.  Een groep in het menu.
2.  De eigen pagina van de groep.

Toetsen

Druk op Ctrl+F om te zoeken op de pagina, of op Enter om te bevestigen.

Druk op ++ctrl+f++ om te zoeken op de pagina, of op ++enter++ om te bevestigen.

Iconen

Er zijn duizenden iconen, van Material Design en van GitHub (Octicons). Zoek ze in de iconenzoeker van MkDocs Material en zet de naam tussen dubbele punten.

Winkelmandje · Mijn evenementen · Certificaten · E-mail · in de EventOps-kleur

:material-cart: Winkelmandje · :material-calendar-check: Mijn evenementen ·
:material-certificate: Certificaten · :octicons-mail-16: E-mail ·
:material-check-circle:{ style="color: #1ab394" } in de EventOps-kleur

Iconen wel, emoji niet

Gebruik alleen iconen (:material-…: en :octicons-…:): die zitten in de site zelf. Emoji zoals :smile: worden van een andere website geladen, en dat doen we niet.

Knoppen

Een link die eruitziet als een knop, voor de belangrijkste stap op een pagina.

[Naar het aanbod](../deelnemers/aanbod.md){ .md-button .md-button--primary }
[Meer over afrekenen](../deelnemers/afrekenen/index.md){ .md-button }

Kaarten

Een raster van kaarten, zoals op de startpagina. Goed als overzicht aan het begin van een deel.

  • Winkelmandje


    Wat je gekozen hebt en nog moet afrekenen.

  • Certificaten


    De certificaten die je hebt behaald.

<div class="grid cards" markdown>

-   :material-cart:{ .lg .middle } __Winkelmandje__

    ---

    Wat je gekozen hebt en nog moet afrekenen.

-   :material-certificate:{ .lg .middle } __Certificaten__

    ---

    De certificaten die je hebt behaald.

</div>

Begrippen uitleggen

Een lijst met begrippen en hun uitleg:

Bijeenkomst
Een evenement op een bepaalde datum en plaats, waarvoor je je inschrijft.
Groepsboeking
Een aantal plekken dat een organisatie in één keer boekt, voor haar eigen mensen.
Bijeenkomst
:   Een evenement op een bepaalde datum en plaats, waarvoor je je inschrijft.

Groepsboeking
:   Een aantal plekken dat een organisatie in één keer boekt, voor haar eigen mensen.

Afkortingen

Ga met de muis op BTW, KVK, VIES of EHBO staan: de uitleg verschijnt vanzelf. Dat komt uit één bestand, includes/afkortingen.md, dat aan elke pagina wordt toegevoegd. Een nieuwe afkorting zet je daar:

includes/afkortingen.md
*[BTW]: Belasting over de toegevoegde waarde (omzetbelasting)
*[KVK]: Kamer van Koophandel

Voetnoten

Een plek in het winkelmandje wordt 24 uur vastgehouden.1

Een plek in het winkelmandje wordt 24 uur vastgehouden.[^1]

[^1]: Een bestelling die op een bankoverschrijving wacht, wordt niet na 24 uur losgelaten.

De voetnoot zelf mag overal op de pagina staan; hij komt altijd onderaan terecht.

- Naar een andere pagina: [Inschrijven](../deelnemers/inschrijven.md)
- Naar een kop op een andere pagina: [de BTW-controle](../deelnemers/afrekenen/zakelijk.md#hoe-we-het-btw-nummer-controleren)
- Naar een kop op deze pagina: [Tabbladen](#tabbladen)
- Naar een website: [VIES](https://ec.europa.eu/taxation_customs/vies/)
- Een e-mailadres: [support@qtopia.nl](mailto:support@qtopia.nl)

Het anker van een kop is de kop in kleine letters, met streepjes in plaats van spaties. Het makkelijkst: ga op de kop staan, klik op het ¶-teken en kopieer het adres.


  1. Een bestelling die op een bankoverschrijving wacht, wordt niet na 24 uur losgelaten. ↩