Dokumentacja Magento

1. Tworzenie bazy danych

Najpierw należy przygotować nową bazę danych dla sklepu Magento. Możesz utworzyć nową bazę danych za pomocą narzędzia do zarządzania bazą danych z panelu sterowania hostingu (zazwyczaj PhpMyAdmin).

Następujące dane uzyskamy podczas tworzenia bazy danych: Nazwa bazy danych, nazwa użytkownika bazy danych, hasło i Twoją nazwę serwera. Musisz zapisać te dane, gdyż będą one potrzebne do dalszej instalacji Magento.

Przy użyciu narzędzia phpMyAdmin, będziesz w stanie stworzyć nową bazę danych w 3 prostych krokach (sprawdź slajdy poniżej):

1. Kliknij na przycisk "Database" z górnego menu nawigacyjnego, aby przejść do listy baz danych.
2. Wprowadź nazwę bazy danych w polu "Create new database".
3. Kliknij przycisk "Create" po prawej stronie.

Twoja baza danych znajduje się teraz na liście. Kliknij na jej nazwę, aby uzyskać dostęp do bazy danych:

Możesz sprawdzić szczegółowy video tutorial na Jak stworzyć bazę danych

2. Import przykładowych danych

Pakiet szablonu Magento zawiera przykładowy plik danych (dump.sql lub dump.gz). Ten plik znajduje się w folderze/sources/sample_data Twojego szablonu. Pozwala to załadować przykładowe dane w taki sposób, że witryna wygląda dokładnie tak jak nasze demo szablonu.

Aby zainstalować plik zrzutu (dump file), wykonaj następujące czynności:

1. Zaloguj się do phpMyAdmin, wybierz bazę danych, która ma zostać użyta do Magento Commerce (Został on stworzony przez Ciebie przy pomocy kroków wskazanych wcześniej).
2. Przejdź do zakładki"Import" i kliknij przycisk "Browse".
3. Znajdż folder"/sources/sample_data" Twojego szablonu i wybierz plik dump.sql.gz..
4. Naciśnij "GO". Proces importowania może potrwać kilka minut.

3. Przesyłanie i rozpakowanie

Aby zacząć pracę z Magento, musisz przesłać pliki do swojego serwera hostingowego. Można tego dokonać przy użyciu menadżera plików w hostingu lub osobnego FTP managera.

