What is the Flipbox widget in Master Addons?

It is an Elementor widget that builds a two-sided card. The front face shows an icon, title, and description, and on hover it flips to a back face with its own text and a button. Everything is set from the Elementor panel with no code.

How many flip animations does the Flipbox widget have?

The Animation Style dropdown includes more than thirty effects, such as Flip Horizontal, Flip Vertical, Fade, Fade Up, Rollover, 3d Flip, the Cube variants, slide directions, and Diagonal. You pick one per card to control how the back face appears.

Can I add a button to the flip card?

Yes. The Action Button section in the Content tab sets the button label and its link. The button sits on the back face, so it shows when the card flips, which makes it a natural place to send visitors to a product or form.

Can I use an image instead of an icon on the front?

Yes. In the Front Box section, switch the Icon Style so you can choose an image instead of a library icon. The Style tab also lets you set a background image for either face, so image-led flip cards are easy to build.

How do I keep both sides of the flip card the same size?

Set the Flip Box Height in the General section of the Style tab. It gives both faces one fixed height, so the card stays the same size before and after the flip instead of resizing to fit each side's content.

Elementor Flipbox Widget: 3D Flip Card Animationer

Et kort, der vender om på hover, viser det dobbelte af indholdet i samme rum. Den Flipbox widget i Master Addons til Elementor giver dig en tosidet boks: en forside med et ikon, titel og beskrivelse og en bagside, der vender til syne med sin egen tekst og en knap.

Du vælger en animation, udfylder begge ansigter, tilføjer en knap, og derefter style hver side. Der er over tredive flip effekter, fra en almindelig Fade til en fuld 3D Cube. Denne guide går gennem hver indstilling i widget.

Færdige Elementor flip-kort bygget med Master Addons Flipbox-widget, der viser en billedboks, en rød frontboks med et ikon og en beskrivelse og et almindeligt kort

Hvad Flipbox-widgetten gør #

Widgetten bygger et flip-kort fra to ansigter. Den Front Box er, hvad besøgende ser først: et ikon eller billede, en titel og en beskrivelse. Hold markøren over det, og kortet vender til Back Box, som har sin egen titel, beskrivelse, og en knap, der kan linke hvor som helst.

Tre faner kører det hele. Content holder animationen, for- og bagteksten og knappen. Style håndterer boksens højde, kanter, farver og typografi for hvert ansigt. Advanced er den sædvanlige Elementor-afstand og synlighed.

Før du starter #

WordPress med Elementor installeret og aktiv.
Master Addons til Elementor installeret og aktiv. Ny i plugin'et? Se den installationsvejledning.
Teksten og ikonerne for begge ansigter og linket til bagsiden.

Sådan tilføjes Flipbox-widget #

I Elementor-editoren skal du åbne Elementer panel og søg efter Flipbox, eller rul til afsnittet Mastertilføjelser (widgetsene bærer et lilla MA-badge). Træk det over på siden, og det indlæses med en prøve foran og bagpå, du kan redigere.

Flipbox-widget i panelet Elementorelementer, der trækkes ind på siden

Indstil animationsstilen #

Åbn Content fane. Den Stilforudindstilling sektion holder Designvariation og the Animation Style, og under den sidder sektionerne Front Box, Back Box og Action Button.

Flipbox-indholdsfanen med sektionen Stilforudindstilling, der viser designvariation og animationsstil, plus sektionerne Frontboks, Back Box og Action Button

The Animation Style dropdown er den sjove del. Det bærer over tredive muligheder, så det samme kort kan vende, fade, glide, eller terning sin vej til bagsiden.

Flipbox Animation Style dropdown åben, der viser Flip Horizontal, Flip Vertical, Fade, Cube varianter, 3d Flip, Diagonal, og Fade In Out

Flip Vandret og Flip Lodret: det klassiske kort flip på hver akse.
Terning (Top Down, Down Top, Venstre, Højre): en 3D-terning rotation mellem flader.
3d Flip, Fade, Fade Up, Rollover: blødere afslører, når du vil have noget subtilt.
Slide retninger og Diagonal: skub bagsiden ind fra en side eller et hjørne.

Sæt frontboksen op #

Åbn Front Box sektion. Det er det ansigt, folk ser, før de svæver, så det skal tjene flip.

Flipbox Front Box sektion med Icon Style, en ikonvælger, Titel, Beskrivelse, Justering og Titel HTML Tag felter

Ikon stil og ikon: vælg et ikon fra biblioteket, eller skift det til et billede.
Titel og Beskrivelse: den forreste overskrift og tekst, hver med en Write with AI-mulighed.
Justering og titel HTML Tag: juster indholdet, og indstil overskriftsniveauet (H1 til H6).

Sæt bagkassen op #

Åbn Back Box sektion til ansigtet, der vender til syne. Det tager de samme felter som forsiden, så en kort teaser ude foran kan føre til den virkelige detalje på bagsiden.

Flipbox Back Box-sektion med ikon-, titel- og beskrivelsesfelter og lærredet, der viser en lilla bagside med Introducing Flexibility og en Kom godt i gang-knap

