Skip to main content
blanco lijstje op tafel

Gek op lijstjes

Ben je dol op lijstjes? Maak je regelmatig een to-do-list? Lijstjes zijn heel handig voor je website en die zie je overal in verschillende vormen terugkomen. We zijn gek op lijstjes. Alle voordelen of kenmerken op een rijtje. Een opsomming is snel te scannen en daarom is het aantrekkelijk. Het is makkelijker en sneller dan een hele tekst lezen.

Je maakt eenvoudig zelf een lijstje met het List-element en je kunt het in verschillende situaties gebruiken. Ik illustreer het met een paar voorbeelden.

Allereerst natuurlijk voor een opsomming, dus daar begin ik mee.

Opsomming met linkjes

Hoe maak je een lijstje? Binnen YOOtheme, het thema dat ik in gebruik, is daar een element voor, net als een element voor tekst of een titel. Hierboven heb ik al een opsomming gemaakt met linkjes. Als je op tarieflijst klikt, wordt je gelinkt naar een ander deel op de pagina.

Je gaat via de Bouwer naar de pagina die je wilt bewerken. Je voegt het List-element toe, deze vind je bij de Multiple items. Vervolgens ga je Items toevoegen. Bij elke Item kun je een Link toevoegen. Dit kan een andere pagina zijn op je website, of een andere website, maar ook naar een sectie iets verder op de pagina. Hiervoor zet je een ankertje bij de sectie. De sectie geef je een unieke naam en bij de Link herhaal je de unieke naam en zet er # voor, dit wordt dan #uniekenaam. Je kunt het ankertje ook bij een titel zetten zoals ik in de opsomming hierboven gedaan. De naam van het ankertje vul je in bij Geavanceerd > ID.

Pakketten vergelijken

Je hebt een aanbod of abonnement waarbij klanten kunnen kiezen uit een Basis-pakket, een Meest-gekozen pakket en een Premium-pakket (het meest luxe en uitgebreide pakket). Deze pakketten zet je naast elkaar, zodat je klant goed kan vergelijken.

Je gaat via de Bouwer naar de pagina die je wilt bewerken. Je voegt het List-element toe, deze vind je bij de Multiple items. Je maakt eerst het meest uitgebreide en luxe pakket. Je gaat alle Items toevoegen. Bij Instellingen kies je een Icoon en een Icoon Kleur. Dit Icoontje komt dan voor alle items te staan.

Vervolgens kopieer je het element en versleept het naar de naastliggende kolom. Dit wordt het Meest gekozen pakket. Je gaat dan naar de Items toe die aangepast moeten worden. Klik door op het Item en kies een Icoon en Icoon kleur. Alleen dit Item wordt dan aangepast. Handig hè? Vervolgens kopieer je dit List-element weer en past weer een paar Items aan.

Basis


  • Meer dan 10 miljoen nummers

  • Podcasts

  • Eigen playlist maken

  • Advertentievrije muziek

  • De hoogste muziekkwaliteit

Meest gekozen


  • Meer dan 10 miljoen nummers

  • Podcasts

  • Eigen playlist maken

  • Advertentievrije muziek

  • De hoogste muziekkwaliteit

Premium


  • Meer dan 10 miljoen nummers

  • Podcasts

  • Eigen playlist maken

  • Advertentievrije muziek

  • De hoogste muziekkwaliteit

Tarieflijst

Voor dit voorbeeld gebruik ik het Description List-element. Het Description List-element is vergelijkbaar met het List-element. Hier zit een heel mooie en handige optie in voor het presenteren van je tarieven op je website. Denk bijvoorbeeld aan een kapsalon met verschillende behandelingen. Door de puntjes tussen de items en het tarief leest het een stuk makkelijker.

Je gaat via de Bouwer naar de pagina die je wilt bewerken. Je voegt het Description List-element toe, deze vind je bij de Multiple items. Vervolgens ga je Items toevoegen. Voeg Items toe en zet in Titel de omschrijving van de behandeling en bij Meta het tarief

Klaar met Items toevoegen? Ga dan naar Instellingen en kies bij Lijst > Ontwerp 2 Column Grid (Meta only) en bij Titel > Raster Breedte > Expand en zet een vinkje bij Een leider toevoegen en tadaa… Bij Meta > Stijl kun je de opmaak van de tarieven aanpassen.

  • Knippen
    EUR 25,-
  • Kleuren
    EUR 40,-
  • Wassen en föhnen
    EUR 20,-

Je kunt ook iets aan de leesbaarheid doen door te kiezen voor Striped voor afwisselend wit of grijs gestreepte achtergrond of Divider met lijn ertussen. Deze optie vind je bij Instellingen > Lijst > Stijl Striped voor afwisselend wit of grijs gestreept of Divider met lijn ertussen. Dit kan bij zowel het List-element als het Description List-element.

  • Dit is een opsomming met de optie Striped

  • Dit is een opsomming met de optie Striped

  • Dit is een opsomming met de optie Striped

  • Dit is een opsomming met een lijn (Divider) ertussen.

  • Dit is een opsomming met een lijn (Divider) ertussen.

  • Dit is een opsomming met een lijn (Divider) ertussen.

Contactgegevens en openingstijden

Er zijn zoveel icoontjes waar je uit kiezen, dus leef je uit. Maarrr, maak het niet te bont, want dan is het niet meer overzichtelijk!

  • Bedrijfsnaam
  • Adres
    Postcode Plaats
  • Telefoon
  • E-mail

De openingstijden kun je maken met het Description List-element. Ook hier kun je net als bij de tarieflijst de openingstijden invullen bij Meta in elk Item.

Openingstijden

We zijn geopend van dinsdag t/m zaterdag.
Vrijdagavond koopavond.

  • Maandag
    Gesloten
  • Dinsdag
    9.00 – 18.00 uur
  • Woensdag
    9.00 – 18.00 uur
  • Donderdag
    9.00 – 18.00 uur
  • Vrijdag
    9.00 – 21.00 uur
  • Zaterdag
    9.00 – 17.00 uur
  • Zondag
    Gesloten

Met deze tips ga je met plezier een lijstje maken op je website. Heb je vragen? Stuur gerust een berichtje om te kijken wat ik voor jou kan betekenen. Ik help je graag!