Tutorial: tworzenie e-sklepu na Magento

Wierzymy, że każdy może osiągnąć sukcesu w branży e-commerce. Jednym z najlepszych sposobów na zarabianie w Internecie jest prowadzenie e-sklepu. Posiadanie własnej strony daje wiele korzyści, np. niezależność.

Dlatego zaczeliśmy tą serię tutoriali na temat rozpoczęcia pracy z różnymi sklepami CMS. Dzisiaj będziemy mówili o Magento CMS. Opowiemy jak łatwo jest skonfigurować sklep Magento.

---

Jak zainstalować Magento CMS

Każdy CMS wymaga przesłania plików na hosting przed instalacją. Po zakończeniu przesyłania plików można przejść do procesu instalacji Magento. Otwórz i w pasku adresu przeglądarki wpisz URL domeny/ścieżkę do katalogu Magento. Powinieneś zobaczyć ekran powitalny aplikacji Sample Data Installer. Aby zainstalować Magento, postępuj zgodnie z poniższymi instrukcjami.

Wypełnij wszystkie informacje dotyczące hostingu i bazy danych.

Jeśli zgadzasz się na Warunki, kliknij "Zgadzam się i ustawiam Magento", aby kontynuować instalację.

Kliknij przycisk "Start Readiness Check", aby sprawdzić zgodność ustawień serwera z wymaganiami silnika Magento 2.

Po zakończeniu procesu kliknij w przycisk Dalej.

Tutaj musisz wprowadzić informacje, dotyczące bazy danych i ustawić niektóre ustawienia początkowe. Dodaj bazę danych - wprowadź nazwę hosta, nazwę bazy danych, użytkownika bazy danych i hasło. Skontaktuj się z dostawcą usług hostingowych, jeśli nie masz tych informacji.

Upewnij się, że masz utworzoną bazę danych dla instalacji Magento. Pamiętaj, powinna być jasne i bez żadnych tabel.

Jeśli wszystko jest poprawne, kliknij przycisk Dalej.

Dalej można zmienić adres panelu administracyjnego Magento i adres sklepu głównego. Inne ustawienia można pozostawić bez zmian.

Po zakończeniu kliknij przycisk Dalej.

Wybierz wymaganą strefę czasową, domyślną walutę i język magazynu. Można wybrać domyślne moduły, które powinny / nie powinny być instalowane, w sekcji Konfiguracja modułów dedykowanych. Zalecamy, aby nie wprowadzać zmian w tej sekcji.

Tutaj musisz podać dane osobowe właściciela sklepu. Musisz także określić dane logowania administratora serwisu..

Konfiguracja sklepu została wykonana. Naciśnij przycisk Zainstaluj teraz, aby rozpocząć proces instalacji sklepu.

Jest to ostatni etap instalacji. Skopiuj wygenerowany klucz szyfrujący i zipsz go w bezpiecznym miejscu.

---

Aktywacja szablonu

Otwórz panel administracyjny Magento i przejdź do menu Content > Configuration menu.

Na liście sklepów trzeba kliknąć opcję edycji Global-Main Website. Możesz też kliknąć edytować dla określonego widoku sklepu.

W domyślnym temacie kliknij rozwijaną Applied Theme, wybierz wymagany szablon, a następnie kliknij przycisk Zapisz konfigurację.

---

Konfiguracja logo

Wykonaj następujące aby skonfigurować logo domyślne .

Otwórz panel administracyjny Magento i wybierz z menu bocznego Content> Configuration.

Na liście sklepów trzeba kliknąć opcję edycji Global-Main Website. Możesz też kliknąć edytować dla określonego widoku sklepu.

Wybierz kartę "Nagłówek" i prześlij swoje logo.

Kliknij w przycisk "Zapisz konfigurację".

Aby zainstalować logo firmy, musisz przesłać plik zdjęcia do folderu /images w swoim temacie Magento.

Logo można zmienić przy użyciu modułu opcji szablonu.

Aby zmienić logo, kliknij w kartę Stores > Settings > Configuration

Następnie wybierz opcję TEMPLATEMONSTER > Theme Options w menu po lewej stronie, a następnie przejdź do interfejsu ustawień modułu.

