Gemakkelijke e-commerce met Magento

Honderden e-commerce systemen bestaan, maar slechts weinigen kunnen de kracht van Magento evenaren. In deze screencast, Ik zal demonstreren hoe Magento naar een lokale host kan worden gedownload en geïnstalleerd, een aantal van de site-opties kan worden geconfigureerd en eenvoudige en configureerbare producten en categorieën voor onze test-e-commercesite kunnen worden gemaakt.

screencast

Waarom Magento gebruiken?

Nou, er zijn een paar goede redenen om Magento te gebruiken:

  • Een eenvoudige intuïtieve interface
  • Eenvoudig te downloaden, installeren en onderhouden
  • Gebouwd op huidige technologieën in tegenstelling tot andere systemen.
  • Meerdere sitefunctionaliteit
  • En het beste van alles ... Het is gratis en open source!

Voorbereiding

Zoals met alle succesvolle dingen in het leven, is voorbereiding de sleutel! Voordat we Magento kunnen installeren, moeten we een database opzetten op onze server. Met phpmyadmin creëren we een nieuwe database genaamd "magento". We zullen dit later gebruiken wanneer we Magento komen installeren.

Magento downloaden / installeren

Zodra onze database op onze server is ingesteld, is de volgende stap om Magento zelf te downloaden. Om dat te doen, moeten we naar de downloadpagina op de Magento-website gaan. Voor deze zelfstudie downloaden we de volledige versie in ZIP-indeling. Zodra je het hebt gedownload, unzip je het in de map van je keuze.

Nu we de bestanden op onze server hebben is het tijd om Magento te installeren, hiervoor gaan we naar http: // localhost / magento (of welke map je ook gebruikt) in je webbrowser.

Accepteer de TOC's en ga verder op de volgende pagina.

Kies de instellingen die op jou van toepassing zijn en klik op Doorgaan.

Tot nu toe goed ... Vul nu de verbindingsinstellingen van de database in. Zorg ervoor dat u Use Web Server (Apache) Rewrites gebruikt voor extra SEO-vriendelijkheid en als u het standaardtoegangsadres voor uw backend wilt wijzigen van / admin, wijzigt u het veld Beheerderspad.

Vul de inloggegevens in die u voor uw account wilt gebruiken en voer desgewenst een aangepaste coderingssleutel in, laat dit anders leeg en Magento maakt er een voor u.

Geweldig, nu is Magento op je server geïnstalleerd, als je lokaal hebt geïnstalleerd, is er nog een laatste stap die je moet nemen voordat je kunt inloggen ...

Ga in je Magento-map naar app / code / kern / Mage / Core / Model / Session / Abstract / Varien.php

