Facile E-Commerce con Magento

Esistono centinaia di sistemi di e-commerce, ma pochissimi possono eguagliare la potenza di Magento. In questo screencast, Mostrerò come scaricare e installare Magento su un host locale, configurare alcune delle opzioni del sito e creare prodotti e categorie semplici e configurabili per il nostro sito di e-commerce di prova.

screencast

Perché usare Magento?

Bene, ci sono alcuni ottimi motivi per usare Magento:

  • Un'interfaccia intuitiva semplice
  • Facile da scaricare, installare e mantenere
  • Costruito su tecnologie attuali a differenza di altri sistemi.
  • Funzionalità di siti multipli
  • E soprattutto ... È gratuito e open source!

Preparazione

Come per tutte le cose di successo nella vita, la preparazione è la chiave! Prima di poter installare Magento, è necessario configurare un database sul nostro server. Usando phpmyadmin creiamo un nuovo database chiamato "magento". Lo useremo più tardi quando verremo a installare Magento.

Download / Installazione di Magento

Una volta che il nostro database è stato impostato sul nostro server, il prossimo passo è scaricare Magento stesso. Per farlo dobbiamo andare alla pagina di download sul sito Magento. Per questo tutorial scaricheremo il Full Release in formato ZIP. Una volta scaricato, decomprimilo nella cartella di tua scelta.

Ora che abbiamo i file sul nostro server è ora di installare Magento, per farlo andiamo a http: // localhost / magento (o qualsiasi altra cartella che usi) nel tuo browser web.

Accetta i TOC e continua nella pagina successiva.

Scegli le impostazioni applicabili e fai clic su continua.

Andando bene finora ... Ora inserisci le impostazioni di connessione del database. Assicurati di premere Usa Web Server (Apache) Riscrivi per maggiore cordialità SEO e se si desidera modificare l'indirizzo di accesso predefinito per il proprio back-end da / admin modificare il campo Percorso Admin.

Inserisci i dettagli di accesso che desideri utilizzare per il tuo account e inserisci una chiave di crittografia personalizzata, se preferisci, altrimenti lasciala vuota e Magento ne realizzerà uno per te.

Bene, ora Magento è stato installato sul tuo server, se hai installato localmente c'è un ultimo passaggio che devi compiere prima di poter accedere ...

Nella tua cartella Magento vai su app / code / core / Mage / Core / Model / Session / Abstract / Varien.php

Trova il blocco di codice session_set_cookie_params (Line 78) e sostituiscilo con questo codice:

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

Su un webhost adeguato non è necessario farlo! Tuttavia, dato che stiamo lavorando su localhost, dobbiamo farlo per risolvere un problema relativo ai cookie.

Regole fiscali

Per impostare i nostri diversi livelli di imposta, dobbiamo andare alla scheda Gestisci zone e tariffe in Vendite & raquo fiscale. Se la regola per il tuo stato non esiste o è stata modificata di recente, fai clic su "Aggiungi nuova aliquota fiscale".

Salva la tua nuova regola fiscale e sei a posto!

categorie

Per creare una nuova categoria, dobbiamo andare alla scheda Catalogo sulla navigazione e selezionare Gestisci categorie. Da lì possiamo gestire e aggiungere nuove categorie.

Per creare la nostra nuova categoria, dobbiamo fare clic Aggiungi sottocategoria e inserisci i dettagli come nell'immagine sottostante, assicurandoti di cambiare È attivo su Sì.

Prodotti

I prodotti sono la chiave di un sito, ma in Magento c'erano più tipi di prodotti, come mostrato di seguito ... Per creare un nuovo prodotto abbiamo bisogno di Scheda Catalogo sulla navigazione e selezionare Gestisci prodotti. E infine clicca Aggiungi prodotto

Prodotti semplici

Questi sono i prodotti che non hanno opzioni, come il DVD. Per creare il nostro prodotto semplice selezionare Predefinito per il set di attributi e Prodotto semplice per Tipo prodotto e fare clic su Continua.

