Når shoppere vejer to eller tre muligheder, svarer en side-by-side tabel på deres spørgsmål hurtigere end at rulle mellem separate sider. Den Sammenligning Tabel widget, en Pro widget i Master Addons til Elementor, bygger den tabel: en kolonne af funktioner ned langs siden, en kolonne pr produkt på tværs af toppen, og en pris plus købe knap på hver. Du udfylder det fra Elementor panel, ingen HTML tabeller kræves.
Hver celle kan holde tekst, et flueben eller et kryds, så det læser med et øjeblik. Fire layoutstile, et justerbart antal produktkolonner og fuld farvekontrol betyder, at tabellen kan matche enhver side. Denne vejledning dækker hver indstilling, fra funktionsrækkerne til zebrastribningen.
Foretrækker du at se først? Denne korte tutorial går gennem Comparison Table widget ende til ende:
Hvad gør widgetten Sammenligningstabel #
Widgetten opstiller et gitter: funktionsnavne løber ned i den første kolonne, og hvert produkt får sin egen kolonne med en titel, pris, værdi pr. funktion og en knap til at handle. Skift produktantallet, og kolonnerne justeres, så de passer.
Du skriver alt i hånden, så det afhænger ikke af WooCommerce. Det gør det lige så nyttigt til sammenligning af plugins, serviceniveauer eller hardware, som det er til butiksprodukter.
Før du starter #
- WordPress med elementor installeret og aktiv.
- Master Addons Pro installeret med en aktiv licens, da Sammenligningstabel er en Pro-widget. Ny i plugin'et? Se den installationsvejledning.
- Produkterne og funktionslisten, du vil sammenligne.
Sådan tilføjes widgetten Sammenligningstabel #
I Elementor-editoren skal du åbne Elementer panel og søg efter Sammenligningstabel, eller rul til afsnittet Mastertilføjelser. Træk det over på din side, og der vises en eksempeltabel, som allerede er udfyldt med pladsholderprodukter og -funktioner, så du redigerer fra et fungerende layout i stedet for et tomt gitter.
Generelle indstillinger:layout og produktantal #
Åbn tilfreds fanebladet og general sektion indeholder de to indstillinger, der former hele tabellen.
- Layouts: vælg stil 1, 2, 3 eller 4. Hver omarrangerer overskriften, prisen og kolonnerne til et andet udseende.
- Produkter: indstil, hvor mange produktkolonner tabellen viser, fra 2 til 6. Hæv tallet, og der vises en matchende produktsektion nedenfor for hver ny kolonne.
Indstil funktionsrækkerne #
de Funktioner Box afsnit definerer venstre kolonne, listen over ting, du sammenligner. Den Overskrift er etiketten øverst (som “Funktioner” eller “Produkt”), og den karakteristika repeater holder et element pr. række.
Hvert funktionselement er en rækkeetiket som f.eks. Størrelse, Garanti eller Tilgængelighed. Brug Tilføj vare for at tilføje rækker, kopiikonet for at duplikere en, og X for at fjerne det. Der er også en Knapoverskrift felt for den række, der holder købsknapperne.
Udfyld hver produktkolonne #
Hvert produkt får sin egen sektion (Produkt 1, Produkt 2, og så videre). Indeni indstiller du kolonnens titel, pris, billede, knaptekst og link, derefter værdien for hver funktionsrække.
Den praktiske del er per-rækken tilfreds kontrol. For hver funktion vælger du en check, et kryds, et ikon, du vælger, eller almindelig tekst. Et kryds-og-kryds gitter læser øjeblikkeligt, mens tekstfelter passer til specifikationer som “1 år” eller “Alle størrelser.” An tilsidesætte stil toggle lader en enkelt kolonne skille sig ud, hvilket er nyttigt til at fremhæve dit anbefalede valg.
Vælg en layoutstil #
De fire layout ændrer, hvordan tabellen ser ud, uden at røre dit indhold. Skift mellem dem er en måde med et enkelt klik at finde den stil, der passer til siden.
Stil 4 forvandler søjlerne til separate kort med buede, farvede overskrifter, et dristigere look til en fremhævet sammenligning.
Stil 2 flyder et cirkulært prisskilt over hver kolonne med en farvet titellinje under. Her er tabellen sat til fire produkter, der viser, hvordan kolonnerne skalerer.
Style bordet #
de måde tabulator styrer farve og afstand. Den general sektionen indstiller det borddækkende look, med resten opdelt i Feature Box, produkter, knap, og Mønstre når den frie Mønstre forlængelse er slået til.
- Ulige rækkefarve og lige rækkefarve: zebrastribningen, der gør lange borde nemmere at læse.
- Kanttype, bredde og farve: linjerne mellem celler.
- Bokseradius, kolonneafstand og rækkeafstand: afrundede hjørner og mellemrummene mellem kolonner og rækker.
- Feature Box, Produkter, Knap: typografi, farver, justering og polstring for hver del af tabellen.
Resultatet på siden #
Udgiv eller forhåndsvisning og tabellen gengives med dine funktioner, produkter, priser, og knapper på plads, zebra rækker og alle. Nedenfor er en Style 2 tabel med tre produkter.
Almindelige brugstilfælde #
- Produktsammenligninger at sætte to eller tre modeller side om side.
- Plan eller prissætning niveauer når du vil have et gitter i stedet for stablet prisfastsættelsestabeller.
- Plugin eller softwarefunktionsmatricer med kryds-og-kryds rækker.
- Servicepakker sammenligning af, hvad hvert niveau inkluderer.
- Os-versus-dem tabeller fremhæv dit produkt med Override Style-skifteren.
Tips til at arbejde med widgetten Sammenligningstabel #
- Brug flueben og kryds for ja/nej-funktioner. De scanner hurtigere end ordene “Ja” og “Nej” og holder bordet ryddeligt.
- Hold funktionsetiketter korte. Et eller to ord pr. række forhindrer den første kolonne i at blive bred.
- Markér én kolonne med Tilsidesæt stil. En anden farve guider øjet til din anbefalede mulighed.
- Indstil zebrafarver med nok kontrast. Skiftende rækkefarver er det, der gør et langt bord læsbart.
- Match produktantallet til skærmen. Tre kolonner passer til de fleste layouts; fire eller flere kan blive trange på mindre skærme. Under Start Tab Format Fra bredde (767px som standard) skifter nogle layout til produktfaner, så tjek mobilvisning.
Ofte stillede spørgsmål #
Hvad er widgetten Sammenligningstabel i Master Addons?
Det er en Master Addons Pro widget til Elementor, der bygger en side-by-side sammenligning gitter. Feature navne løber ned den første kolonne og hvert produkt får sin egen kolonne med en titel, pris, per-feature værdi, og en knap. Du indtaster alt i hånden, så det behøver ingen WooCommerce.
Hvor mange produkter kan jeg sammenligne i tabellen?
Du indstiller tallet, fra 2 til 6, i feltet Produkter under Generelt. Hæv det, og der vises et nyt Produktafsnit for hver kolonne, du tilføjer. Tre kolonner passer til de fleste sidebredder, mens fire eller flere fungerer bedst på bredere layout.
Kan jeg vise kryds og tværs i stedet for tekst?
Ja. I hver produktsektion har hver funktionsrække en Content-kontrol, hvor du vælger en check, et kryds, et ikon efter eget valg eller almindelig tekst. Tick-and-cross-mærker gør ja/nej-funktioner scanbare, mens tekst passer til specifikationer som garantilængde.
Hvor mange layoutstile har sammenligningstabellen?
Fire. Style 1 er en klassisk tabel, Style 2 tilføjer cirkulære pris badges, og Style 4 forvandler kolonnerne til kort med buede overskrifter. Skiftende layout omarrangerer det samme indhold, så du kan prøve hver uden at gentage dine data.
Kan jeg fremhæve én produktkolonne?
Ja. Hver produktsektion har en Override Style-skift, der lader dig give en kolonne sine egne farver. Brug den til at få din anbefalede indstilling til at skille sig ud fra de andre i tabellen.
Indpakning #
Widgetten Sammenligningstabel forvandler en liste over produkter og funktioner til et klart, side-om-side gitter: Vælg et layout, indstil antallet af kolonner, tilføj dine funktionsrækker, og fyld hver kolonne med værdier, priser og knapper. Da den ikke er afhængig af WooCommerce, falder den ned på en hvilken som helst side. For layouteksempler og hvornår du skal vælge en pristabel i stedet, se Elementor sammenligningstabel widget side. Par det med Prissætning Tabel widget for plansider, gennemse hele Master Addons widgets og udvidelser, og se den prissætning side for hvad hver plan indeholder.
