I dette indlæg viser vi dig, hvordan du kombinerer Elementor og WC Product Table for at oprette et mere tilpasset WordPress-websted, samtidig med at salget i din WooCommerce-butik øges.
WordPress forenkler processen med at oprette et websted og få det til at køre hurtigt. WooCommerce er et WordPress- plugin der giver dig mulighed for at gøre ethvert WordPress-websted til en fuldt fungerende onlinebutik. Du løber risikoen for at producere et copycat-websted, men hvis du fortsætter med deres standardindstillinger og funktioner, er dette muligvis ikke passende for dine forretningsbehov. Det er vigtigt at finde de bedste værktøjer til at designe og tilpasse dit websted, indtil det er det, du ønsker.
Mange WordPress og WooCommerce plugin s er tilgængelige til at forbedre din butikkens funktionalitet - Elementor, til ex amp le, er den mest ligetil værktøj til at tilpasse din WooCommerce produktsiden. Selv om det er en af de mest betydningsfulde fordele, har det også nogle væsentlige ulemper. Til ex amp le, når du kombinerer WordPress plugin s fra forskellige forfattere, du kører chancen for at støde fejl kompatibilitet og andre komplikationer; dette er ikke tilfældet, når du bruger WooCommerce Product Table og Elementor- plugin til WordPress-websteder. Du får større kontrol over udseendet og funktionaliteten på dit websted, når du bruger et af disse plugin , og de kan bruges sammen for at få endnu mere fremragende resultater.
- En hurtig oversigt over WooCommerce Product Table og Elementor Frameworks
- Følg disse trin for at integrere en WooCommerce-produkttabel i en teksteditor eller en kortkodewidget:
- Harmonika, faner og skifter kan bruges til at organisere flere produkttabeller.
En hurtig oversigt over WooCommerce Product Table og Elementor Frameworks
Som tidligere nævnt er der et stort udvalg af WordPress- plugin til rådighed for at hjælpe dig med at oprette et bedre WordPress-websted, der er tilpasset dine specifikke krav. Nogle plugin er designet til at blive brugt i stor skala, mens andre er designet til at tilføje et bestemt aspekt eller funktion.
Elementor er en ex amp af den første applikationstype:
Vores sidebygger- plugin tilbyder dig en helt ny grænseflade til at konstruere websider og oprette dit WordPress-websted. Du får stor kontrol over den måde, dit websted er sammensat på, ved at vælge fra og tilpasse et omfattende bibliotek med widgets, blokke og layouts.
Mens WooCommerce-produkttabellen er en mere generel løsning, er den også mere målrettet:
Dette plugin giver dig mulighed for at oprette dynamiske, fuldt tilpassede tabeller, der viser dine WooCommerce-produkter og -tjenester. På grund af deres interaktion med WooCommerce er disse tabeller dog særligt velegnede til at vise varer og tjenester på en brugervenlig og visuelt tiltalende måde for online-kunder. Posts Table Pro- plugin interagerer ligeligt med Elementor og viser en WordPress-indholdstype i en tabel i stedet for blot WooCommerce-produkter (hvis du vil vise noget bortset fra produkter - såsom indlæg, sider eller dokumenter), kan bruges i stedet.
Når de bruges i forbindelse med hinanden, giver Elementor og WooCommerce Product Table betydeligt forskellige muligheder. Du kan bruge dem til at producere nogle meget betydningsfulde påvirkninger, der hjælper med at øge antallet af salg til din WooCommerce-butik.
Nu er det tid til at komme i gang. I de følgende sektioner ser vi på nogle virkelige eks- amp af, hvordan du kan bruge WooCommerce Product Table og Elementor til at skabe effekter svarende til dem, der er vist ovenfor.
Når det kommer til at kombinere disse to plugin , er himlen grænsen - og dette er blot nogle få af mulighederne. Med lidt prøving og fejl kan du sammensætte forskellige sider ved hjælp af den samme grundlæggende tilgang, som vi vil demonstrere.
Først og fremmest vil du sørge for, at begge plugin er korrekt installeret på dit websted. Det er en god ting, at installation af Elementor og konfiguration af WooCommerce Product Table er smertefri og ligetil. Selve WooCommerce skal også være installeret og aktiveret, før du kan fortsætte med dette trin. Så er du klar til at arbejde på dit projekt.
Følg disse trin for at integrere en WooCommerce-produkttabel i en teksteditor eller en kortkodewidget:
Lad os starte med den mest grundlæggende og gavnlige anvendelse mulig. Alternativt, hvis du blot vil bruge en dynamisk produkttabel på dit Elementor-websted, kan du føje den til en widget og få den til at vises i frontenden af hjemmesiden.
Sørg for at bruge Elementor-editoren, når du åbner en side eller et indlæg for at opnå dette. Hvis du får den velkendte WordPress-grænseflade, skal du klikke på knappen Rediger med Elementor for at skifte til Elementor-grænsefladen:
Hvis dette er din første gang, du arbejder med Elementor, lad os tage en lille tur rundt på platformen. Et stort område vises til højre, hvor dit indhold vises, og det opdateres i realtid, når du tilføjer og ændrer det. På venstre side af skærmen er der en liste over 'widgets', som du kan trække ind i det udpegede område og derefter omorganisere og konfigurere efter behov:
En produkttabel kan bruges med en række forskellige Elementor-widgets. Hvis du kun vil vise en enkelt produkttabel på en side, kan du dog opnå det ved at inkludere et indledende tekstafsnit i sidens HTML-kode. Tag Teksteditor-widgeten op og flyt den over til et tomt sted som følger:
Derefter kan du klikke inde i widgeten for at fjerne standardteksten og erstatte den med det indhold, du vil have. Når det kommer til selve produkttabellen, kan du medtage den ved at indsætte i denne enkle kortkode:
[produkttabel]
Når du indsætter kortkoden på din side, vises tabellen på det sted, du angiver, som du kan bekræfte ved at se den i frontenden:
Hvis du kun vil bruge et element til selve koden, kan du bruge Shortcode-widgeten.
Glem aldrig at gemme siden, når du er færdig med at placere bordet, uanset hvor du beslutter dig for at placere den. Derefter vil du sandsynligvis foretage nogle ændringer i, hvordan tabellen vises og fungerer.
Gå tilbage til dit WordPress-dashboard, og naviger til fanen WooCommerce> Indstillinger for at fuldføre denne opgave. Produkttabeller kan findes ved at vælge Produkter øverst på skærmen og derefter Produkttabeller:
En grundig liste over muligheder for konfiguration af din WooCommerce-produkttabel kan findes lige her. Du har fuld kontrol over de oplysninger, der vises i tabellen, og du kan tilpasse dem ved at tilføje blandt andet filtre og variabler. Tjek plugin dokumentation for at få flere oplysninger om de forskellige valg.
Du vil være i stand til at ændre den produkttabel, du lige har oprettet ved hjælp af Elementor uden at skulle gøre noget andet. Når du er færdig med at tilpasse tabellen til dine specifikationer, skal du blot gemme dine ændringer, og du er klar til at gå!
Harmonika, faner og skifter kan bruges til at organisere flere produkttabeller.
Ovenstående løsning fungerer godt, hvis du vil præsentere et enkelt bord med dine WooCommerce-produkter. Hvis du vil konstruere mange tabeller, som hver har en anden kategori af objekter, er dette ikke den bedste mulighed.
Der er flere forskellige måder at opnå dette på Elementor. Den Harmonika widget, til ex amp le, kan bruges til at generere den samme effekt, som vi så i sidste casestudie. Start fra højre redigeringsområde og flyt Accordion-widgeten til venstre redigeringsområde.
Du kan oprette så mange separate faner, som du vil, ved at klikke på plustegnene, og du kan tilpasse overskrifter og tekst inden for hver enkelt. Derudover kan du tilføje en produkttabel til en eller flere faner ved hjælp af den samme kortkode som tidligere nævnt.
Hvis du blot tilføjer den grundlæggende kortkode, vil det naturligvis resultere i en række lignende produkttabeller, hvilket sandsynligvis ikke er det, du først ledte efter. I stedet bliver du nødt til at tilpasse hver kortkode, så den kun viser bestemte produkter - for eksempel amp , varer fra en bestemt kategori - i stedet for alle produkter.
Den metode, du bruger, bestemmes af de produkter, du ønsker at medtage og udelade fra hver tabel. For yderligere oplysninger, se den komplette guide til tilpasning af dine WooCommerce-produkttabel-kortkoder.
Det er værd at bemærke, at du kan opnå en lignende effekt ved hjælp af nogle andre nyttige Elementor-widgets; dette omfatter blandt andet Toggle-widgetten og Tabs-widgetten. Med hensyn til at præsentere adskillige WooCommerce-produkttabeller på en tiltalende og velorganiseret måde, er Elementor dit go-to-værktøj.
Ryd op på din sjusket markering takket være de gratis online HTML-, CSS- og JavaScript-arrangører!
Tænk alvorligt på designet af dit e-handelswebsted, hvis du vil have din virksomhed til at skille sig ud fra konkurrencen. Til ex amp le, vil du ønsker at bestemme den mest effektive måde af fremvisning dine produkter, helst i en stil, der er både brugervenlig og visuelt tiltrækkende for øjet.
Heldigvis bruger WooCommerce Product Table plugin med Elementor dette til en ligetil opgave. Din produktkorts kortkode kan bruges til at vise alt, hvad dit websted har at tilbyde (eller bare et valg) på en virkelig dynamisk måde.
