{"id":4516,"date":"2019-08-06T15:01:18","date_gmt":"2019-08-06T15:01:18","guid":{"rendered":"https:\/\/www.templatemonster.com\/pl\/blog\/?p=4516"},"modified":"2019-08-08T15:28:45","modified_gmt":"2019-08-08T15:28:45","slug":"tutorial-tworzenie-e-sklepu-magento","status":"publish","type":"post","link":"https:\/\/monsterspost.com\/pl\/tutorial-tworzenie-e-sklepu-magento\/","title":{"rendered":"Tutorial: tworzenie e-sklepu na Magento"},"content":{"rendered":"

Wierzymy, \u017ce ka\u017cdy mo\u017ce osi\u0105gn\u0105\u0107 sukcesu w bran\u017cy e-commerce. Jednym z najlepszych sposob\u00f3w na zarabianie w Internecie jest prowadzenie e-sklepu. Posiadanie w\u0142asnej strony daje wiele korzy\u015bci, np. niezale\u017cno\u015b\u0107.<\/span><\/p>\n

Dlatego zaczeli\u015bmy t\u0105 seri\u0119 tutoriali na temat rozpocz\u0119cia pracy z r\u00f3\u017cnymi sklepami CMS. Dzisiaj b\u0119dziemy m\u00f3wili o Magento CMS. Opowiemy jak \u0142atwo jest skonfigurowa\u0107 sklep Magento.<\/span><\/p>\n

<\/div>\n
\n
<\/div>\n

Jak zainstalowa\u0107 Magento CMS<\/strong><\/h3>\n

Ka\u017cdy CMS wymaga przes\u0142ania plik\u00f3w na hosting przed instalacj\u0105. Po zako\u0144czeniu przesy\u0142ania plik\u00f3w mo\u017cna przej\u015b\u0107 do procesu instalacji Magento. Otw\u00f3rz i w pasku adresu przegl\u0105darki wpisz URL domeny\/\u015bcie\u017ck\u0119 do katalogu Magento. Powiniene\u015b zobaczy\u0107 ekran powitalny aplikacji Sample Data Installer. Aby zainstalowa\u0107 Magento, post\u0119puj zgodnie z poni\u017cszymi instrukcjami.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n

Wype\u0142nij wszystkie informacje dotycz\u0105ce hostingu i bazy danych.<\/p>\n

\"\"

<\/div>\n

Je\u015bli zgadzasz si\u0119 na Warunki, kliknij \"Zgadzam si\u0119 i ustawiam Magento\", aby kontynuowa\u0107 instalacj\u0119.<\/span><\/p>\n

Kliknij przycisk \"Start Readiness Check\", aby sprawdzi\u0107 zgodno\u015b\u0107 ustawie\u0144 serwera z wymaganiami silnika Magento 2.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n

Po zako\u0144czeniu procesu kliknij w przycisk Dalej.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n

Tutaj musisz wprowadzi\u0107 informacje, dotycz\u0105ce bazy danych i ustawi\u0107 niekt\u00f3re ustawienia pocz\u0105tkowe. Dodaj baz\u0119 danych - wprowad\u017a nazw\u0119 hosta, nazw\u0119 bazy danych, u\u017cytkownika bazy danych i has\u0142o. Skontaktuj si\u0119 z dostawc\u0105 us\u0142ug hostingowych, je\u015bli nie masz tych informacji.<\/span><\/p>\n

Upewnij si\u0119, \u017ce masz utworzon\u0105 baz\u0119 danych dla instalacji Magento. Pami\u0119taj, powinna by\u0107 jasne i bez \u017cadnych tabel.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n

Je\u015bli wszystko jest poprawne, kliknij przycisk Dalej.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n

Dalej mo\u017cna zmieni\u0107 adres panelu administracyjnego Magento i adres sklepu g\u0142\u00f3wnego. Inne ustawienia mo\u017cna pozostawi\u0107 bez zmian.<\/span><\/p>\n

Po zako\u0144czeniu kliknij przycisk Dalej.<\/span><\/p>\n

Wybierz wymagan\u0105 stref\u0119 czasow\u0105, domy\u015bln\u0105 walut\u0119 i j\u0119zyk magazynu. Mo\u017cna wybra\u0107 domy\u015blne modu\u0142y, kt\u00f3re powinny \/ nie powinny by\u0107 instalowane, w sekcji Konfiguracja modu\u0142\u00f3w dedykowanych. Zalecamy, aby nie wprowadza\u0107 zmian w tej sekcji.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n

Tutaj musisz poda\u0107 dane osobowe w\u0142a\u015bciciela sklepu. Musisz tak\u017ce okre\u015bli\u0107 dane logowania administratora serwisu.<\/span>.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

Konfiguracja sklepu zosta\u0142a wykonana. Naci\u015bnij przycisk Zainstaluj teraz, aby rozpocz\u0105\u0107 proces instalacji sklepu.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n

Jest to ostatni etap instalacji. Skopiuj wygenerowany klucz szyfruj\u0105cy i zipsz go w bezpiecznym miejscu.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n
\n
<\/div>\n

Aktywacja szablonu<\/strong><\/h3>\n

Otw\u00f3rz panel administracyjny Magento i przejd\u017a do menu Content > Configuration menu.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

Na li\u015bcie sklep\u00f3w trzeba klikn\u0105\u0107 opcj\u0119 edycji Global-Main Website. Mo\u017cesz te\u017c klikn\u0105\u0107 edytowa\u0107 dla okre\u015blonego widoku sklepu.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n

W domy\u015blnym temacie kliknij rozwijan\u0105 Applied Theme, wybierz wymagany szablon, a nast\u0119pnie kliknij przycisk Zapisz konfiguracj\u0119.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n
\n
<\/div>\n

Konfiguracja logo<\/strong><\/h3>\n

Wykonaj nast\u0119puj\u0105ce aby skonfigurowa\u0107 logo domy\u015blne .<\/span><\/p>\n

Otw\u00f3rz panel administracyjny Magento i wybierz z menu bocznego Content> Configuration.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n

Na li\u015bcie sklep\u00f3w trzeba klikn\u0105\u0107 opcj\u0119 edycji Global-Main Website. Mo\u017cesz te\u017c klikn\u0105\u0107 edytowa\u0107 dla okre\u015blonego widoku sklepu.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n

Wybierz kart\u0119 \"Nag\u0142\u00f3wek\" i prze\u015blij swoje logo.<\/span><\/p>\n

<\/div>\n

\"\"

<\/div>\n

Kliknij w przycisk \"Zapisz konfiguracj\u0119\".<\/span><\/p>\n

Aby zainstalowa\u0107 logo firmy, musisz przes\u0142a\u0107 plik zdj\u0119cia do folderu \/images w swoim temacie Magento.<\/span><\/p>\n

Logo mo\u017cna zmieni\u0107 przy u\u017cyciu modu\u0142u opcji szablonu.<\/span><\/p>\n

Aby zmieni\u0107 logo, kliknij w kart\u0119 Stores > Settings > Configuration<\/span><\/p>\n

Nast\u0119pnie wybierz opcj\u0119 TEMPLATEMONSTER > Theme Options w menu po lewej stronie, a nast\u0119pnie przejd\u017a do interfejsu ustawie\u0144 modu\u0142u.<\/span><\/p>\n

Przejd\u017a do karty General > Logo Settings.<\/span><\/p>\n

<\/div>\n
\n
<\/div>\n

Konfiguracja stron<\/strong><\/h3>\n

Aby szablon wygl\u0105da\u0142 dok\u0142adnie tak, jak w Live Demo, trzeba skonfigurowa\u0107 strony sklepu w nast\u0119pny spos\u00f3b. Udost\u0119pniamy wszystkie pliki kodem strony. Trzeba doda\u0107 je do panelu admina Magento zgodnie z instrukcjami poni\u017cej, u\u017cywaj\u0105c tabeli ustawie\u0144. Tabela ustawie\u0144 znajduje si\u0119 w sekcji informacji technicznych na stronie podgl\u0105du szablonu. Plik dokumentacji zawiera link do tej strony:<\/p>\n

<\/div>\n

\"\"<\/a>
\n

<\/div>\n

Strona domowa szablonu zwykle zawiera nast\u0119puj\u0105ce elementy: banery, suwak, galeria itp.<\/p>\n

Z menu g\u0142\u00f3wnego przejd\u017a do zak\u0142adki Content> Pages. Tutaj znajdziesz wszystkie strony sklepu. Strona domowa, O nas i Obs\u0142uga klienta powinny by\u0107 ju\u017c dost\u0119pne, wi\u0119c nie musisz ich dodawa\u0107. Wystarczy tylko zaktualizowa\u0107 zawarto\u015b\u0107 stron HTML i XML. Otw\u00f3rz dowolny z nich, aby uzyska\u0107 dost\u0119p do zawarto\u015bci.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

Otw\u00f3rz stron\u0119 i wybierz kart\u0119 Content. Zawiera kod HTML strony. Kod HTML strony mo\u017cna pobra\u0107 z odpowiedniego pliku \u017ar\u00f3d\u0142owego. List\u0119 plik\u00f3w \u017ar\u00f3d\u0142owych zawartych w sekcji \"Ustawienia szablonu\" mo\u017cna zobaczy\u0107 na stronie podgl\u0105du szablonu. Skopiuj kod z pliku \u017ar\u00f3d\u0142owego i wklej go do obszaru zawarto\u015bci.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

Kiedy sko\u0144czysz z kodem HTML, przejd\u017a do zak\u0142adki \"Design\". Zawiera kod strony XML. Kod XML umo\u017cliwia dodawanie blok\u00f3w i wid\u017cet\u00f3w Magento do strony. Kod XML powinien by\u0107 kopiowany w taki sam spos\u00f3b jak HTML z pliku \u017ar\u00f3d\u0142owego. Skopiuj kod XML do obszaru \"Layout Update XML\".<\/p>\n

<\/div>\n

\"\"

<\/div>\n

Nie zapomnij wybra\u0107 prawid\u0142ow\u0105 opcj\u0119 dla \"Layout\".<\/p>\n

Je\u015bli chcesz doda\u0107 now\u0105 stron\u0119, kliknij przycisk \"Add New Pag\" w prawym g\u00f3rnym rogu.<\/p>\n

<\/div>\n
\n
<\/div>\n

Konfiguracja blok\u00f3w statycznych<\/strong><\/h3>\n

Po zako\u0144czeniu konfigurowania stron nale\u017cy skonfigurowa\u0107 bloki statyczne. Procedura jest podobna: musisz skopiowa\u0107 kod z plik\u00f3w \u017ar\u00f3d\u0142owych i wklei\u0107 go do odpowiednich p\u00f3l w panelu administracyjnym Magento. Musisz u\u017cy\u0107 podobnego tabela, ale dla blok\u00f3w statycznych.<\/p>\n

Identyfikator bloku mo\u017ce r\u00f3\u017cni\u0107 si\u0119 w instalacji Magento. Mo\u017cesz uzyska\u0107 prawid\u0142owy identyfikator bloku z sekcji Content > Blocks w panelu administracyjnym.<\/p><\/blockquote>\n

W menu g\u00f3rnym przejd\u017a do zak\u0142adki\u00a0Content > Blocks.<\/p>\n

W prawym g\u00f3rnym rogu kliknij przycisk \"Dodaj nowy blok\", aby doda\u0107 nowy blok statyczny.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

Okre\u015bl nazw\u0119 i identyfikator bloku. Informacje o bloku mo\u017cna uzyska\u0107 w tabeli na stronie konfiguracji szablonu [sprawd\u017a cz\u0119\u015b\u0107 konfiguracji strony].<\/p>\n

Otw\u00f3rz plik \u017ar\u00f3d\u0142owy bloku i skopiuj kod HTML do obszaru zawarto\u015bci.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

UWAGA: niekt\u00f3re szablony nie zawieraj\u0105 \u017cadnych blok\u00f3w statycznych, wi\u0119c tabela mo\u017ce by\u0107 pusta.<\/em><\/strong><\/p>\n

<\/div>\n
\n
<\/div>\n

Jak wy\u015bwietli\u0107 bloki z tre\u015bci\u0105 statyczn\u0105?<\/strong><\/h3>\n

W menu g\u00f3rnym przejd\u017a do zaka\u0142dki Content > Widgets.<\/p>\n

W prawym g\u00f3rnym rogu kliknij przycisk \"Dodaj wid\u017cet\", aby doda\u0107 nowy wid\u017cet.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

Okre\u015bl typ wid\u017cetu Blok statyczny CMS i szablon, w kt\u00f3rym nale\u017cy zastosowa\u0107 wid\u017cet, a nast\u0119pnie kliknij przycisk Kontynuuj.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

Na nast\u0119pnej stronie w polu Widget Title wprowad\u017a nazw\u0119 wid\u017cetu, kt\u00f3ry zostanie wy\u015bwietlony w panelu administracyjnym. W polu Assign to Store Views nale\u017cy wybra\u0107 widoki z magazynu, kt\u00f3re b\u0119d\u0105 wy\u015bwietla\u0107 wid\u017cet. W bloku Layout Updates kliknij w przycisk Add Layout Update. R\u00f3wnie\u017c mo\u017cesz wybra\u0107 strony, na kt\u00f3rych wid\u017cet b\u0119dzie wy\u015bwietlany. W zale\u017cno\u015bci od wybranych stron b\u0119dziesz mia\u0142 mo\u017cliwo\u015b\u0107 wype\u0142nienia dodatkowych p\u00f3l.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

W lewym pasku bocznym kliknij kart\u0119 Opcje wid\u017cetu i wybierz blok statyczny. Nie zapomnij zapisa\u0107 zmian.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

Po zako\u0144czeniu konfigurowania stron i blok\u00f3w, sklep jest gotowy do pracy.<\/p>\n

<\/div>\n
\n
<\/div>\n

Opcje tematu<\/strong><\/h3>\n

Aby dostosowa\u0107 ten modu\u0142\u00a0przejd\u017a do zak\u0142adki \u00a0Stores > Settings > Configuration.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

Nast\u0119pnie wybierz z menu TEMPLATEMONSTER> Opcje tematyczne i przejdziesz do interfejsu ustawie\u0144 modu\u0142u.<\/p>\n

Kliknij na Store View: Default Config.<\/p>\n

Z listy rozwijanej wybierz opcj\u0119 Widok sklepu.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

Potwierd\u017a prze\u0142\u0105czenie zakresu w oknie podr\u0119cznym. Naci\u015bnij \"OK\", aby potwierdzi\u0107.<\/p>\n

<\/div>\n

\"\"

<\/div>\n

Po tym procesie mo\u017cemy zobaczy\u0107 now\u0105 kart\u0119 o nazwie Ustawienia kolor\u00f3w kompozycji w sekcji Og\u00f3lne.<\/p>\n

Struktura tablicy jest nast\u0119puj\u0105ca:<\/p>\n

<\/div>\n

\"\"

<\/div>\n
\n
<\/div>\n

Karta Ustawienia og\u00f3lne<\/strong><\/h3>\n
<\/div>\n

\"\"

<\/div>\n

\u00a0Dost\u0119pne opcje:<\/strong><\/p>\n