In dit bericht laten we u zien hoe u Elementor en WC Product Table kunt combineren om een meer aangepaste WordPress-site te maken en tegelijkertijd de verkoop van uw WooCommerce-winkel te verhogen.
WordPress vereenvoudigt het proces van het maken van een website en het snel in gebruik nemen ervan. WooCommerce is een WordPress- plugin waarmee u van elke WordPress-website een volledig werkende online winkel kunt maken. U loopt echter het risico een copycat-site te maken, maar als u doorgaat met hun 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 het is wat u wilt.
Veel WordPress en WooCommerce plugin s zijn beschikbaar om de functionaliteit van uw winkel te verbeteren - Elementor, voor ex amp le, is de meest eenvoudige tool voor het aanpassen van uw WooCommerce product pagina. Hoewel het een van de belangrijkste voordelen is, heeft het ook enkele belangrijke nadelen. Voor ex amp le, wanneer u combineren WordPress plugin s van verschillende auteurs, u de kans kampen fouten compatibiliteit en andere complicaties; dit is niet het geval bij gebruik van de WooCommerce Product Table en Elementor- plugin ins voor WordPress-websites. U heeft meer controle over het uiterlijk en de functionaliteit van uw site wanneer u een van deze plugin ins gebruikt, en ze kunnen in combinatie worden gebruikt om nog betere resultaten te krijgen.
- 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 van WordPress- plugin ins beschikbaar om u te helpen bij het maken van een betere WordPress-site die is aangepast aan uw specifieke vereisten. Sommige plugin ins 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 ex amp le van het eerste type van de toepassing:
Onze plugin in voor het bouwen van pagina's biedt u een volledig 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 een uitgebreide bibliotheek met widgets, blokken en lay-outs te selecteren en aan te passen.
Hoewel de WooCommerce-producttabel een meer algemene oplossing is, is deze ook meer gericht:
Met deze plugin kunt u dynamische, volledig aanpasbare tabellen maken waarin uw WooCommerce-producten en -services worden vermeld. 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.
Wanneer ze in combinatie met elkaar worden gebruikt, bieden Elementor en WooCommerce Product Table aanzienlijk diverse mogelijkheden. U kunt ze gebruiken om een aantal zeer significante effecten te produceren die het aantal verkopen voor uw WooCommerce-winkel zullen helpen verhogen.
Nu is het tijd om aan de slag te gaan. In de volgende paragrafen, zullen we kijken naar een aantal real-world ex amp les van hoe u kunt gebruik maken van de WooCommerce Product Tafel en Elementor effecten vergelijkbaar zijn met die hierboven getoond te creëren.
Als het gaat om het combineren van deze twee plugin ins, is de lucht de limiet - en dit zijn slechts enkele van de mogelijkheden. Met een beetje vallen en opstaan, kunt u verschillende pagina's samenstellen met dezelfde fundamentele benadering die we zullen demonstreren.
Eerst en vooral moet u ervoor zorgen dat beide plugin ins correct op uw site zijn geïnstalleerd. Het is een goede zaak dat het installeren van Elementor en het configureren van de WooCommerce Product Table pijnloos en eenvoudig is. WooCommerce zelf moet ook zijn geïnstalleerd en ingeschakeld 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 voordelige toepassing die mogelijk is. Als alternatief, als u gewoon een dynamische producttabel op uw Elementor-website wilt gebruiken, kunt u deze toevoegen aan een widget en deze aan de voorkant van de website laten verschijnen.
Zorg ervoor dat je de Elementor-editor gebruikt wanneer je een pagina of bericht opent om dit te bereiken. Als u de bekende WordPress-interface ziet, 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. Er verschijnt een groot gebied aan de rechterkant waar uw inhoud wordt weergegeven en deze wordt in realtime bijgewerkt terwijl u deze toevoegt en wijzigt. Aan de linkerkant van het scherm bevindt zich een lijst met 'widgets' die u naar het aangewezen gebied kunt slepen en vervolgens naar behoefte kunt reorganiseren en configureren:
Een producttabel kan worden gebruikt met een verscheidenheid aan verschillende Elementor-widgets. Als u echter slechts één producttabel op een pagina wilt weergeven, kunt u dit bereiken door een inleidend tekstgedeelte op te nemen in de HTML-code van de pagina. Pak de widget Teksteditor 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 gaat om de producttabel zelf, kunt u deze opnemen door deze eenvoudige shortcode in te plakken:
[producttabel]
Wanneer u de shortcode in uw pagina invoegt, verschijnt de tabel op de locatie die u opgeeft, die u kunt verifiëren door deze aan de voorkant te bekijken:
Als je een element alleen voor de code zelf wilt gebruiken, kun je de Shortcode-widget gebruiken.
Vergeet nooit om de pagina op te slaan wanneer u klaar bent met het plaatsen van de tafel, ongeacht waar u deze neerzet. Daarna wilt u waarschijnlijk enkele wijzigingen aanbrengen in hoe de tabel eruitziet en functioneert.
Keer terug naar uw WordPress-dashboard en navigeer naar het tabblad WooCommerce > Instellingen om deze taak te voltooien. Producttabellen zijn te vinden door Producten bovenaan het scherm 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 u kunt deze aanpassen door onder andere filters en variabelen toe te voegen. Bekijk de documentatie van de plugin voor meer informatie over de verschillende keuzes.
U kunt de producttabel die u zojuist hebt gemaakt met Elementor wijzigen zonder dat u iets anders hoeft te doen. Als u klaar bent met het aanpassen van de tafel aan uw specificaties, slaat u eenvoudig uw wijzigingen op en bent u klaar om te gaan!
Accordeons, tabbladen en schakelaars kunnen worden gebruikt om verschillende producttabellen te ordenen.
De bovenstaande oplossing werkt goed als je een enkele tabel wilt presenteren met je WooCommerce-producten. 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 accordeonobject, voor ex amp le, kan worden gebruikt om hetzelfde effect die we zagen in de laatste case study te genereren. Verplaats de accordeonwidget vanuit het bewerkingsgebied aan de rechterkant naar het bewerkingsgebied aan de linkerkant.
U kunt zoveel afzonderlijke tabbladen maken als u wilt door op de plustekens te klikken, en u kunt de koppen 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 toevoegen van de standaard shortcode resulteren in een opeenvolging van vergelijkbare producttabellen, wat hoogstwaarschijnlijk niet is wat u in de eerste plaats zocht. In plaats daarvan, moet u aan te passen elk shortcode alleen gespecificeerde producten te tonen - voor ex amp le, items uit een specifieke categorie - in plaats van alle producten.
De methode die u gebruikt, wordt bepaald door de producten die u in elke betreffende tabel wilt opnemen en weglaten. Raadpleeg voor meer informatie de complete gids voor het aanpassen van uw WooCommerce Product Table-shortcodes.
Het is vermeldenswaard 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. op een aantrekkelijke en overzichtelijke manier presenteren van verschillende WooCommerce-producttabellen
Ruim uw slordige opmaak op dankzij de gratis online HTML-, CSS- en JavaScript-organizers!
Denk goed na over het ontwerp van uw e-commerce website als u wilt dat uw bedrijf zich onderscheidt van de concurrentie. Voor ex amp le, wil je de meest effectieve manier van presentatie van uw producten te bepalen, bij voorkeur in een stijl die zowel gebruiksvriendelijk en visueel aantrekkelijk voor het oog.
Gelukkig maakt het gebruik van de WooCommerce Product Table- plugin met Elementor dit een eenvoudige taak. De shortcode van uw producttabel kan worden gebruikt om alles wat uw site te bieden heeft (of slechts een selectie) op een echt dynamische manier weer te geven.