1. Wybierz 'unzip.php' oraz 'fullpackage.zip' i prześlij je do swojego serwera( Jak przesłać pliki do serwera. )
2. Podaj scieżkę do pliku 'unzip.php' na Twoim serwerze (http://your_domain_name/unzip.php) w przeglądarce.
3. Powinieneś zobaczyć następujący widok:

Img 1. Unzip.php początkowy widok.

5. W oknie 'Wybierz plik zip' (ang. Choose your zip file) wybierz przesłany plik fullpackage.zip.
6. W 'Wypakuj do' (ang. Unzip to) wybierz folder, do którego chcesz wypakować pliki.
7. Kliknij 'Wypakuj' (ang. Unzip), aby kontynuować.

4. Instalacja silnika Magento

Kiedy zakończysz przesyłanie plików, można rozpocząć instalację silnika Magento. Otwórz przeglądarkę i w pasku adresu wpisz Twoją 'Nazwę domeny / ścieżkę do katalogu Magento'. Powinieneś zobaczyć ekran powitalny. Prosimy postępować zgodnie z poniższymi instrukcjami, aby zainstalować Magento.

Krok 1: Asystent instalacji

Proszę przeczytaj umowę licencyjną i kliknij przycisk pola wyboru "Zgadzam się z powyższymi warunkami", jeśli zgadzasz się z warunkami.

Krok 2: Asystent instalacji (Lokalizacja)

Wybierz Ustawienia regionalne, strefę czasową oraz domyślną walutę. Opcja Ustawień lokalnych określa język backendu Twojego sklepu Magento. Jeśli chcesz zmienić język frontendu, musisz pobrać i zainstalować pakiety językowe Magento. Wszystkie opcje można łatwo zmienić później przy użyciu panelu administratora Magento.

Krok 3: Konfiguracja

Tutaj musisz wpisać szczegóły bazy danych sklepów i kilka ustawień początkowych. Łączenie bazy danych - uzupełnij nazwę bazy danych hostingu, nazwę użytkownika, hasło oraz nazwę. Skontaktuj się z dostawcą usług hostingowych, jeśli nie posiadasz niezbędnych danych.

Upewnij się, że posiadasz bazę danych stworzoną do instalacji . Upewnij się również, że jest ona czysta, bez żadnych tabel. Opcje dostępu do sieci Web oraz Opcje przechowywania sesji - zostaw opcje bez zmian, jeśli nie jesteś pewien. Ustawienia domyślne zwykle działają.

Jeśli wszystko jest w porządku, kliknij przycisk 'Continue'.

Krok 4: Zakładanie konta administratora

Tutaj należy uzupełnić dane osobowe właściciela sklepu oraz administratora.

Kiedy skończysz, kliknij przycisk 'Continue' .

Krok 5: Masz wszystkie ustawienia

Jest to ostatni etap instalacji. Skopiuj wygenerowany klucz szyfrowania i przechowuj go w bezpiecznym miejscu. Możesz użyć przycisków w prawym dolnym rogu, aby zobaczyć front sklepu oraz panel administratora.

Przede wszystkim upewnij się, że wersja instalacji Magento spełnia wymagania szablonów. Jeśli korzystasz z nieaktualnej wersji Magento, musisz ją uaktualnić. Nie zapomnij wykonać kopii zapasowej plików oraz bazy danych. Aktualne instrukcje do Magento są dostępne na stronie Magento Wiki.

Jeśli silnik Magento spełnia wymagania szablonu, można rozpocząć instalację szablonu.

1. Otwórz pakiet szablonu i przejdź do folderu theme###.
2. Prześlij zawartość folderu theme### do katalogu instalacji Magento (prześlij "app", "skin" oraz inne foldery). Te foldery zawierają pliki motywu. Nie będą miały wpływu na istniejące już pliki.

1. Konfiguracja szablonu

Będziemy przeglądać opcje konfiguracyjne szablonu w oparciu o przykład. Jest on skonfigurowany tak samo jak nasz Live Demo szablon, bez wpływu na rzeczywiste dane.

Aktywuj nowy szablon

1. Otwórz panel administratora i przejdź do System > Design w górnym menu.
2. Kliknij przycisk "Add Design Change".
3. W polu "Custom Design" wybierz nazwę szablonu (np: szablon###).
4. Kliknij przycisk "Save", aby zatwierdzić zmiany.

Dane "Reindex data"

1. Otwórz panel administratora Magento, następnie w górnym menu wybierz System > Index Management.
2. Zaznacz pole "Select All" w lewym górnym rogu.
3. W polu "Actions" wybierz "Reindex Data".
4. Kliknij przycisk "Submit".
5. Prosimy o cierpliwość, może to chwilę potrwać.

Wyłączanie cache

Aby zmiany pojawiły się na Twojej stronie internetowej, musisz wyłączyć cache. Zapobiega to dodatkowemu czyszczeniu cache po każdej zmianie dokonanej przez Ciebie. Możesz cache włączyć ponownie po skończeniu dokonywania zmian w Twoim sklepie.

1. Otwórz panel administratora Magento i przejdź do System > Cache Management w górnym menu.
2. W lewym górnym rogu kliknij "Select All".
3. Po prawej stronie w polu "Actions" wybierz "Disable".
4. Kliknij przycisk "Submit".

2. Konfiguracja Loga.

Proszę wykonać następujące kroki przy tworzeniu obrazka loga dołączonego do pakietu motywu (można go obejrzeć na stronie Live Demo).

1. Otwórz panel administratora Magento i wybierz System > Configuration w górnym menu .
2. Wybierz zakładkę "Design".
3. W sekcji "Header", zmień wartość pola "Logo Image Src". Zmień go z "gif" na "png".
4. Kliknij przycisk "Save Config".

Aby zainstalować logo firmy, musisz przesłać plik zdjęcia loga do folderu /images Twojego motywu Magento.

3. Konfiguracja strony

W celu stworzenia szablonu wyglądającego dokładnie tak samo jak nasze Live Demo, musisz skonfigurować strony sklepu w określony sposób. Zapewniamy wszystkie pliki z kodem źródłowym stron. Trzeba dodać je do panelu administratora Magento zgodnie z instrukcjami poniżej, korzystając z tabeli ustawień. Tabela ustawień znajduje się na stronie Technical details, na stronie podglądu szablonu. Plik dokumentacji zawiera link do tej strony:

• Documentation
  • documentation.html

Główna strona szablonu zostanie zmieniona w największym stopniu. Zawiera ona zazwyczaj następujące elementy: banery, slider, galerie, itp.

Zalecamy wyłączenie edytora WYSIWYG. Aby to zrobić, z górnego menu administratora należy wybrać System > Configuration. Otwórz sekcję "Content Management" i w oknie WYSIWYG Options ustaw opcję z "Enable WYSIWYG Editor" na "Disabled Completely".

1. Z górnego menu wybierz CMS > Pages. Tutaj możesz znaleźć wszystkie strony sklepu. Home page, About Us oraz Customer Service powinny być już dostępne, więc nie trzeba ich dodawać. Wystarczy tylko zaktualizować strony HTML i zawartość XML. Otwórz każdy z nich w celu uzyskania dostępu do zawartości.
2. Otwórz stronę i wybierz zakładkę Content. Zawiera ona kod HTML strony. Możesz uzyskać kod strony HTML z odpowiedniego pliku źródłowego. Możesz zobaczyć listę plików źródłowych zawartych w sekcji "Ustawienia szablonu" na Twojej stronie podglądu szablonu. Skopiuj kod z pliku źródłowego i wklej go do pola content.
3. Kiedy skończysz z kodem HTML, przejdź do zakładki "Design". Zawiera ona kod strony XML. XML pozwala na dodawanie statycznych bloków Magento i widgety na stronę. XML powinny być skopiowane w ten sam sposób jak HTML z pliku źródłowego. Skopiuj kod XML do obszaru "Layout Update XML".
4. Nie zapomnij wybrać prawidłowej opcji "Layout".
5. W przypadku jeżeli zajdzie potrzeba dodania nowej strony, kliknij przycisk "Add New Page" w prawym górnym rogu.

W przypadku jakichkolwiek trudności, prosimy sprawdzić szczegółowy tutorial Jak ręcznie skonfigurować strony.

4. Konfiguracja bloków statycznych

Po zakończeniu konfiguracji strony, musisz skonfigurować statyczne bloki. Procedura jest podobna: należy skopiować kod z plików źródłowych i wkleić go do odpowiednich pól w panelu administratora Magento. Musisz użyć podobną tabelę, ale dla statycznych bloków.

1. Z górnego menu wybierz CMS > Static Blocks.
2. Kliknij przycisk "Add New block" w prawym górnym rogu, aby dodać nowy blok.
3. Wpisz nazwę bloku oraz identyfikator. Możesz uzyskać szczegóły o bloku z tabeli szablonu na stronie Live Demo (sprawdź rozdział o Konfiguracji Strony).
4. Otwórz plik źródłowy bloku oraz skopiuj kod HTML do obszaru zawartości.

Po zakończeniu konfiguracji strony sklepu oraz bloków, twój sklep jest gotowy do pracy.

1. Moduł waluty

1. Otwórz panel administratora Magento.
2. Z górnego menu wybierz System > Configuration.
3. Następnie kliknij pozycję Ogólne i wybierz zakładkę Currency Setup.
4. W zakładce Currency Options, przytrzymując klawisz Ctrl, zaznacz dozwolone waluty, które mogą być używane do wyświetlania ceny w sklepie. Kiedy skończysz, kliknij przycisk Save Config, aby zapisać zmiany.
5. Przejdź do System > Manage Currency Rates w górnym menu.
6. Ustaw żądane wartości kursu walutowego lub skorzystaj z Usługi Import. Kliknij przycisk Save Currency Rates, aby zapisać Twoje zmiany.

2. Moduł ankiety

Z górnego menu wybierz CMS > Polls.

1. Mapy Google

Ten moduł pozwala na osadzenie mapy Google na Twojej stronie Magento. Domyślnie moduł oferuje dwie mapy: mapę na stronie kontaktowej oraz mapę w stopce innych stron.

Obie mapy można skonfigurować za pomocą panelu administracyjnego Magento w sekcji System > Configuration > Templatemonster > Google Map.

Moduł posiada następujące opcje:

2. Moduł Facebook like box

Ten moduł pozwala na wyświetlenie Facebook like box w Twoim sklepie Magento.

Możesz go skonfigurować za pomocą panelu administracyjnego Magento w sekcji System > Configuration > Templatemonster > Facebook.

Moduł posiada następujące opcje:

Moduł jest wyświetlany domyślnie w lewej kolumnie. Jednak są trzy opcje wyświetlania: left, right oraz footer.
Aby zmienić położenie bloku, należy otworzyć plik tm_facebook.xml zlokalizowany w folderze app/design/frontend/default/themeXXX/layout Twojej instalacji.

<reference name="left">
	<block type="core/template" name="tm_facebook_like_left" as="tm_facebook_like_left" template="tm/facebook/facebook_like.phtml"/>
</reference>
<!-- <reference name="right">
	<block type="core/template" name="tm_facebook_like_right" as="tm_facebook_like_right" template="tm/facebook/facebook_like.phtml"/>
</reference> -->
<!-- <reference name="footer">
	<block type="core/template" name="tm_facebook_like_footer" as="tm_facebook_like_footer" template="tm/facebook/facebook_like.phtml"/>
</reference> -->

Dwa bloki są przekonwertowane na komentarz w tym pliku. A jeden blok z name="left" nie jest przekonwertowany. Wyświetla moduł w lewej kolumnie.
Jeśli chcesz wyświetlić moduł w stopce, należy postępować zgodnie z poniższymi instrukcjami:

• 1. Uncomment lines of code for name="footer" block (the last one in the example of the code above) and comment out the block name="left" (the first one in the example of the code above).
• 2. Otwórz plik footer.phtml zlokalizowany w folderze app/design/frontend/default/themeXXX/template/page/html.
• 3. Wklej następujący kod do wskazanego miejsca:

  <?php echo $this->getChildHtml('tm_facebook_like_footer') ?>

Blok Facebook'a wyświetli się teraz w stopce.

3. Moduł Instagram

Moduł Instagram pozwala wyświetlić galerię Instagram w Twoim sklepie.
Ten moduł pozwala wyświetlić dwa rodzaje galerii: galerię użytkownika oraz galerię tagu.

Wszystkie opcje konfiguracji są dostępne w panelu administracyjnym w sekcji System > Configuration > Templatemonster > Instagram.

Moduł posiada następujące opcje:

4. Moduł Twitter

Moduł Twitter pozwala wyświetlić kanał (feed) tweetów w Twoim sklepie.

Wszystkie opcje konfiguracji są dostępne w panelu administracyjnym w sekcji System > Configuration > Templatemonster > Twitter.

Moduł posiada następujące opcje:

Moduł jest wyświetlany domyślnie w lewej kolumnie. Jednak są trzy opcje wyświetlania: left, right oraz footer.
Aby zmienić położenie bloku, należy otworzyć plik tm_twitter.xml zlokalizowany w folderze /app/design/frontend/default/themeXXX/layout Twojej instalacji.

<reference name="left">
	<block type="core/template" name="tm_twitter_timeline" as="tm_twitter_timeline" template="tm/twitter/twitter_timeline.phtml"/>
</reference>
<!-- <reference name="footer">
	<block type="core/template" name="tm_twitter_timeline" as="tm_twitter_timeline" template="tm/twitter/twitter_timeline.phtml"/>
</reference>
<reference name="right">
	<block type="core/template" name="tm_twitter_timeline" as="tm_twitter_timeline" template="tm/twitter/twitter_timeline.phtml"/>
</reference> -->

Dwa bloki są przekonwertowane na komentarz w tym pliku. A jeden blok z name="left" nie jest przekonwertowany. Wyświetla moduł w lewej kolumnie.
Jeśli chcesz wyświetlić moduł w stopce, należy postępować zgodnie z poniższymi instrukcjami:

• 1. Uncomment lines of code for name="footer" block (the last one in the example of the code above) and comment out the name="left" block (the first one in the example of code above).
• 2. Otwórz plik footer.phtml zlokalizowany w folderze app/design/frontend/default/themeXXX/template/page/html.
• 3. Wklej następujący kod do wskazanego miejsca:

  <?php echo $this->getChildHtml('tm_twitter_timeline') ?>

Blok Twitter'a wyświetli się teraz w stopce.

5. Moduł Newsletter popup

Moduł ten pozwala na wyświetlenie wyskakującego bloku z formularzem subskrypcji newslettera.

Możesz włączyć/wyłączyć moduł za pomocą panela administracyjnego Magento w sekcji System > Configuration > Templatemonster > NewsletterPopup.

Aby edytować wygląd okna, należy edytować plik motywu style.css. Jeśli chcesz dodać kilka elementów użytkownika do wyskakującego bloku, należy edytować plik newsletterpopup.phtml zlokalizowany w folderze app/design/frontend/default/themeXXX/template/tm/newsletterpopup.

6. Motyw Special price countdown

Moduł ten pozwala wyświetlić licznik, który wskazuje czas wygaśnięcia zniżki dla produktów specjalnych.

Możesz włączyć/wyłączyć moduł poprzez panel administracyjny Magento, w sekcji System > Configuration > Templatemonster > Special Price Countdown.

Aby edytować wygląd licznika, należy edytować plik flipclock.css (flipclock.less) zlokalizowany w folderze skin/frontend/default/themeXXX/css/tm/specialpricecountdown.

7. Galeria produktów

Moduł ten umożliwia pokazywanie miniaturek obrazów produktów wraz z ich głównym obrazem. Standardowo miniaturki wyświetlane są pod obrazem głównego produktu, ale w naszym motywie miniaturki są wyświetlane wedle układu PSD.

Ten moduł może zostać włączony/wyłączony w panelu administracyjnym Magento pod: System > Configuration > Templatemonster > Product List Gallery.

Moduł zawiera cztery sekcje ustawień: List View, Grid View, Homepage List View i Homepage Grid View.

W Homepage List View i Homepage Grid View można konfigurować wyświetlanie galerii na stronie głównej sklepu.

Wszystkie sekcje zawierają te same ustawienia:

Warto zauważyć! Maksymalna szerokość obrazu jest równa szerokości kolumny, w którym jest on umieszczony.

1. Olark czat na żywo

Musisz zarejestrować się na oficjalnej stronie . W celu wykorzystania wbudowanego w szablon czata on-line należy wypełnić wszystkie wymagane informacje i uzyskać kod Olark Site-ID.

Wszystko gotowe! Teraz możesz odwiedzić Twoją stronę internetową i zobaczyć widget dla czatu on-line.

Możesz również zajrzeć na następujące instrukcje:

• Rozpocznij pracę z Olark
• Instrukcja Obsługi Olark

2. Cloud Zoom

Ustawienia Cloud Image Zoom pozwalają zmienić wymiary wyskakującego obrazu oraz ustawić oryginalny rozmiar obrazu.

3. Dodaj to

Ustawienia udostępniania narzędzi pozwalają wybrać sposób wyświetlania ikon. Zalecane ustawienia są pokazane na zdjęciu.

4. Blog

5. Mega menu

Ten moduł zamienia standardowe menu, co pozwala na konfigurowanie wyświetlania dwóch poziomów podkategorii, dodawanie statycznych bloków do menu rozwijanego, dodawania etykiet, wyświetlania produktów, itp.

MegaMenu jest zawarte w szablonie domyślnie, możesz je włączyć/wyłączyć w System > Configuration > CMSMART MEGAMENU > Mega Menu.

1. Sposób wyswietlania każdego rozwijanego menu może być konfigurowane na stronie ustawień kategorii, znajdujących się w Catalog > Manage Categories.

2. Aby dodać statyczny blok do rozwijanego menu, musisz dodać statyczny blok w CMS > Static Blocks i po utworzeniu, dodać go do menu.

3. Moduł pozwala na dodawanie etykiet do jakiejkolwiek kategorii.

Można tego dokonać w menu kategorii Catalog > Manage Categories.

4. Aby zmienić ilość kolumn w podkategoriach musisz zmienić Ilość kolumn w menu Catalog > Manage Categories.

6. Parallax

Aby dodać efekt parallax do bloku musisz:

1. aby dodać jakąś klasę do bloku z efektem parallax (e.g., parallax) i dodać atrybut data-source-url="{{skin url='images/your_images.jpg'}}".

2. aby dodać obraz do folderu z obrazami skin\frontend\default\themeXXX\images\.

3. aby dodać style do pliku skin\frontend\default\themeXXX\css\style.css:

.parallax {
	background-image: url(../images/parallax-img.jpg);
	background-position: 50% 0%;
	background-repeat: no-repeat;
	background-size: cover;
	width: 3500px;
	left: 50%;
	margin-left: -1750px;
}
				

4. Dodaj do pliku skin\frontend\default\themeXXX\js\scripts.js następujący kod:

jQuery(window).load(function(){
	var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEmobile|Windows Phone|WPDesktop/i.test(navigator.userAgent);
	if(!isMobile) {  
	    if(jQuery(".parallax").length){  jQuery(".parallax").cherryFixedParallax({  invert: true, 
	    		offset: 300 
	    }); 
	  }; 		
	};	
});
				

Zmienna invert: true wybiera kierunek efektu parallax, natomiast offset: 300 jego gęstość (density).

7. Video w Tle

Video może byc dodane jako statyczny blok, włączając plik skryptowy jquery.mb.YTPlayer.js i dodając korespondujące atrybuty, ustawione dla elementu wyświetlającego film.

8. Polityka Cookies

Pliki cookies to małe pliki tekstowe, jakie strony internetowe umieszczają na komputerach odwiedzających. Są one zazwyczaj używane do identyfikacji poszczególnych gości i zapewniają im lepsze doświadczenie. Cookies przedstawiają istotną część wielu funkcji witryny, które przyjmujemy za rzecz oczywistą.

Na przykład, są to zazwyczaj pliki cookies, które umożliwiają sklepom internetowym zapamiętanie jakie przedmioty masz w koszyku. Są one również wykorzystywane do utrzymania użytkownika zalogowanego na stronie internetowej lub dostarczenia cennych statystyk użytkowania oraz informacji dla właścicieli stron internetowych.

Jeśli prowadzisz stronę internetową, to prawie na pewno używa ona cookies. Ich najczęstszą funkcją jest monitorowanie liczby turystów i zachowań za pomocą narzędzi Google Analytics. Mogą być również używane do wyświetlania reklam dla użytkowników. Cookies również wspomagają kluczowe części Twojego systemu handlu on-line.

26 maja 2012 - ICO opublikowała zmiany w polityce Cookie. Począwszy od tego momentu "domniemana zgoda" jest dozwolona pod warunkiem, że jasno określisz Twoją prywatność / Politykę Cookie.

Mając na względzie warunki Prawa Cookies, należy dodać odpowiednie moduły do Twojej strony, dzięki którym pojawi się komunikat ostrzegawczy o cookies używanych na Twojej witrynie. Polecamy następujące z nich:

• Creare EU Cookie Law Banner
• EU Cookie Law Compliance - Implied Consent