In dit bericht laten we u zien hoe u Elementor en WC Product Table kunt combineren om een meer aangepaste WordPress-site te creëren en tegelijkertijd de verkoop van uw WooCommerce-winkel te verhogen.
WordPress vereenvoudigt het proces van het maken van een website en het snel operationeel krijgen ervan. WooCommerce is een WordPress plugin waarmee u van elke WordPress-website een volledig werkende online winkel kunt maken. U loopt het risico een copycat-site te maken, maar als u doorgaat met de standaardopties en -functies, is dit mogelijk niet geschikt voor uw zakelijke behoeften. Het is van cruciaal belang om de beste tools te vinden voor het ontwerpen en aanpassen van uw website totdat deze is wat u wilt.
veel WordPress- en WooCommerce- plugin beschikbaar om de functionaliteit van uw winkel te verbeteren. Elementor is bijvoorbeeld amp meest eenvoudige tool voor het aanpassen van uw WooCommerce-productpagina. Hoewel het een van de belangrijkste voordelen is, heeft het ook enkele belangrijke nadelen. Wanneer u bijvoorbeeld plugin van verschillende auteurs combineert, loopt u de kans op compatibiliteitsfouten en andere complicaties amp dit is niet het geval bij het gebruik van de WooCommerce Product Table en Elementor plugin voor WordPress websites. U heeft meer controle over het uiterlijk en de functionaliteit van uw site als u een van deze plugin , en ze kunnen samen worden gebruikt om nog betere resultaten te behalen.
- Een snel overzicht van de WooCommerce-producttabel en Elementor Frameworks
- Volg deze stappen om een WooCommerce-producttabel op te nemen in een teksteditor of shortcode-widget:
- Accordeons, tabbladen en schakelaars kunnen worden gebruikt om verschillende producttabellen te ordenen.
Een snel overzicht van de WooCommerce-producttabel en Elementor Frameworks
Zoals eerder vermeld, is er een uitgebreide selectie WordPress- plugin beschikbaar om u te helpen bij het creëren van een betere WordPress-site die is aangepast aan uw specifieke vereisten. Sommige plugin zijn ontworpen om op grote schaal te worden gebruikt, terwijl andere zijn ontworpen om een bepaald aspect of functie toe te voegen.
Elementor is een amp van het eerste type toepassing:
Onze page builder plugin biedt u een geheel nieuwe interface voor het bouwen van webpagina's en het maken van uw WordPress-website. U krijgt veel controle over de manier waarop uw website is samengesteld door te kiezen uit een uitgebreide bibliotheek met widgets, blokken en lay-outs en deze aan te passen.
Hoewel de WooCommerce-producttabel een meer algemene oplossing is, is deze ook doelgerichter:
Met deze plugin kunt u dynamische, volledig aanpasbare tabellen maken met uw WooCommerce-producten en -services. Vanwege hun interactie met WooCommerce zijn deze tabellen echter bijzonder geschikt om artikelen en diensten op een gebruiksvriendelijke en visueel aantrekkelijke manier weer te geven voor online shoppers. De Posts Table Pro plugin werkt op dezelfde manier samen met Elementor en vermeldt elk WordPress-inhoudstype in een tabel in plaats van alleen WooCommerce-producten (als u iets anders dan producten wilt weergeven – zoals berichten, pagina’s of documenten), kan in plaats daarvan worden gebruikt.
WooCommerce Product Table in combinatie met elkaar worden gebruikt, bieden ze aanzienlijk uiteenlopende mogelijkheden. U kunt ze gebruiken om een aantal zeer significante effecten teweeg te brengen die het aantal verkopen voor uw WooCommerce-winkel zullen helpen verhogen.
Nu is het tijd om aan de slag te gaan. In de volgende secties bekijken we enkele amp van hoe u de WooCommerce Product Table en Elementor kunt gebruiken om effecten te creëren die vergelijkbaar zijn met de hierboven weergegeven effecten.
Als het gaat om het combineren van deze twee plugin ins, is de sky de limit – en dit zijn slechts enkele van de mogelijkheden. Met een beetje vallen en opstaan kun je verschillende pagina's samenstellen met dezelfde fundamentele aanpak die we zullen demonstreren.
Eerst en vooral moet u ervoor zorgen dat beide plugin correct op uw site zijn geïnstalleerd. Het is maar goed dat het installeren van Elementor en het configureren van de WooCommerce Product Table pijnloos en eenvoudig is. WooCommerce zelf moet ook geïnstalleerd en ingeschakeld zijn voordat u verder kunt gaan met deze stap. Dan ben je klaar om aan je project te gaan werken.
Volg deze stappen om een WooCommerce-producttabel op te nemen in een teksteditor of shortcode-widget:
Laten we beginnen met de meest fundamentele en nuttige toepassing die mogelijk is. Als u eenvoudigweg een dynamische producttabel op uw Elementor-website wilt gebruiken, kunt u deze ook aan een widget toevoegen en op de voorkant van de website laten verschijnen.
Zorg ervoor dat u de Elementor-editor gebruikt wanneer u een pagina of bericht opent om dit te bereiken. Als u de vertrouwde WordPress-interface te zien krijgt, klikt u op de knop Bewerken met Elementor om over te schakelen naar de Elementor-interface:
Als dit de eerste keer is dat u met Elementor werkt, laten we dan een kleine rondleiding over het platform maken. Aan de rechterkant verschijnt een groot gebied waar uw inhoud wordt weergegeven, en deze wordt in realtime bijgewerkt terwijl u deze toevoegt en wijzigt. Aan de linkerkant van het scherm staat een lijst met 'widgets' die u naar het aangewezen gebied kunt slepen en vervolgens indien nodig kunt reorganiseren en configureren:
Een producttabel kan worden gebruikt met verschillende Elementor-widgets. Als u echter slechts één producttabel op een pagina wilt weergeven, kunt u dit doen door een inleidend tekstgedeelte op te nemen in de HTML-code van de pagina. Pak de Teksteditor-widget op en verplaats deze als volgt naar een lege plaats:
Daarna kunt u in de widget klikken om de standaardtekst te verwijderen en deze te vervangen door de gewenste inhoud. Als het om de producttabel zelf gaat, kunt u deze opnemen door deze eenvoudige shortcode te plakken:
[producttabel]
Wanneer u de shortcode in uw pagina invoegt, verschijnt de tabel op de locatie die u opgeeft, wat u kunt verifiëren door deze op de voorkant te bekijken:
Als je alleen een element voor de code zelf wilt gebruiken, kun je de Shortcode-widget gebruiken.
Vergeet nooit de pagina op te slaan als u klaar bent met het positioneren van de tafel, waar u deze ook neerzet. Hierna wilt u waarschijnlijk enkele wijzigingen aanbrengen in de manier waarop de tabel verschijnt en functioneert.
Keer terug naar uw WordPress-dashboard en navigeer naar het tabblad WooCommerce > Instellingen om deze taak te voltooien. Producttabellen vindt u door bovenaan het scherm Producten te selecteren en vervolgens Producttabellen:
Een uitgebreide lijst met opties voor het configureren van uw WooCommerce-producttabel vindt u hier. U heeft volledige controle over de informatie die in de tabel verschijnt en kunt deze aanpassen door onder andere filters en variabelen toe te voegen. Bekijk de documentatie van plugin voor meer informatie over de verschillende keuzes.
U kunt de zojuist aangemaakte producttabel met Elementor wijzigen zonder dat u verder iets hoeft te doen. Zodra u klaar bent met het aanpassen van de tafel aan uw specificaties, slaat u eenvoudig uw wijzigingen op en bent u klaar om aan de slag te gaan!
Accordeons, tabbladen en schakelaars kunnen worden gebruikt om verschillende producttabellen te ordenen.
De bovenstaande oplossing werkt goed als u één tabel met uw WooCommerce-producten wilt presenteren. Als je veel tabellen gaat maken, die elk een andere categorie objecten hebben, is dit niet de beste optie.
Er zijn verschillende manieren om dit in Elementor te bereiken. De Accordeon-widget kan amp worden gebruikt om hetzelfde effect te genereren dat we in de laatste casestudy zagen. Begin vanuit het rechter bewerkingsgebied en verplaats de accordeonwidget naar het linker bewerkingsgebied.
U kunt zoveel afzonderlijke tabbladen maken als u wilt door op de plustekens te klikken, en u kunt de kopjes en tekst binnen elk tabblad aanpassen. Bovendien kunt u een producttabel toevoegen aan een of meer tabbladen met dezelfde shortcode als eerder vermeld.
Natuurlijk zal het simpelweg toevoegen van de basis shortcode resulteren in een opeenvolging van vergelijkbare producttabellen, wat hoogstwaarschijnlijk niet is waar u naar op zoek was. In plaats daarvan moet u elke shortcode aanpassen zodat alleen bepaalde producten worden weergegeven ( amp items uit een specifieke categorie) in plaats van alle producten.
Welke werkwijze u hanteert, wordt bepaald door de producten die u in elke tabel in kwestie wilt opnemen en weglaten. Raadpleeg voor meer informatie de volledige handleiding voor het aanpassen van uw WooCommerce Product Table-shortcodes.
Het is de moeite waard om op te merken dat je een soortgelijk effect kunt bereiken met behulp van enkele andere handige Elementor-widgets; dit omvat onder meer de Toggle-widget en de Tabs-widget. Als het gaat om het op een aantrekkelijke en overzichtelijke manier WooCommerce-producttabellen
Ruim uw slordige markeringen op dankzij de gratis online HTML-, CSS- en JavaScript-organizers!
Denk goed na over het ontwerp van uw e-commercewebsite als u wilt dat uw bedrijf zich onderscheidt van de concurrentie. U wilt amp bepalen wat de meest effectieve manier is om uw producten te presenteren, idealiter in een stijl die zowel gebruiksvriendelijk als visueel aantrekkelijk voor het oog is.
Gelukkig maakt het gebruik van de WooCommerce Product Table plugin met Elementor dit een eenvoudige taak. Uw producttabel-shortcode kan worden gebruikt om alles wat uw site te bieden heeft (of slechts een selectie) op een echt dynamische manier weer te geven.
