Binnen deze gids gaan we bekijken hoe we een e-commerce website kunnen maken met Framework360.
Ten eerste is het belangrijk om te onderscheiden of we een e-commerce website willen creëren met één enkel product of met meerdere producten. In het eerste geval, dat wil zeggen, als we een enkel product willen verkopen, hoeven we alleen maar naar de optie Checkout in het hoofdmenu van Framework360 te gaan, de checkout in te stellen en ons product handmatig toe te voegen; hierover hebben we al gesproken in een speciale gids die je kunt raadplegen door hier te klikken.
Binnen deze gids zullen we ons echter bezighouden met hoe we een e-commerce website voor de verkoop van meerdere producten kunnen maken.
Stap 1: Laten we de plugin Ecommerce installeren
Ten eerste moeten we de plugin Ecommerce installeren, om dit te doen gaan we naar de optie Plugin van het hoofdmenu van Framework360 door de volgende stappen te volgen:
Aanpassing > Plugin
Nadat de plugin is geïnstalleerd, zal er in het hoofdmenu van Framework360 een nieuwe sectie openen genaamd, inderdaad, Ecommerce waarmee we onze website kunnen uitbreiden met alle multi-product functionaliteiten.
Stap 2: Laten we de voorkeuren van de plugin Ecommerce instellen
Nadat we de plugin Ecommerce hebben geïnstalleerd, moeten we naar de sectie Plugin Voorkeuren van het hoofdmenu van Framework360 en ga naar de optie Voorkeuren Ecommerce door de volgende stappen te volgen:
Aanpassing > Plugin Voorkeuren > Ecommerce
Terwijl we op de optie Beoordelingen modereren klikken, kunnen we persoonlijk de beoordelingen goedkeuren die door klanten zijn achtergelaten voordat ze daadwerkelijk op de site worden gepubliceerd.
Tenslotte, via de optie Automatische voorraadupdate kunnen we beslissen of de voorraad automatisch de hoeveelheid van de verkochte artikelen moet verlagen op het moment dat de klant de bestelling plaatst of op het moment dat de bestelling als betaald wordt beschouwd.
Stap 3: Laten we een product aan onze E-commerce toevoegen
Om een product aan onze E-commerce toe te voegen, gaan we naar de optie in het hoofdmenu van Framework360 Producten volgens de volgende stappen:
Ecommerce > Producten
In het scherm voor het aanmaken van het product hebben we verschillende tabs die ons in staat stellen om de creatie van ons product nauwkeurig te personaliseren.
TAB PRODUCT
Binnen de tab Product kunnen we toevoegen:
- de naam van het product;
- de referentiecategorie (over een moment zullen we ook kijken naar het aspect van het aanmaken van de categorie);
- de prijs;
- de eventuele belasting die op de prijs moet worden toegepast;
- Een eventuele korting op het artikel en de tijdslimiet van de korting;
- de voorraadhoeveelheid van het product;
- de minimale hoeveelheid van het te kopen product (nuttig voor sites die zich bezighouden met groothandel);
- de korte beschrijving en de uitgebreide beschrijving van het product;
- bepalen of het product moet worden uitgelicht;
- het type product (standaard, digitaal of cadeaubon);
- de code van het product;
- de EAN;
- Het gewicht van het product.
TAB KENMERKEN EN VARIATIES
Terwijl we ons in de tab KENMERKEN EN VARIATIES begeven, kunnen we de eventuele kenmerken van het product selecteren als het product variaties heeft, bijvoorbeeld in maat of kleur.
Om attributen aan ons product toe te voegen is het nodig dat deze attributen vooraf zijn aangemaakt in het specifieke gedeelte van het hoofdmenu van Framework360 genaamd Attributen. Om toegang te krijgen tot het gedeelte Attributen moeten we naar het hoofdmenu van Framework260 gaan en de volgende stappen volgen:
Ecommerce > Attributen
Nadat we ons attribuut hebben aangemaakt kunnen we terugkeren naar het tabblad Attributen en variaties, dat aanwezig is in het scherm voor productcreatie waar we eerder waren, en het gemaakte attribuut selecteren. In de volgende afbeelding zien we een voorbeeld waarin we het kleurattribuut van ons product aan het selecteren zijn:
TAB VERBONDEN ARTIKELEN
Binnen de tab Verbonden Artikelen hebben we de mogelijkheid om eventuele verbonden artikelen toe te voegen in:
- Up-Sell, dat wil zeggen, een upgrade van het product toevoegen (bijvoorbeeld, als het product in kwestie een schoenenmodel is, kan de up-sell een vergelijkbaar maar duurder schoenenmodel zijn), het zal aan de klant worden voorgesteld om de upgrade te kopen in plaats van het product dat hij bekijkt;
- Cross-Sell, dat wil zeggen, een gerelateerd product toevoegen aan wat de klant bekijkt (bijvoorbeeld, als het product in kwestie een schoenenmodel is, kan de cross-sell een paar sokken zijn), het zal aan de klant worden voorgesteld om beide producten samen te kopen.
TAB AFBEELDINGEN
In de tab afbeeldingen hebben we de mogelijkheid om verschillende afbeeldingen van het product te uploaden. We herinneren eraan dat we, om verschillende afbeeldingen in te voegen op basis van een bepaald attribuut, zoals eerder gezien, naar de tab Attributen en Variaties moeten gaan.
TAB SEO
In de SEO tab hebben we de mogelijkheid om een TAG Title en een TAG Description in te voeren om te bepalen hoe het product verschijnt in de zoekmachine.
TAB SOCIAL
Tenslotte kunnen we binnen de tab Social bepalen hoe ons product op sociale media zal verschijnen, dus hetzelfde principe dat we hebben gezien voor de tab die aan SEO is gewijd, maar voor sociale netwerken.
Stap 3: Laten we de categorie en subcategorieën van onze producten aanmaken
Over hoe we de categorieën en subcategorieën van onze producten kunnen aanmaken, hebben we een speciaal artikel geschreven dat ik je aanraad te raadplegen door hier te klikken.
Stap 4: Laten we de producten op de site toevoegen zodat ze gekocht kunnen worden
Zodra de producten zijn aangemaakt, hoeven we ze alleen nog maar op de website in te voegen zodat ze gekocht kunnen worden.
Ten eerste moeten we naar de pagina van de website gaan waar we onze producten willen laten verschijnen, wat bijvoorbeeld de homepagina van de site kan zijn. Om dit te doen, gaan we naar het onderdeel Pagina's van het hoofdmenu van Framework360 door de volgende stappen te volgen:
Website > Pagina's
Zodra we ons binnen het overzichtsscherm van alle pagina's van de website bevinden, klikken we op de pagina waarin we onze producten willen invoegen om deze te bewerken.
Goed, op dit punt zijn we binnen het ’bewerkingsscherm van de pagina die we hebben geselecteerd, laten we nu een rij toevoegen en, via de visual builder van Framework360, voegen we binnen de rij de Productlijst (aanwezig binnen het tabblad Ecommerce) in zoals weergegeven in de volgende afbeeldingen:
Op dit punt zal Framework360 ons vertellen dat het noodzakelijk is om een structuur voor de blok te creëren, om dit te doen gaan we naar het tabblad Structuur om een nieuwe structuur te maken of een eerder gemaakte structuur te importeren zoals weergegeven in de volgende afbeelding:
Eenmaal onze structuur gedefinieerd, als we de weergave ervan willen wijzigen (bijvoorbeeld bepalen of we willen dat de producten binnen een rooster of een carrousel verschijnen en hoeveel producten er binnen het rooster of de carrousel moeten worden weergegeven in de verschillende posities voor mobiel, tablet en pc) zouden we naar het tabblad Algemeen moeten gaan bij het onderdeel Weergave.
Stap 5: Laten we de productpagina aanpassen
Zodra we het Framework360-product hebben aangemaakt, zal het automatisch de pagina creëren waarop het product wordt weergegeven. Als we deze pagina willen aanpassen, hoeven we alleen maar naar de optie Pagina's te gaan in het hoofdmenu van Framework360 en de volgende stappen te volgen:
Website > Pagina's
Of, als we de grafische elementen van onze productpagina's niet handmatig willen aanpassen, kunnen we een van de vele sjablonen voor e-commerce installeren die Framework360 beschikbaar stelt. Om het sjabloon te wijzigen, moeten we naar de optie Thema's in het hoofdmenu van Framework360 gaan en de volgende stappen volgen:
Personalisatie > Thema's
Stap 6: Laten we de winkelwagentje toevoegen aan het hoofdmenu
Laten we nu bekijken hoe we het winkelwagentje kunnen toevoegen aan het menu van onze site, dat wil zeggen in de header van de site. Om dit te doen gaan we naar de sectie Globale Blokken van het hoofdmenu van Framework360 door de volgende stappen te volgen:
Website > Globale Blokken
Nadat we de Winkelwagentje blok hebben toegevoegd, gaan we het naar wens instellen, altijd via de visual builder, en het spel è gedaan!
Als je wilt ontdekken hoe je de ‘header van je website met Framework360 kunt maken, hebben we een speciale gids gemaakt die je kunt raadplegen door hier te klikken.
Stap 7: Laten we de Checkout instellen
Het is tijd om de Checkout in te stellen. Een checkout is het laatste deel van een e-commerce website dat de klant in staat stelt om de producten die hij eerder in zijn winkelwagentje heeft geplaatst of die hij van plan is te kopen, aan te schaffen.
Over hoe je de Checkout correct instelt, hebben we een speciale gids gemaakt die ik je aanraad om te raadplegen door hier te klikken.
Stap 8: Laten we de betaalmethoden PayPal en Stripe koppelen
Goed, we zijn aangekomen bij de laatste stap van het aankoopproces, namelijk de betaling. Om de klant in staat te stellen om de betaling uit te voeren, moeten we een betaalmethode aan onze e-commerce website koppelen; de meest gebruikte methoden zijn PayPal en Stripe. We hebben twee speciale gidsen gemaakt waarin we uitleggen hoe je deze twee betaalmethoden aan Framework360 kunt koppelen. Om ze te raadplegen, klik op de onderstaande links:
- Hoe PayPal aan onze website gemaakt met Framework360 te koppelen
- Hoe Stripe aan onze website gemaakt met Framework360 te koppelen
Stap 9: Laten we een kortingscoupon maken
Tenslotte is het belangrijk om te vermelden dat Framework360 ons ook de mogelijkheid biedt om een kortingscoupon te creëren die klanten kunnen gebruiken tijdens het kopen op onze e-commerce. Ook over dit onderwerp hebben we besloten een speciale gids te maken die je kunt raadplegen door hier te klikken.
