CSS: testimonial ​

div[class~="instui-testimonial"] — Weergave van citaat of getuigenis met bronvermelding en optionele afbeelding.

✅ Gebruik Testimonial wanneer:

  • Toon klant- of gebruikersgetuigenissen en citaten

  • Je wilt een uitspraak visueel benadrukken

  • Bronvermelding en context (naam, functie, afbeelding) zijn belangrijk 🚫 Gebruik Testimonial niet wanneer:

  • Inline citaten in lopende tekst weergeven — gebruik in plaats daarvan een blockquote-element

  • De uitspraak is de hoofdzaak — gebruik in plaats daarvan Hero of Card

Toegankelijkheid ​

  • Gebruik <blockquote> semantisch voor het citaat
  • Zorg dat de bronvermelding duidelijk is en gekoppeld aan het citaat
  • Als je afbeeldingen gebruikt, geef alternatieve tekst op

Gebruik ​

css
@import "@pantoken/plugin-layouts/layouts.css";

Voorbeelden ​

Onderdelen ​

OnderdeelBeschrijving
.instui-authorNaam van de bronvermelde auteur.
.instui-avatarOptionele profielfoto van de auteur.
.instui-contentContainer voor citaat en bronvermelding.
.instui-quoteDe geciteerde tekst.
.instui-titleOptionele functie of affiliatie van de auteur.

Staten ​

ToestandBeschrijving
:optional—

Gebruikte tokens ​

TokenTypeWaarde
--instui-color-background——
--instui-color-primary——
--instui-color-surface——
--instui-color-text-primary——
--instui-color-text-secondary——
--instui-font-size-small<length>—
--instui-font-weight-semibold——
--instui-radius-medium——
--instui-space-large——
--instui-space-medium——
--instui-space-small——

Gerelateerd ​