Hoe maak je inhoudsvensters in WordPress

Een inhoudsvak is een visueel onderscheidende container waarmee je specifieke inhoud kunt omkaderen zodat deze zich onderscheidt van de rest. Het helpt je om belangrijke informatie of speciale aankondigingen te benadrukken, zodat de aandacht van gebruikers op belangrijke details wordt gevestigd.

Inhoudsvakken zijn geschikt om oproep-tot-actie secties, getuigenissen, beoordelingen en belangrijke kenmerken van producten of diensten te laten zien. Er zijn verschillende manieren om inhoudsvakken te maken in WordPress websites.

In het volgende artikel laten we je drie handige methodes zien om inhoudsvakken te maken in WordPress. Blijf bij ons tot het einde.

Method 1: Using the Columns Block

Je kunt een inhoudsvak op basisniveau maken en ontwerpen met behulp van het standaard WordPress Kolommenblok. Volg de onderstaande stappen.

Stap 01: Kolommenblok toevoegen aan de editor

Zoek de Kolom blok uit de Gutenberg blokbibliotheek door op de knop plus (+) knop en voeg het toe aan je editor.

Selecteer de kolom met één cel uit de beschikbare opties.

Stap 02: Inhoudsblokken toevoegen aan de kolom

Met het blok Kolommen kun je ook andere blokken toevoegen. Je kunt elk blok toevoegen dat je wilt om je inhoud te cureren.

Klik op de plus (+) pictogram op het kolomblok. Het zal de Gutenberg blokbibliotheek openen, waaruit u het volgende kunt kiezen en toevoegen paragraaf blok.

We zien dat we al tekst hebben toegevoegd aan het kolomblok. Daarna kun je naar wens meer blokken aan de kolommen toevoegen. Stel dat we het blok Afbeelding toevoegen.

Klik op de Kolom pictogram op de werkbalk. Druk op de plus (+) pictogram. Zoek en selecteer de Beeldblok uit de bibliotheek.

Je kunt zien dat we een afbeelding hebben toegevoegd aan het kolommenblok.

Stap 03: Het hele kolommenblok aanpassen

Selecteer de hele kolomsectie door op het kolompictogram op de werkbalk te klikken. Ga naar de Tabblad Instellingen. U kunt de Breedte van de kolom van de respectieve optie.

Ga vervolgens naar de Tabblad Stijlen. Je krijgt opties om de tekstkleur, achtergrondkleur, typografie en afmetingen van het blok aan te passen.

Als je naar beneden scrolt, krijg je meer opties om het volgende toe te voegen blokafstand en grens naar het kolommenblok.

Method 2: Using the TableBerg Plugin

TableBerg is een krachtige tabel-bouwer plugin die de standaard tabel-bouw oplossing van WordPress kan versterken. Je kunt met de plugin ook aantrekkelijke inhoudsvensters maken. Laten we eens kijken hoe je dit doet.

Stap 01: Installeer en activeer de TableBerg-plugin

Ga net als de bovenstaande methode naar Plugins > Nieuwe plug-in toevoegen. Zoek de TableBerg plugin door de naam in het zoekvak te typen. Installeer en activeren het.

Stap 02: Voeg het TableBerg-blok toe aan de editor

De plugin wordt geleverd met een blok met de naam TableBerg. Voeg het toe aan de editor.

Als je een tabel wilt maken, kun je hier het aantal rijen en kolommen definiëren, net als bij het standaard tabelblok.

Maar selecteer rij 1 en kolom 0 als we een inhoudsvak maken. Je ziet dat de lay-out meteen is gemaakt.

Stap 03: Inhoud toevoegen aan de TableBerg Box

Met TableBerg kun je verschillende soorten inhoud toevoegen aan de rijen en kolommen door inhoudsblokken toe te voegen.

Zodra je je cursor op het vakje plaatst, zie je rechtsonder de blokoptie verschijnen.