Przejdź do karty General > Logo Settings.

---

Konfiguracja stron

Aby szablon wyglądał dokładnie tak, jak w Live Demo, trzeba skonfigurować strony sklepu w następny sposób. Udostępniamy wszystkie pliki kodem strony. Trzeba dodać je do panelu admina Magento zgodnie z instrukcjami poniżej, używając tabeli ustawień. Tabela ustawień znajduje się w sekcji informacji technicznych na stronie podglądu szablonu. Plik dokumentacji zawiera link do tej strony:

Strona domowa szablonu zwykle zawiera następujące elementy: banery, suwak, galeria itp.

Z menu głównego przejdź do zakładki Content> Pages. Tutaj znajdziesz wszystkie strony sklepu. Strona domowa, O nas i Obsługa klienta powinny być już dostępne, więc nie musisz ich dodawać. Wystarczy tylko zaktualizować zawartość stron HTML i XML. Otwórz dowolny z nich, aby uzyskać dostęp do zawartości.

Otwórz stronę i wybierz kartę Content. Zawiera kod HTML strony. Kod HTML strony można pobrać z odpowiedniego pliku źródłowego. Listę plików źródłowych zawartych w sekcji "Ustawienia szablonu" można zobaczyć na stronie podglądu szablonu. Skopiuj kod z pliku źródłowego i wklej go do obszaru zawartości.

Kiedy skończysz z kodem HTML, przejdź do zakładki "Design". Zawiera kod strony XML. Kod XML umożliwia dodawanie bloków i widżetów Magento do strony. Kod XML powinien być kopiowany w taki sam sposób jak HTML z pliku źródłowego. Skopiuj kod XML do obszaru "Layout Update XML".

Nie zapomnij wybrać prawidłową opcję dla "Layout".

Jeśli chcesz dodać nową stronę, kliknij przycisk "Add New Pag" w prawym górnym rogu.

---

Konfiguracja bloków statycznych

Po zakończeniu konfigurowania stron należy skonfigurować bloki statyczne. Procedura jest podobna: musisz skopiować kod z plików źródłowych i wkleić go do odpowiednich pól w panelu administracyjnym Magento. Musisz użyć podobnego tabela, ale dla bloków statycznych.

Identyfikator bloku może różnić się w instalacji Magento. Możesz uzyskać prawidłowy identyfikator bloku z sekcji Content > Blocks w panelu administracyjnym.

W menu górnym przejdź do zakładki Content > Blocks.

W prawym górnym rogu kliknij przycisk "Dodaj nowy blok", aby dodać nowy blok statyczny.

Określ nazwę i identyfikator bloku. Informacje o bloku można uzyskać w tabeli na stronie konfiguracji szablonu [sprawdź część konfiguracji strony].

Otwórz plik źródłowy bloku i skopiuj kod HTML do obszaru zawartości.

UWAGA: niektóre szablony nie zawierają żadnych bloków statycznych, więc tabela może być pusta.

---

Jak wyświetlić bloki z treścią statyczną?

W menu górnym przejdź do zakałdki Content > Widgets.

W prawym górnym rogu kliknij przycisk "Dodaj widżet", aby dodać nowy widżet.

Określ typ widżetu Blok statyczny CMS i szablon, w którym należy zastosować widżet, a następnie kliknij przycisk Kontynuuj.

Na następnej stronie w polu Widget Title wprowadź nazwę widżetu, który zostanie wyświetlony w panelu administracyjnym. W polu Assign to Store Views należy wybrać widoki z magazynu, które będą wyświetlać widżet. W bloku Layout Updates kliknij w przycisk Add Layout Update. Również możesz wybrać strony, na których widżet będzie wyświetlany. W zależności od wybranych stron będziesz miał możliwość wypełnienia dodatkowych pól.

W lewym pasku bocznym kliknij kartę Opcje widżetu i wybierz blok statyczny. Nie zapomnij zapisać zmian.

Po zakończeniu konfigurowania stron i bloków, sklep jest gotowy do pracy.

---

Opcje tematu

Aby dostosować ten moduł przejdź do zakładki  Stores > Settings > Configuration.

Następnie wybierz z menu TEMPLATEMONSTER> Opcje tematyczne i przejdziesz do interfejsu ustawień modułu.