Zoek het session_set_cookie_params-codeblok (regel 78) en vervang het door deze code:

 session_set_cookie_params ($ this-> getCookie () -> getLifetime (), $ this-> getCookie () -> getPath () // $ this-> getCookie () -> getDomain (), // $ this-> getCookie ( ) -> isSecure (), // $ this-> getCookie () -> getHttponly ());

Op een juiste webhost hoeft u dit niet te doen! Omdat we echter aan localhost werken, moeten we dit doen om een ​​cookie-probleem aan te pakken.

Fiscale regels

Als u onze verschillende belastingniveaus wilt instellen, gaat u naar het tabblad Belastingszones en tarieven beheren onder Verkoop en raquo. Als de regel voor uw land niet bestaat of recentelijk is gewijzigd, klikt u op 'Nieuw belastingpercentage toevoegen'.

Sla uw nieuwe belastingregel op en u bent klaar om te gaan!

Categorieën

Om een ​​nieuwe categorie te maken, gaan we naar het tabblad Catalog in de navigatie en selecteren we Categorieën beheren. Van daaruit kunnen we nieuwe categorieën beheren en toevoegen.

Om onze nieuwe categorie te maken, moeten we klikken Subcategorie toevoegen en vul de details in, zoals de afbeelding hieronder, en zorg ervoor dat Is Actief in Ja is.

producten

Producten zijn de sleutel tot een site, maar in Magento waren er meerdere producttypen, zoals hieronder weergegeven ... Om een ​​nieuw product te maken, moeten we dat doen Catalogus tabblad op de navigatie en selecteer Beheer producten. En klik eindelijk op Voeg product toe

Simpele producten

Dit zijn de producten die geen opties hebben, zoals dvd. Als u ons eenvoudige product wilt maken, selecteert u Standaard voor de kenmerkenset en Eenvoudig product voor het producttype en klikt u op Doorgaan.

Algemeen tabblad

  1. Naam: de naam van ons nieuwe product
  2. Beschrijving: de hoofdtekstbeschrijving van het product; de plek om het product en al zijn functies echt te verkopen!
  3. Korte beschrijving: het snelle overzicht dat net onder de prijs op de productpagina verschijnt; de plek om de aandacht van kopers te trekken
  4. SKU: de voorraadcode voor het product
  5. Gewicht: het gewicht van het product. Dit kan kilo's, ton of wat je maar wilt, zolang je uniformiteit behoudt voor al je producten
  6. Fabrikant: Standaard leeg, maar fabrikanten kunnen worden toegevoegd via het tabblad Beheren Attributen.
  7. Kleur: Standaard leeg, maar nogmaals, zoals de fabrikanten kunnen worden toegevoegd via het tabblad Beheren Attributen
  8. Product als nieuwe datum instellen: stelt het product in op nieuw vanaf de datum die u invoert.
  9. Product als nieuwe datum instellen: Stelt in wanneer het product als nieuw eindigt.
  10. Status: als het product is ingeschakeld en wordt weergegeven op de website of als het is uitgeschakeld.
  11. URL-sleutel: de aangepaste optie voor het schrijven van de URL voor uw product.
  12. Zichtbaarheid: waar het product kan worden gevonden door uw bezoekers;
    • Nergens: het product verschijnt niet op de website.
    • Catalogus: het product verschijnt op de website maar niet in de zoekresultaten.
    • Zoeken: het product verschijnt niet op de website, maar verschijnt in de zoekresultaten.
    • Catalogus, Zoeken: het product verschijnt op de website en in de zoekresultaten.
  13. Cadeaubon toestaan:
    • Ja: hiermee kan een cadeaubericht worden verzonden
    • Nee: staat geen geschenkboodschap toe
    • Config: gebruik de configuratie van de site

Prijs Tab

  1. Prijs: de prijs van ons product
  2. Speciale prijs: aanbiedingen op producten voor beperkte tijden.
  3. Speciale prijs vanaf datum: de datum waarop de speciale prijs begint.
  4. Speciale prijs tot datum: de datum waarop de speciale prijs eindigt.
  5. Kosten: de kosten van het product.
  6. Belastingklasse: als uw product belasting moet toevoegen, moet u belastingplichtige goederen selecteren.
  7. Laagprijs: Hiermee kunt u bulkkortingen instellen. Klik Voeg een niveau toe om kwantumkortingen toe te voegen.
  8. Google Checkout: kunnen bezoekers dit product kopen met Google Checkout.

Meta Informatie Tab

  1. Metatitel: informatie die wordt weergegeven in de label.</li> <li>Meta-trefwoorden: trefwoorden die van toepassing zijn op uw product.</li> <li>Meta-beschrijving: een korte beschrijving van uw product dat wordt weergegeven op pagina's met zoekmachine-resultaten.</li> </ol> <h4>Afbeeldingen Tab</h4> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_16.jpg"> <p>Afbeeldingen zijn een belangrijk onderdeel van uw product en hoe beter u kunt krijgen, des te meer kans u heeft om een ​​uitverkoop te doen, Magento zorgt ervoor dat meerdere afbeeldingen kunnen worden geüpload en specifieke afbeeldingen kunnen worden geüpload voor de basisafbeelding, de kleine afbeelding en de miniatuurweergave. , evenals het toestaan ​​van een label. Als u een afbeelding wilt verwijderen, klikt u gewoon op het selectievakje Uitsluiten om te verbergen of Verwijderen om te verwijderen.</p> <ul> <li>Basisafbeelding: de hoofdafbeelding die op de productpagina wordt weergegeven.</li> <li>Kleine afbeelding: de afbeelding die wordt weergegeven in de categorieën / zoekweergave.</li> <li>Miniatuur: de miniatuurweergave van het product.</li> </ul> <h4>Ontwerptab</h4> <p>Tenzij je een sjabloon voor je Magento-winkel gebruikt, is het het beste om deze te missen, maar voor iedereen die nieuwsgierig is, kun je op het tabblad Ontwerp thema's gebruiken die je hebt ingesteld en kun je ook actieve datums kiezen zoals het veranderen van de pagina-indeling in verschillende kolomblokken, enzovoort.</p> <h4>Voorraad tabblad</h4> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_17.jpg"> <ol> <li>Voorraad beheren: als u voorraadniveaus wilt volgen en beheren, laat u deze set op Ja staan</li> <li>Aantal: de hoeveelheid product die u heeft.</li> <li>Beschikbaarheid van de voorraad: als het product in voorraad is of niet. Als u dit instelt op Niet in voorraad, wordt het product niet op de website verborgen!</li> </ol> <p>De andere opties kunt u het beste overlaten aan de configuratie van de site, maar ze zijn allemaal vrij voor de hand als u ze naar uw wensen wilt instellen. </p> <h4>Categorieën Tab</h4> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_18.jpg"> <p>Uw product kan in meerdere categorieën voorkomen; Klik eenvoudigweg op het selectievakje van de categorie waarin u deze wilt weergeven!</p> <h4>Gerelateerde producten / Up-sells / Cross-sells</h4> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_19.jpg"> <p>Met gerelateerde producten, up-sells en cross-sells is de interface om toe te voegen hetzelfde, om een ​​product toe te voegen, selecteert u eenvoudig een veld waarop u wilt zoeken en klikt u op de zoekknop. Er verschijnt een lijst met producten die aan uw criteria voldoen. Klik op het selectievakje naast het product en het zal verschijnen als een gerelateerd product / up-sell of cross-sell zoals van toepassing.</p> <h4>Productbeoordelingen / Productlabels / Klanten Tagged Product</h4> <p>Deze worden allemaal door gebruikers toegevoegd en kunnen via de tabbladen worden bekeken. </p> <h4>Aangepaste opties</h4> <p>Dit zijn aangepaste opties die u aan uw product kunt toevoegen. Klik op om een ​​aangepaste optie toe te voegen <strong>Nieuwe optie toevoegen</strong> en vul de details in.</p> <h3>Attributen & kenmerksets beheren</h3> <p>Attributen zijn de opties waaruit uw producten bestaan, bijvoorbeeld kleur, gewicht enzovoort. Kenmerkensets zijn sets attributen die een volledig product vormen en ons in staat stellen om configureerbare producten te maken.</p> <h4>attributen</h4> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_20.jpg"> <p>Om een ​​nieuw attribuut te maken / onze huidige attributen te bekijken, moeten we naar het tabblad Catalog van de navigatie gaan en Attributen selecteren en vervolgens Attributen beheren. Om een ​​attribuut te bekijken, klikt u gewoon op de rij, om een ​​nieuw attribuut te maken, klikt u op de <strong>Nieuw kenmerk toevoegen</strong> tab.</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_21.jpg"> <h4>Eigenschappen Tab</h4> <p>Het is het beste om een ​​conventie te gebruiken bij het benoemen van uw kenmerken. Naarmate uw lijst groeit, wordt het gemakkelijker om te vinden waarnaar u op zoek bent. Ik gebruik graag <i>options_option_product</i> welke voor dit product options_colour_nettuts_shirt zou zijn. We moeten onze scope op globaal en Catalog Input Type instellen op Dropdown om ons configureerbare product (en) te maken. We passen onze Attribuut alleen toe op eenvoudige producten en configureerbare producten. Om dit kenmerk in onze configureerbare producten te gebruiken, moeten we Ja selecteren op de <strong>Gebruik om configureerbaar product te maken</strong> veld. We moeten ook Ja selecteren op de pagina Zichtbaar op productoverzicht op het front-endveld om het attribuut zichtbaar te maken. </p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_22.jpg"> <h4>Beheer Label / Opties Tab</h4> <p>Vervolgens moeten we de opties instellen die onze gebruiker kan kiezen bij het kiezen van het product. In ons voorbeeld gebruiken we Kleur als onze productoptie.</p> <p>De titel is wat de bezoeker boven de vervolgkeuzelijst ziet, met Magento kunnen we definiëren wat de beheerder ziet en wat de gebruiker ziet, waardoor het gemakkelijker wordt om opties te volgen met aanvullende informatie, in het voorbeeld dat we onze titel, kleur hebben genoemd. Als we de standaard winkelweergave leeg laten, wordt gekopieerd wat we in Admin hebben ingevoerd.</p> <p>Om de opties voor ons product toe te voegen, klikt u in ons voorbeeld op de knop Optie toevoegen voor het aantal opties dat u nodig heeft. Net als de titel als we de standaard winkelweergave leeg laten, zal deze kopiëren wat we in Admin hebben ingevoerd, maar we kunnen de Admin-veld om meer informatie toe te voegen, waardoor het bijvoorbeeld gemakkelijk is om orders uit te voeren. We gebruiken de positie om onze opties te bestellen en in het vakje Standaard is radio om te definiëren welke optie standaard is. We kunnen eenvoudig elke optie verwijderen met de knop rechts. Zodra we alle gewenste opties hebben, klikt u op Opslaan om terug te gaan naar de pagina met kenmerken.</p> <h4>Kenmerksets</h4> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_23.jpg"> <p>Vervolgens moeten we onze attributenset instellen om ons configureerbare product te maken. We navigeren naar het tabblad Catalog in de navigatie en selecteren Attributen en beheren vervolgens attributenreeksen. Net als de pagina Attributen hebben we een lijst met onze huidige attributensets; Standaard zou alleen moeten verschijnen. Klik op Nieuwe set toevoegen.</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_24.jpg"> <p>Opnieuw zoals onze Attribuut zouden we een conventie moeten gebruiken om onze Attribuutset te noemen ... dus passend bij onze Attribuut; options_size_tshirts. Omdat we geen andere Sets hebben, gaan we de nieuwe standaard gebruiken.</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_25.jpg"> <p>Om onze Attribuut in onze Set op te nemen, hoeven we alleen maar op de Algemene groep te klikken en deze in de rechterlijst neer te zetten. Klik op opslaan en onze set is voltooid. Tot nu toe goed ... </p> <h3>Een configureerbaar product maken</h3> <p>Het creëren van een configureerbaar product lijkt sterk op het maken van een eenvoudig product. Om te beginnen creëren we een nieuw product. Maar we moeten de attributenset veranderen naar degene die we zojuist hebben gemaakt en het producttype naar configureerbaar product en klik op Doorgaan.</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_26.jpg"> <p>Vervolgens moeten we de kenmerken kiezen die we in ons product willen gebruiken. Alleen attributen met een bereik van Globaal, type dropdown en de optie om een ​​configureerbare productset aan te maken, kunnen worden gebruikt.</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_27.jpg"> <p>De enige tabbladen die worden gewijzigd, zijn het tabblad Voorraad en er is een nieuw tabblad toegevoegd met de naam Geassocieerde producten, waar we onze opties zullen toevoegen. Zodra we al onze gegevens hebben ingevuld, moeten we opslaan en doorgaan met bewerken voordat we onze bijbehorende producten kunnen toevoegen. In tegenstelling tot sommige andere e-commercesystemen, maakt Magento eenvoudige producten die verborgen zijn om een ​​configureerbaar product te maken.</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_28.jpg"> <p>Om de opties te maken gebruiken we de tool "Snelle eenvoudige productcreatie" om onze eenvoudige productopties te maken. Voor de naam en SKU-velden kun je Magento deze automatisch laten genereren, maar voor extra controle stel ik voor dat je deze zelf invult. In het voorbeeld maken we een optie voor een groen shirt. We hebben Naam, SKU, Gewicht ingevuld en het product ingesteld op Ingeschakeld. Echter <strong>we moeten de zichtbaarheid van ons product nergens instellen</strong>. In de vervolgkeuzelijst selecteren we de attribuutoptie waarvoor we creëren en stellen we de prijs in. Voor de standaardoptie geven we geen waarde op en gebruiken we de prijs die we hebben ingesteld voor ons configureerbare product, maar voor de andere opties voeren we het verschil in tussen het configureerbare product en de optie. Dus als de groene top $ 15 is en ons configureerbare product $ 20 is, dan moeten we -5,00 invoeren als onze prijs. Vervolgens moeten we de hoeveelheid voor de optie en de voorraadbeschikbaarheid instellen op In voorraad en klikken op Snel maken. We herhalen dit proces totdat we al onze opties hebben toegevoegd en op Opslaan hebben geklikt. Ons configureerbare product is nu compleet. Als we onze productenpagina bekijken, kunnen we zien dat Magento de opties heeft gemaakt als eenvoudige producten die voor ons verborgen zijn. Het bijhouden van de voorraad veel gemakkelijker maken!</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_29.jpg"> <h3>Gefeliciteerd</h3> <p>Goed gedaan, je hebt zojuist Magento gedownload en geïnstalleerd in je lokale host, je hebt een eenvoudig product gemaakt, een aangepast attribuut en attributenset, een configureerbaar product met je aangepaste attribuut en een categorie. Ik hoop dat je enkele basisprincipes van Magento hebt geleerd en ik wens je het allerbeste tijdens je inspanningen. Als u vragen heeft, kunt u hieronder een reactie achterlaten en ik zal mijn best doen om u te helpen!</p> <p>Als u een echte doorzetter bent en graag ingaat op een aantal van de meer geavanceerde onderwerpen of meer wilt leren dan stel ik voor dat u de Knowledge Base op de Magento-website en de Designershandleiding raadpleegt als u geïnteresseerd bent in het aanpassen Magento meer.</p> <ul> <li>Volg ons op Twitter, of abonneer je op de NETTUTS RSS-feed voor meer dagelijkse webontwikkelingen, tuts en artikelen.</li> </ul> <p> <br> </p> <div class="rek-block"> <center> <ins class="adsbygoogle" style="display:inline-block;width:580px;height:400px" data-ad-client="ca-pub-3810161443300697" data-ad-slot="9434875811"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </center> </div> <div class="h-alltags"> <a href="articles/code">Code</a> </div> </div> </div> </div> </div> <div class="next_posts clearfix"> <div class="n_post"> <div class="next_posts-h1 left_nh1"><a href="/articles/music/easy-fixes-for-modelled-guitar-basix.html">Eenvoudige oplossingen voor gemodelleerde gitaar - Basix</a></div> <div class="next_posts-img" style="background-image: url('//accentsconagua.com/img/images_26_2/easy-fixes-for-modelled-guitar-basix_5.png');"></div> </div> <div class="n_post"> <div class="next_posts-h1 right_nh1"><a href="/articles/code/easy-digital-downloads-tools.html">Eenvoudige digitale downloads hulpmiddelen</a></div> <div class="next_posts-img" style="background-image: url('//accentsconagua.com/img/images_10/easy-digital-downloads-tools_13.jpg');"></div> </div> </div> <footer> <div class="container"> <div class="footer-langs"> <ul class="site-langs-list"> <li><a href="https://www.accentsconagua.com"><i class="flag flag-DE"></i>Deutsch</a></li> <li><a href="https://fr.accentsconagua.com"><i class="flag flag-FR"></i>Français</a></li> <li><a href="https://nl.accentsconagua.com"><i class="flag flag-NL"></i>Nederlands</a></li> <li><a href="https://no.accentsconagua.com"><i class="flag flag-NO"></i>Norsk</a></li> <li><a href="https://sv.accentsconagua.com"><i class="flag flag-SE"></i>Svenska</a></li> <li><a href="https://it.accentsconagua.com"><i class="flag flag-IT"></i>Italiano</a></li> <li><a href="https://es.accentsconagua.com"><i class="flag flag-ES"></i>Español</a></li> <li><a href="https://ro.accentsconagua.com"><i class="flag flag-RO"></i>Românesc</a></li> </ul> </div> <div class="h-block"><a href="/">nl.accentsconagua.com</a><div class="h-block-a"></div></div> <div class="footer-text"> Interessante informatie en nuttige tips over programmeren. Website ontwikkeling, webdesign en webontwikkeling. Photoshop-zelfstudies. Creatie van computerspellen en mobiele applicaties. Word een volledig professionele programmeur. </div> </div> </footer> <div class="search"> <img class="searchico" src="//accentsconagua.com/img/search.svg" alt=""> </div> <div class="modal"> <div class="modal-content"> <span class="close-button">×</span> <input class="searchmain" type="text" id="search-input" placeholder="Zoeken..."> <ul class="searchli" id="results-container"></ul> </div> </div> <link rel="stylesheet" href="css/flags.css"> <link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.css" /> <script src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.js"></script> <script> window.addEventListener("load", function(){ window.cookieconsent.initialise({ "palette": { "popup": { "background": "#edeff5", "text": "#838391" }, "button": { "background": "#4b81e8" } }, "theme": "classic", "position": "bottom-right" })}); </script> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <script src="js/scripts.min.js"></script> <script src="js/common.js"></script> <link rel="stylesheet" href="css/fontawesome-all.min.css"> <script> var modal = document.querySelector(".modal"); var trigger = document.querySelector(".search"); var closeButton = document.querySelector(".close-button"); function toggleModal() { modal.classList.toggle("show-modal"); } function windowOnClick(event) { if (event.target === modal) { toggleModal(); } } trigger.addEventListener("click", toggleModal); closeButton.addEventListener("click", toggleModal); window.addEventListener("click", windowOnClick); </script> <script src="https://unpkg.com/simple-jekyll-search@1.5.0/dest/simple-jekyll-search.min.js"></script> <script> SimpleJekyllSearch({ searchInput: document.getElementById('search-input'), resultsContainer: document.getElementById('results-container'), json: '/search.json', searchResultTemplate: '<li><a href="{url}">{title}</a></li>' }) </script> <script src="jquery.unveil2.min.js"></script> <script> $('img').unveil(); </script> </body> </html>