Scheda Generale

  1. Nome: il nome del nostro nuovo prodotto
  2. Descrizione: la descrizione del corpo principale del prodotto; il posto dove vendere davvero il prodotto e tutte le sue caratteristiche!
  3. Breve descrizione: la rapida panoramica che appare appena sotto il prezzo sulla pagina del prodotto; il posto dove attirare l'attenzione degli acquirenti
  4. SKU: il codice di inventario per il prodotto
  5. Peso: il peso del prodotto. Può trattarsi di chili, tonnellate o qualsiasi cosa tu desideri purché tu mantenga l'uniformità su tutti i tuoi prodotti
  6. Produttore: vuoto per impostazione predefinita, ma i produttori possono essere aggiunti tramite la scheda Gestisci attributi.
  7. Colore: vuoto di default ma ancora una volta come i produttori possono essere aggiunti tramite la scheda Gestisci attributi
  8. Imposta prodotto come nuovo dalla data: imposta il prodotto su nuovo dalla data inserita.
  9. Imposta prodotto come nuovo: viene impostato quando il prodotto termina con una nuova.
  10. Stato: se il prodotto è abilitato e visualizzato sul sito Web o se è disabilitato.
  11. Chiave URL: l'opzione personalizzata per la modalità di scrittura dell'URL per il tuo prodotto.
  12. Visibilità: dove il prodotto può essere trovato dai tuoi visitatori;
    • Da nessuna parte: il prodotto non viene visualizzato sul sito Web.
    • Catalogo: il prodotto verrà visualizzato sul sito Web ma non nei risultati di ricerca.
    • Cerca: il prodotto non verrà visualizzato sul sito Web ma verrà visualizzato nei risultati di ricerca.
    • Catalogo, ricerca: il prodotto verrà visualizzato sul sito Web e nei risultati di ricerca.
  13. Consenti messaggio regalo:
    • Sì: consente un messaggio regalo
    • No: non consente un messaggio regalo
    • Config: usa la configurazione del sito

Tab Prezzo

  1. Prezzo: il prezzo del nostro prodotto
  2. Prezzo speciale: offerte su prodotti per tempi limitati.
  3. Special Price From Date: la data in cui inizia il prezzo speciale.
  4. Prezzo speciale fino alla data: la data in cui termina il prezzo speciale.
  5. Costo: il costo del prodotto.
  6. Classe fiscale: se il prodotto richiede l'imposta aggiunta, è necessario selezionare i beni tassabili.
  7. Prezzo di base: consente di impostare sconti collettivi. Clic Aggiungi livello aggiungere sconti sulla quantità.
  8. Google Checkout: i visitatori possono acquistare questo prodotto utilizzando Google Checkout.

