Hoe maak je een competitietabel in WordPress

Een sportcompetitietabel is gemaakt om de stand van teams en atleten in een sportcompetitie beknopt weer te geven. Het dient als een visueel hulpmiddel waarmee mensen de voortgang van hun favoriete teams en spelers kunnen volgen.

Als je een sportportaal runt of artikelen en accessoires verkoopt, wil je misschien competitietabellen maken. Dit artikel legt je uit hoe je een ranglijst kunt maken in WordPress met een gedetailleerde maar eenvoudige tutorial.

Maak prachtige tafels
Met blok-editor

Stap 01: Installeer en activeer de TableBerg-plugin

TafelBerg is een plugin voor het maken van geavanceerde tabellen. Zonder zo'n geavanceerde tool kun je geen uitgebreide competitietabellen maken met alleen het standaard WordPress tabellenblok.

Ga naar Plugins > Nieuwe plug-in toevoegen. Haal de plugin op door te typen TafelBerg in het zoekvak. Installeer en activeer het nadat het hieronder wordt weergegeven.

Installeer en activeer de TableBerg plugin

Stap 02: Voeg het TableBerg Blok toe aan uw Post/Page Editor

Open het bericht/de pagina waar je de ranglijst wilt maken. Zoek en het TableBerg-blok toevoegen door op de (+) pictogram.

Voeg het TableBerg-blok toe aan je bericht of pagina

Definieer het rij- en kolomnummer naar wens. Voor deze tutorial selecteren we het rij- en kolomnummer 6*11.

Stel het rij- en kolomnummer in

De lay-out van de tabel is klaar. Vervolgens voegen we er inhoud aan toe.

Tabelopmaak gemaakt door TableBerg

Stap 03: Inhoud aan de tabel toevoegen

Het type inhoud dat je toevoegt aan de tabel hangt grotendeels af van het sporttype. De inhoud voor een eredivisietabel is gewoonlijk positie, clublogo, clubnaam, gespeelde wedstrijd, doelsaldo, en punten.

# Positie definiëren (Pos)

Het team met meer punten blijft meestal hoger in het klassement. Deze sectie komt in de meest linkse kolom van een tabel. Je kunt zien dat we deze kolom in de tabel hebben gemaakt.

# Logo en clubnamen toevoegen

We willen de clubnaam en het logo onder dezelfde kolomtitel brengen. De volgende twee bovenste kolomcellen moeten dus worden samengevoegd. Selecteer ze door op Shift + rechts klikken (Windows) of CMD + rechts klikken (Mac).

Selecteer vervolgens Samenvoegen van de Tabel bewerken optie op de werkbalk. Bekijk de video hieronder. Daarna hebben we de titel centraal uitgelijnd.

Elke cel wordt geleverd met een Gutenberg-blok. Door op de (+) pictogramkun je andere soorten inhoud aan de tabel toevoegen. Voor logo's selecteren we de beeldblok.

Logo's toevoegen aan de tabel met TableBerg

Je kunt zien dat we clublogo's hebben toegevoegd aan de tabel. Geen zorgen als de geüploade afbeeldingen groot zijn. Met TableBerg kun je ze aanpassen door ze te slepen.

Clublogo's toegevoegd aan de competitietabel met TableBerg

Voeg vervolgens respectievelijk clubnamen toe naast de logocellen.

Clubenamen toevoegen aan de competitietabel

# Voeg gespeeld wedstrijdnummer, doelpuntenverschil en punten toe

Dit is eenvoudig. Net als bij de positie kun je ook hier het aantal gespeelde wedstrijden, het doelsaldo en het aantal punten van elke club toevoegen, met platte tekst. Je kunt zien hoe we dat in de onderstaande afbeelding hebben gedaan.

Voeg gespeeld wedstrijdnummer, doelpuntenverschil en punteninformatie toe aan de tabel

Stap 04: De tafel stylen

Met Tableberg kunt u verschillende niveaus van stilering en aanpassing aan uw tabel toevoegen. Met de Gutenberg werkbalk kunt u de uitlijning aanpassen en durf van de inhoud op de tabel.

Je kunt zien dat we de meeste inhoud op de tabel centraal hebben uitgelijnd en vetgedrukt.

Vervolgens kunt u de tekst- en achtergrondkleur, typografie, lettergrootte, en tabelafmeting in de rechter zijbalk. Ik hoop dat je ze zelf kunt doen.

Uitlijning en vetgedrukte tekst van de tabel aanpassen

Stap 05: De tabelbreedte en rijenkleuren wijzigen

Als je veel inhoud hebt, wil je misschien de breedte van de tabel vergroten. Selecteer de hele tabel door op de TableBerg pictogram driemaal achter elkaar op de werkbalk.

De Tabblad Instellingen verschijnt op de rechterzijbalk, waar u de Tabel Breedte optie. Je kunt de breedte van de tabel vergroten door de waarde hier in te stellen.

Vergroot de breedte en de kleur van de rijen in de tabel

Kom naar de Tabblad Stijlen. Direct daaronder krijg je opties om de achtergrondkleur van de kolommen in de even en oneven rijen te wijzigen. Doe het zelf.

De ranglijst inkleuren

Zo kun je een ranglijst maken in WordPress.

Eindnoot!

Sportminnende mensen zijn altijd graag op de hoogte van de updates van hun favoriete teams en spelers. Je kunt een tabel maken in WordPress en de links delen op sociale media zodat mensen je site komen verkennen.

Je kunt op dezelfde manier tabellen maken voor e-commerce producten met deze plugin. Leer hoe maak je een productvergelijkingstabel met TableBerg.



Het Tableberg-team

Early Bird-aanbieding is nu live!
Dit is de standaardtekst voor de meldingsbalk