Hoe maak ik een card met afbeelding, tekst en knop?

Card normaal of Card simpel?

• Card normaal: met Afbeelding bovenaan en een optionele Datum (optioneel). Voor diensten, projecten of nieuws met een foto.
• Card simpel: zonder afbeelding en datum. Voor een korte tegel met alleen tekst en een knop, eventueel met een achtergrondkleur.

Je vindt beide blokken in de blok-inserter in de groep Cards.

Stap 1: Zet kolommen klaar

Maak een sectie met zoveel kolommen als je cards wilt, bijvoorbeeld drie kolommen van 33%. Zie een sectie toevoegen en in kolommen delen.

Stap 2: Voeg in elke kolom een card toe

Klik in de eerste kolom op de + (Blok toevoegen), typ ‘card’ en kies Card normaal of Card simpel. Het bewerkvenster gaat open.

Stap 3: Vul de velden in

Afbeelding, Titel, Datum, Intro tekst

• Afbeelding: klik op Afbeelding toevoegen en kies of upload een foto. Gebruik voor alle cards in een rij foto’s in dezelfde verhouding, dan blijven ze even hoog. Zie afbeeldingen in het juiste formaat.
• Titel: kort en duidelijk, bijvoorbeeld de naam van de dienst.
• Datum (optioneel): alleen als de datum ertoe doet, zoals bij een evenement.
• Intro tekst: één of twee zinnen. Dit veld werkt als het blok Tekst.

Knoppen of de Lees meer-knop

Bij Buttons klik je op Nieuwe button toevoegen en vul je de link en de tekst in, net als in het blok Knoppen. Zie een knop toevoegen.

Wil je geen knop in de card? Zet dan Lees meer knop verbergen aan. Doe dat altijd als je geen eigen knop toevoegt; anders verschijnt er een knop ‘Lees meer’ die niet naar de goede pagina gaat.

Stap 4: Kies de achtergrondkleur

Bij Kleur kies je een achtergrondkleur voor de card uit je huisstijl. Laat je hem leeg, dan krijgt de card de standaardstijl van je website. Een gekleurde card valt op tussen witte cards; gebruik dat voor je belangrijkste aanbod.

Klaar met de eerste card? Klik op Klaar. Selecteer de kolom en kies bij de drie puntjes Dupliceren. Pas in de kopie alleen de afbeelding, titel, tekst en link aan. Zo zijn alle cards gelijk opgebouwd. Zie een blok of kolom kopiëren.

De hele card is klikbaar

Een bezoeker hoeft niet precies op de knop te klikken: een klik ergens op de card opent de link van de eerste knop. Zet de belangrijkste link daarom als eerste knop. Hoe je dat ook bij een kolom doet, lees je in een kolom of card helemaal klikbaar maken.

Even hoge cards

Hebben je cards verschillend veel tekst, dan worden ze ongelijk hoog. Maak ze even hoog met de sectie: selecteer de sectie, open Uitlijning instellingen en kies bij Uitlijning van kolommen de optie Uitrekken. Meer daarover in kolommen uitlijnen en even hoog maken.

Cards met berichten of pagina’s? Gebruik Uitlichten

Wil je cards van je nieuwste blogberichten, of van al je dienstpagina’s, die vanzelf bijwerken? Maak ze dan niet met de hand, maar gebruik het blok Uitlichten. Zie berichten of pagina’s automatisch tonen. Wil je een hele kolom met verschillende blokken erin als card tonen? Zie een kolom als card.

Lukt het niet?

• Er staat een Lees meer-knop die nergens heen gaat. Voeg een eigen knop toe bij Buttons, of zet Lees meer knop verbergen aan.
• De cards zijn niet even hoog. Zet de sectie op Uitrekken en gebruik foto’s in dezelfde verhouding.
• Er staat een grijs vlak in plaats van een foto. Bij Card normaal is geen Afbeelding gekozen. Kies er een, of gebruik Card simpel.
• Een klik op de card gaat naar de verkeerde pagina. De card volgt de eerste knop. Zet de goede link als eerste.
• Kom je er niet uit? Neem contact met ons op.

Veelgestelde vragen