Scheda Meta delle informazioni

  1. Meta titolo: informazioni che appaiono nel etichetta.</li> <li>Parole chiave Meta: parole chiave che si applicano al tuo prodotto.</li> <li>Meta Description: una breve descrizione del prodotto che appare sulle pagine dei risultati del motore di ricerca.</li> </ol> <h4>Scheda Immagini</h4> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_16.jpg"> <p>Le immagini sono una parte fondamentale del tuo prodotto e la migliore qualità puoi ottenere più possibilità hai di fare una vendita, Magento consente di caricare più immagini e immagini specifiche da caricare per l'immagine di base, la piccola immagine e l'anteprima , oltre a consentire un'etichetta. Se vuoi rimuovere un'immagine semplicemente fai clic sulla casella Escludi per nascondere o Rimuovi per eliminare.</p> <ul> <li>Immagine base: l'immagine principale che appare sulla pagina del prodotto.</li> <li>Immagine piccola: l'immagine che appare nelle categorie / vista di ricerca.</li> <li>Miniatura: la miniatura del prodotto.</li> </ul> <h4>Scheda di progettazione</h4> <p>A meno che tu non stia utilizzando un modello per il tuo negozio Magento, è meglio dare a questo uno a cui manchi, ma per tutti coloro che sono curiosi la scheda Progettazione ti consente di usare i temi che hai impostato e ti permette di scegliere anche le date attive come cambiare il layout della pagina in diversi blocchi di colonne e così via.</p> <h4>Scheda Inventario</h4> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_17.jpg"> <ol> <li>Gestisci magazzino: se desideri monitorare e gestire i livelli di scorte, lascia questo insieme su Sì</li> <li>Qtà: la quantità di prodotto che hai.</li> <li>Disponibilità a magazzino: se il prodotto è disponibile o meno. L'impostazione di questo valore su Non disponibile non nasconderà il prodotto sul sito Web!</li> </ol> <p>Le altre opzioni sono meglio lasciate alla configurazione del sito, tuttavia sono tutte abbastanza auto esplicative se si desidera impostarle in base alle proprie esigenze. </p> <h4>Scheda Categorie</h4> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_18.jpg"> <p>Il tuo prodotto può apparire in più categorie; fai semplicemente clic sulla casella di controllo della categoria in cui desideri che venga visualizzata!</p> <h4>Prodotti correlati / Up-sells / Cross-sells</h4> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_19.jpg"> <p>Con prodotti correlati, up-sell e cross-sells l'interfaccia da aggiungere è la stessa, per aggiungere un prodotto basta selezionare un campo che si desidera cercare e fare clic sul pulsante di ricerca, apparirà un elenco di prodotti che corrispondono ai criteri. Fai clic sulla casella di controllo accanto al prodotto e verrà visualizzato come prodotto correlato / up-sell o cross-sell a seconda dei casi.</p> <h4>Recensioni prodotto / Tag prodotto / Clienti taggati Prodotto</h4> <p>Questi sono tutti aggiunti dagli utenti e possono essere visualizzati dalle schede. </p> <h4>Opzioni personalizzate</h4> <p>Queste sono opzioni personalizzate che puoi aggiungere al tuo prodotto. Per aggiungere un'opzione personalizzata clicca <strong>Aggiungi nuova opzione</strong> e inserisci i dettagli.</p> <h3>Gestione di attributi e set di attributi</h3> <p>Gli attributi sono le opzioni che compongono i tuoi prodotti, ad esempio colore, peso e così via. Gli insiemi di attributi sono insiemi di attributi che costituiscono un intero prodotto e ci consentono di realizzare prodotti configurabili.</p> <h4>attributi</h4> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_20.jpg"> <p>Per creare un nuovo attributo / visualizzare i nostri attributi attuali dobbiamo andare alla scheda Catalogo sulla navigazione e selezionare Attributi e quindi Gestisci attributi. Per visualizzare un attributo è sufficiente fare clic sulla riga, per creare un nuovo attributo fare clic su <strong>Aggiungi un nuovo attributo</strong> linguetta.</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_21.jpg"> <h4>Scheda Proprietà</h4> <p>È preferibile utilizzare una convenzione quando si assegnano i nomi agli attributi, man mano che l'elenco cresce, sarà più facile trovare ciò che si sta cercando. Mi piace usare <i>options_option_product</i> che per questo prodotto sarebbe options_colour_nettuts_shirt. Dobbiamo impostare il nostro campo di applicazione su Tipo di input globale e catalogo su Dropdown per creare i nostri prodotti configurabili. Applichiamo il nostro attributo solo a prodotti semplici e prodotti configurabili. Per poter utilizzare questo attributo nei nostri prodotti configurabili, dobbiamo scegliere Sì sul <strong>Utilizzare per creare un prodotto configurabile</strong> campo. Inoltre, per rendere visibile l'attributo, dobbiamo selezionare Sì nella pagina Visibile sulla pagina di visualizzazione del prodotto sul front-end. </p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_22.jpg"> <h4>Gestisci etichetta / scheda Opzioni</h4> <p>Quindi abbiamo bisogno di impostare le opzioni che il nostro utente può selezionare quando sceglie il prodotto. Nel nostro esempio utilizziamo il colore come opzione del nostro prodotto.</p> <p>Il titolo è ciò che il visitatore vedrà sopra il menu a discesa, con Magento possiamo definire ciò che l'amministratore vede e ciò che l'utente vede rendendo più facile tracciare le opzioni con informazioni aggiuntive, nell'esempio che abbiamo chiamato il nostro Titolo, Colore. Se lasciamo vuota la vista dell'archivio predefinito, copierà ciò che abbiamo inserito nell'amministratore.</p> <p>Per aggiungere le opzioni per il nostro prodotto, fai clic sul pulsante Aggiungi opzione per il numero di opzioni necessarie, nel nostro esempio 3. Come il titolo se lasciamo vuota la vista dell'archivio predefinito copierà ciò che abbiamo inserito in Admin ma possiamo usare il Campo di amministrazione per aggiungere ulteriori informazioni, rendendo semplice l'evasione degli ordini, ad esempio. Usiamo la posizione per ordinare le nostre opzioni e la casella radio È predefinito per definire quale opzione è predefinita. Possiamo facilmente cancellare qualsiasi opzione usando il pulsante a destra. Una volta che avremo tutte le opzioni che vogliamo, fai clic su Salva per tornare alla pagina degli attributi.</p> <h4>Set di attributi</h4> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_23.jpg"> <p>Quindi dobbiamo impostare il nostro set di attributi per creare il nostro prodotto configurabile. Navighiamo alla scheda Catalogo sulla navigazione e selezioniamo Attributi e quindi Gestisci set di attributi. Come la pagina Attributi, abbiamo una lista dei nostri attuali Attributi Set; L'impostazione predefinita dovrebbe essere visualizzata solo Fai clic su Aggiungi nuovo set.</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_24.jpg"> <p>Di nuovo come il nostro Attributo dovremmo usare una convenzione per nominare il nostro Set di Attributi ... in modo che corrisponda al nostro Attributo; options_size_tshirts. Dato che non abbiamo altri Set, baseremo il nuovo su Default.</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_25.jpg"> <p>Per includere il nostro Attributo nel nostro Set abbiamo semplicemente bisogno di cliccare e rilasciarlo nel gruppo Generale dalla lista di destra. Fai clic su Salva e il nostro set è completo. Andando bene finora ... </p> <h3>Creare un prodotto configurabile</h3> <p>La creazione di un prodotto configurabile è molto simile alla creazione di un prodotto semplice. Per iniziare creiamo un nuovo prodotto. Ma abbiamo bisogno di cambiare il set di attributi in quello che abbiamo appena creato e il tipo di prodotto in Prodotto configurabile e fare clic su continua.</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_26.jpg"> <p>Quindi dobbiamo scegliere gli attributi che vorremmo usare nel nostro prodotto. Possono essere utilizzati solo gli attributi con un ambito globale, il tipo di menu a discesa e l'opzione per creare un set di prodotti configurabili su Sì.</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_27.jpg"> <p>Le uniche schede che cambiano sono la scheda Spazio pubblicitario e una nuova scheda è stata aggiunta denominata Prodotti associati, dove aggiungeremo le nostre opzioni. Una volta che abbiamo compilato tutti i nostri dettagli, dobbiamo salvare e continuare a modificare prima di poter iniziare ad aggiungere i nostri prodotti associati. A differenza di altri sistemi di e-commerce, Magento crea prodotti semplici nascosti per creare un prodotto configurabile.</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_28.jpg"> <p>Per creare le opzioni utilizzeremo lo strumento "Creazione rapida di prodotti semplice" per rendere disponibili le nostre opzioni di prodotto semplice. Per il nome e i campi SKU puoi lasciare che Magento li generi automaticamente, ma per un maggiore controllo ti suggerisco di riempire questi in te stesso. Nell'esempio stiamo creando un'opzione maglietta verde. Abbiamo inserito Nome, SKU, Peso e abbiamo impostato il prodotto su Abilitato. però <strong>dobbiamo impostare la visibilità del nostro prodotto verso il nulla</strong>. Dal menu a discesa selezioniamo l'opzione di attributo per la quale stiamo creando e impostiamo il prezzo. Per l'opzione predefinita non inseriamo un valore e useremo il prezzo che abbiamo impostato sul nostro prodotto configurabile, ma per le altre opzioni inseriamo la differenza tra il prodotto configurabile e l'opzione. Quindi, se il Green Top è $ 15 e il nostro prodotto configurabile è $ 20, allora dobbiamo inserire -5.00 come nostro prezzo. Abbiamo quindi bisogno di impostare la Qtà per l'opzione e la disponibilità di magazzino per In magazzino e fare clic su Creazione rapida. Ripetiamo questo processo fino a quando non abbiamo aggiunto tutte le nostre opzioni e facciamo clic su Salva. Il nostro prodotto configurabile è ora completo. Se visualizziamo la nostra pagina dei prodotti possiamo vedere che Magento ha creato le opzioni come prodotti semplici per noi che sono stati nascosti. Rendere molto più semplice il monitoraggio delle scorte!</p> <img src="//accentsconagua.com/img/images_27_6/easy-e-commerce-with-magento_29.jpg"> <h3>Congratulazioni</h3> <p>Ben fatto, hai appena scaricato e installato Magento sul tuo localhost, hai creato un prodotto semplice, un attributo personalizzato e un set di attributi, un prodotto configurabile usando il tuo attributo personalizzato e una categoria. Spero che tu abbia imparato alcune delle basi di Magento e ti auguro il meglio durante i tuoi sforzi. Se hai qualche domanda per favore lascia un commento qui sotto e farò del mio meglio per aiutarti!</p> <p>Se sei un vero go getter e vorresti approfondire alcuni degli argomenti più avanzati o vorresti saperne di più, ti suggerisco di consultare la Knowledge Base sul sito Magento e la Guida dei designer se sei interessato alla personalizzazione Magento di più.</p> <ul> <li>Seguici su Twitter o iscriviti al feed RSS di NETTUTS per ulteriori tuts e articoli di sviluppo web giornalieri.</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">Codice</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">Correzioni rapide per chitarra modellata - 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">Download digitali facili strumenti</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="/">it.accentsconagua.com</a><div class="h-block-a"></div></div> <div class="footer-text"> Informazioni interessanti e consigli utili sulla programmazione. Sviluppo di siti web, web design e sviluppo web. Tutorial di Photoshop. Creazione di giochi per computer e applicazioni mobili. Diventa un programmatore professionista da zero. </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="Ricerca..."> <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>