Kliknij na Store View: Default Config.

Z listy rozwijanej wybierz opcję Widok sklepu.

Potwierdź przełączenie zakresu w oknie podręcznym. Naciśnij "OK", aby potwierdzić.

Po tym procesie możemy zobaczyć nową kartę o nazwie Ustawienia kolorów kompozycji w sekcji Ogólne.

Struktura tablicy jest następująca:

---

Karta Ustawienia ogólne

 Dostępne opcje:

• Logo Image - można przesłać zdjęcie logotypu [Dozwolone typy plików: png, gif, jpg, jpeg, svg].
• Logo Image Width - ustawienie szerokość zdjęcia w pikselach.
• Logo Image Height- ustawienie wysokości zdjęcia w pikselach.
• Logo image alt text - ustawianie alternatywnego tekstu na zdjęciu Logo.
• Welcome text - zmiana domyślnego tekstu powitalnego.
• Favicon icon - dozwolone typy plików: ico, png, gif, jpg, jpeg, apng, svg.
• Site title - ustawienie tytułu witryny na stronie domowej.
• Default description - ustawienie domyślnego opisania dla sklepu.
• Default keywords - ustawienie słów kluczowych dla sklepu.
• Copyright - do wprowadźenia prawa autorskich.

---

Ustawienia schematu kolorów

Dostępne opcje:

Usuń zaznaczenie opcji Użyj witryny, aby zmienić ustawienia układu.

Tutaj można zmieniać kolory i tło sklepu. Wszystko jest proste, podobne do dostosowywania elementów w programie WordPress. Możesz zmienić dowolny kolor i zdjęcie w tle poprzez kilku kliknięć.

---

Edycja nagłówka i stopki

Na karcie Header znajduje się sekcja Social links.

Możesz dodać link do swojego profilu w sieciach społecznościowych za pomocą Font Icon lub Image icon.

Aby dodać adres URL do zdjęcia, musisz dodać adres URL do swojego profilu w sieciach społecznościowych, ustawić szerokość ikony, dodać alternatywny tekst do zdjęcia i przesłać zdjęcie.

Aby dodać adres URL za pomocą Font icons, musisz dodać CSS Class ikony, adres URL profilu w social media, ustawić rozmiar fontui i wysokość linii.

Przejdźmy do ustawień stopki.

W stopce można dodać link do profilów w social media i ustawić pozycję elementów.

Aby dodać adres URL do zdjęcia, musisz dodać adres URL do swojego profilu w sieciach społecznościowych, ustawić szerokość ikony, dodać alternatywny tekst do zdjęcia i przesłać zdjęcie.

Aby dodać adres URL za pomocą Font icons, musisz dodać CSS Class ikony, adres URL profilu w social media, ustawić rozmiar fontui i wysokość linii.

---

Dostosowanie pasku bocznego

Boczny pasek można dostosować wedłu Twoich potrzeb z pomocą modułu TemplateMonster Theme Settings. Będziesz mógł wybrać, co powinno być wyświetlane na pasku bocznym i co będą mogli widzeić klienci podczas pracy ze sklepem.

Silnik Magento jest świetnym rozwiązaniem dla e-sklepów. Domyślny pakiet zawiera wszystkie niezbędne do tworzenia dochodowych stron moduły. Open source pozwala oferować swoim klientom najbardziej przystępne ceny dla sprzedawców.

---

W dodatku, możesz obejrzeć listę naszych szablonów-bestsellerów Magento:

Magetique - uniwersalny szablon Magento 2

Demo Pobierz

Decorta - responsywny szablon Magento 2 w temacie Wyposażenie wnętrz

Demo Pobierz

Delveti - szablon Magento w temacie Materiały sanitarne

Demo Pobierz

Motor - szablon Magento w temacie Usługi samochodowe

 Demo Pobierz

Jeśli nie masz zamiaru tworzyć e-sklep, polecamy przyjrzeć się do szablonów portfolio lub strony docelowych. Sprawdź nasze premium szablony!

* * *

Ten artykuł został przetłumaczony z angielskiego. Oryginał można znaleźć tutaj: 
How to Create an Magento Store.