Selecteer één voor één de blokken die je aan de box wilt toevoegen om de gewenste inhoud samen te stellen. Eerst voegen we het afbeeldingsblok toe.

Vervolgens kun je zien dat we beschrijvende tekst over het product hebben toegevoegd. We hebben de Paragraaf blok hiervoor.

Tot slot hebben we een CTA-knop toegevoegd.

Stap 04: De TableBerg Box aanpassen

Je kunt elk blok dat je hebt toegevoegd aan de TableBerg box afzonderlijk aanpassen. Daarna kun je de hele TableBerg-box aanpassen en stileren.

We laten niet zien hoe je het individuele blok aanpast, omdat de tutorial dan zo lang wordt. Je kunt dit zien op onze documentatiepagina.

Selecteer het hele vak door op het TableBerg-pictogram op de werkbalk te klikken.

Op het tabblad Instellingen kun je de gewenste breedte voor het vak instellen.

Van de Tabblad Stijlenkun je de achtergrondkleur, opvulling, marge en ruimte van het vak aanpassen.

Zo kun je een contextbox maken met de TableBerg plugin.

Method 3: Using the Ultimate Blocks Plugin

Ultimate Blocks is een veelbelovende plugin voor contentmarketing met 25+ aangepaste blokken om je Gutenberg-editor krachtiger te maken. Het heeft verschillende verbluffende blokken waarmee je nog meer goed uitziende inhoudsvakken op je site kunt maken.

Stap 01: Installeer en activeer de Ultimate Blocks Plugin

Ga naar Plugins > Nieuwe plug-in toevoegen. Zoek de Ultimate Blocks plugin door de naam in het zoekvak te typen. Installeer en activeren zodra de plugin hieronder verschijnt.

Stap 02: Het gestileerde boxblok van de plugin toevoegen aan uw Gutenberg-editor

De Ultimate Blocks plugin bevat een speciaal blok met de naam Gestileerde doos om inhoudsvakken te maken. Zoek het en voeg het toe aan de editor.

Het blok biedt vier soorten vakken. Kies degene die je wilt om je bericht weer te geven. Elke box heeft een unieke set functies.

Voor de tutorial selecteren we de Feature Box.

In de feature box kun je een afbeelding, een titel en een beschrijving toevoegen. Hopelijk kun je ze zelf maken.

Stap 03: Inhoud toevoegen aan het blok

Standaard kun je met het blok één product weergeven en de kenmerken ervan beschrijven. Maar je kunt meerdere producten toevoegen en weergeven met het blok. Selecteer het kolomtype je wilt definiëren hoeveel producten je wilt weergeven.

Voeg nu inhoud toe aan de opties die u ziet in de Vormgegeven doosblok.

Je kunt zien dat we inhoud hebben toegevoegd aan het blok.

Stap 04: Het gestileerde kaderblok aanpassen en stylen

Kom naar de Tabblad Instellingen. Van de Selecteer de optie ModusJe kunt de Feature box veranderen in andere gestileerde boxen zoals hierboven getoond, zoals de notification, bordered en number box.

Daarna, vanaf de Responsieve besturingsoptiekun je de blokkering voor een bepaald apparaattype verbergen.

Ga vervolgens naar de Tabblad Stijlen. U kunt de Opvulling en Marge van het blok op dit tabblad.

Zo kun je een inhoudsvak maken met de Ultimate Blocks plugin.

Afwerknotities!

Ultimate Blocks en TableBerg zijn twee multifunctionele plugins die een revolutie teweeg willen brengen in het Gutenberg-systeem, zodat gebruikers eenvoudig geavanceerde inhoud kunnen maken.

TableBerg is nog steeds in ontwikkeling en belooft binnenkort met veel geavanceerde functies te komen. Aan de andere kant is Ultimate Blocks al een populaire plugin die gebruikt wordt door meer dan 60K websites wereldwijd.

Als je vragen hebt over deze producten, stel ze dan gerust via het commentaarvak.