Als je op zoek bent naar een handleiding voor het maken van flipboxen in WordPress, dan hebben we een uitgebreide handleiding voor je.
Wat je nodig hebt, is volgen hoe je er zelf een kunt maken. Maar laten we eerst wat meer leren over flip boxes.
Wat is een Flip box in WordPress?
A flipbox in WordPress is een interactief inhoudselement dat tekst en afbeeldingen combineert met een flippend animatie-effect.
Het heeft meestal twee kanten. Het wordt vaak gebruikt om tekst op een creatieve manier te presenteren in combinatie met een betoverend flip-effect.
Mensen voegen flipboxen toe omdat ze een aantrekkelijk en interactief element zijn dat sterk wordt aanbevolen om de aandacht van bezoekers onmiddellijk te trekken.
Laten we nu eens kijken naar enkele andere scenario's met betrekking tot Flip boxes.
Maak prachtige tafels
Met blok-editor
Waarom Flip Boxes gebruiken in WordPress Websites?
Flip boxes zijn een krachtig ontwerpelement dat je WordPress-inhoud op verschillende manieren kan verbeteren. Hier lees je waarom ze het waard zijn om te gebruiken:
- Aandacht trekken: Flip boxes trekken de aandacht van bezoekers als een magneet en wekken nieuwsgierigheid op, waardoor ze worden aangemoedigd om verder te verkennen.
- Belangrijke informatie markeren: Met flipboxen kun je belangrijke details precies op de voorkant presenteren en uitleg of verdere details op de achterkant bieden, waardoor de inhoud uitgebreider wordt.
- Presenteer Conentent Elegant: Met flipboxen kun je je inhoud op een elegante manier presenteren. In plaats van gewone tekst of statische vakken, bieden flip boxes een stijlvolle manier om diensten, teamprofielen, CTA's, enz. te presenteren.
Nu je een aantal voordelen hebt geleerd van het gebruik van flipboxen op je website, gaan we naar onze belangrijkste tutorial hieronder.
Hoe maak je flipboxen in WordPress
Omdat WordPress geen kernblok heeft om een flipbox te maken, gebruiken we een plugin van derden genaamd Flipbox.
Flipbox heeft een verzameling coole plugin CSS3-effecten om flipboxen aantrekkelijker te maken. Het werkt met elke paginabouwer en is standaard responsive.
Stap 1: Installeer de Flipbox
De eerste stap is het installeren van de Flipbox plugin door in te loggen op het dashboard van je website. Navigeer vervolgens naar Plugins (1) > Nieuwe plug-in toevoegen (2). Zoek op Flipbox (3) en de plugin installeren (4).
Vergeet niet om de plugin te activeren na de installatie.
Stap 2: Maak uw flipboxen
Klik nu op Flip Box (1) en Nieuw maken daarna (2).
Selecteer een stijl die je leuk vindt op de pagina en klik op "Stijl creëren". Als je naar beneden scrolt, zie je verschillende stijlen.
Geef een naam naar je flipbox (1)en selecteer de layoutnummer. De lay-outs zijn in de Stijlen die je eerder hebt gezien (Elke stijl heeft drie lay-outs). Klik ten slotte op de Sla knop (3).
Stap 3: Je Flip Box aanpassen
Alle opties zijn bedoeld om aan te passen. Pas ze aan volgens je behoeften. Hieronder zie je een voorbeeld op dezelfde pagina.
Selecteer de "Open Flip Boxes Van". knop om je inhoud in te voegen.
Voer de Titel voorkant (1) en Pictogram voorkant (2)en klik ten slotte op Afbeelding uploaden om een afbeelding voor de voorkant te uploaden (3).
Scroll naar beneden op dezelfde pagina en voer de Info achterkant of gedetailleerde tekst van de inhoud (1) en de Knoptekst achterkant (2). U kunt ook de knoplink als je wilt (3). Daarna moet je een afbeelding instellen voor de achtergrondafbeelding van de achterkant door te klikken op de knop "Afbeelding uploaden” (4).
Nadat je alles hebt ingesteld, druk je op de knop "Stuur in" knop (1).
U kunt voeg meer flipboxen toe als je wilt. Ik wil volgen de "Stap 3" richtlijnen herhaaldelijk om meer flipboxen toe te voegen aan de huidige flipbox.
U kunt ook bewerken of verwijderen je flipboxen ook. Je kunt de opties zien door met je cursor naar de flipboxen te gaan.
Na alle bewerkingen en aanpassingen klikt u op "Item per rij” (1) om aan te geven hoeveel flipboxen je per keer per rij wilt weergeven. Ik heb drie items geselecteerd omdat ik drie items per rij wil weergeven. Druk nu op de knop Stuur in knop (2).
Daarna moet je je Flip Box opslaan. Klik gewoon op de knop Opslaan (1).
Stap 4: De Flip Box Shortcode invoegen
Ga naar Flip Doos (1) en kopieer de shortcode (2).
Ga naar je berichten of pagina's waar je de flipbox wilt weergeven. Navigeer daarvoor naar Berichten (1) > Alle berichten (2) en die post of pagina bewerken (3). N.B. Hetzelfde geldt voor het bewerken van een pagina, maar dan moet je naar Pagina's > Alle pagina's eerst.
Om de flipbox in te voegen, moet je de Shortcode blokKlik op het pictogram "+" (Pictogram blok toevoegen) in de editor (1) en typ "Shortcode" in het zoekvak (2). Klik op de "Shortcode". om het in de editor in te voegen(3).
Plak nu de shortcode (1) en je bericht of pagina opslaan of publiceren.
Hieronder zie je de demo.
Laatste gedachten!
Het maken van flipboxen in WordPress is een eenvoudige manier om het ontwerp en de betrokkenheid van je website te verhogen. Flipboxen zijn een eenvoudige toevoeging die een blijvende indruk kunnen achterlaten op je publiek.
Als je deze stappen volgt, kun je gemakkelijk dynamische en visueel aantrekkelijke elementen integreren die er professioneel uitzien en die de interactie tussen bezoekers en je inhoud verbeteren.
Ik hoop dat de richtlijnen makkelijk te volgen waren. Maar als je problemen hebt ondervonden, laat het me dan weten in het commentaargedeelte hieronder. Ik help je graag verder.
Vergeet ook niet om de tutorial te delen met je vrienden via sociale media.
Meer lezen
- Hoe voeg je op 2 eenvoudige manieren een beoordelingsvak toe aan WordPress berichten/pagina's?
- Een tabelkop sticky maken in WordPress (3 eenvoudige stappen)
- Hoe de hoverkleur van een knop wijzigen in WordPress in 3 eenvoudige stappen
- Een responsieve tabel maken in WordPress
- Zo voeg je een Toggle-knop toe aan je WordPress website