Ikon: et separat ikon til bagsiden.
Titel og Beskrivelse: bagsiden og tekst.
Justering og HTML Tag: layout og overskriftsniveau for bagsiden.

Tilføj handlingsknappen #

The Action Button sektion bor på bagsiden. Indstil etiketten, og hvor den peger, så en svæve kan føre direkte til et produkt, en formular eller en anden side.

Flipbox Action Button sektion med et knaptekstfelt indstillet til Kom godt i gang og et link til felt

Knaptekst: mærket, som Kom i gang eller Lær mere.
Link til: den URL, knappen åbner, med de sædvanlige Elementor-linkmuligheder.

Style flipkortet #

Åbn Style fane. Den General afsnittet sætter grænsen og den indstilling, der betyder mest her, den Flip Box Højde, hvilket giver begge ansigter én fast størrelse.

Flipbox Style-fanen Generelt afsnit med Border Type, Border Width, Border Color, Border Radius og Flip Box Height indstillet til 250

Under General bliver man adskilt Front Box og Back Box sektioner. Hver har sin egen baggrundsfarve eller billede, titel og beskrivelse farver, typografi, og ikon farve, så de to ansigter kan se intet ens, hvis du vil.

Flipbox Style-fanen Front Box sektion med Baggrundstype, Farve, Billede, Titel og Beskrivelse farve og typografi samt Icon Color kontrolelementer

Almindelige brugstilfælde #

Servicekort med et ikon på forsiden og detaljer plus en knap på bagsiden.
Teammedlemmer viser et foto på forsiden og en bio på flip.
Produktets højdepunkter det afslører pris og en Køb-knap på svæve.
Featuregitre hvor hvert kort vender til en kort forklaring.
Porteføljefliser med en miniaturefront og et projektlink på bagsiden.

Tips til at arbejde med Flipbox-widget #

Indstil en fast højde. Flip Box Height holder begge ansigter i samme størrelse, så kortet ikke springer, når det vender. Lad det være ustillet, og en længere bagside vil ændre størrelsen på kortet midt på svævet, som ser ud.
Hold tilbage tekst kort. Bagsiden vender hurtigt ind, så en stram linje og en knap læses bedre end et helt afsnit.
Match animationen til stemningen. Fade passer til en rolig side; 3D Flip og Cube passer til en dristig helt.
Kontrast de to ansigter. En anden baggrundsfarve på bagsiden gør flip indlysende på et øjeblik.
Link altid knappen. Bagsideknappen er udbetalingen, så peg den på næste trin.

Se video tutorial #

Foretrækker du at følge med på skærmen? Videovejledningen nedenfor går gennem Flipbox-elementet fra start til slut og viser, hvordan animationsstilene, front- og bagsiderne og stylingen fungerer i Elementor-editoren.

Ofte stillede spørgsmål #

Hvad er Flipbox-widget i Master Addons?

Det er en Elementor widget, der bygger et tosidet kort. Forsiden viser et ikon, titel og beskrivelse, og ved at holde markøren vender den til en bagside med sin egen tekst og en knap. Alt er indstillet fra Elementor panelet uden kode.

Hvor mange flip-animationer har Flipbox-widgetten?

Animation Style dropdown indeholder mere end tredive effekter, såsom Flip Horizontal, Flip Vertical, Fade, Fade Up, Rollover, 3d Flip, Cube varianterne, dias retninger, og Diagonal. Du vælger en pr kort til at styre, hvordan bagsiden ansigt vises.

Kan jeg tilføje en knap til flipkortet?

Ja. Afsnittet Handlingsknap i fanen Indhold indstiller knappens etiket og dens link. Knappen sidder på bagsiden, så den viser, hvornår kortet vender, hvilket gør det til et naturligt sted at sende besøgende til et produkt eller en formular.

Kan jeg bruge et billede i stedet for et ikon på forsiden?

Ja. I sektionen Front Box skal du skifte ikonstilen, så du kan vælge et billede i stedet for et biblioteksikon. Fanen Stil lader dig også indstille et baggrundsbillede for begge sider, så billedstyrede flipkort er nemme at bygge.

Hvordan holder jeg begge sider af flipkortet i samme størrelse?

Indstil Flip Box Height i afsnittet Generelt på fanen Stil. Det giver begge sider én fast højde, så kortet forbliver den samme størrelse før og efter flip i stedet for at ændre størrelsen, så det passer til hver sides indhold.

Indpakning #

Flipbox-widget'en forvandler et fladt kort til et interaktivt: Vælg en animation, udfyld front- og bagfladerne, link knappen, og stil derefter hver side. For relaterede widgets, se Infoboks widget og the Teammedlem widget, gennemse hele Master Addons widgets og udvidelser, og kontrollere de prissætning side for hvad hver plan indeholder.

Tema Bygherre

Popup Builder

Widget Builder

Mega Menu Builder

Brugerdefineret Css

Dynamiske tags

Visningsbetingelser

Ikoner Bibliotek

Animation

Skabelonsæt

Klar sektioner

Klar Popups

Klar Sider

Klar Header

Klar sidefod

WP Adminify

Admin Bar Editor

Loginfi

Rollemaster Suite

Master Blocks

WP Spotlight