Blog

Dzisiaj w moje ręce trafił szablon Premium pod najnowszą wersje Prestashop 1.7. Warto przyglądnąć mu się nieco bliżej ze względu na dwie rzeczy. Już niedługo zacznie się wielka migracja z Prestashop 1.6 na wersje 1.7, może się zdarzyć, że nie wszystkich będzie stać na przeprojektowanie wyglądu sklepu do nowej wersji, a różnic jest sporo i szablony z wersji 1.6 nie są kompatybilne z najnowszą wersją 1.7.

Proces instalacji jest tak samo prosty jak w wersji 1.6, wystarczy otworzyć panel, wczytać plik i gotowe. Warto pamiętać, że gdy zamawiamy szablon w profesjonalnej firmie, która się tym zajmuje koniecznie musimy otrzymać taką sama wersji do instalacji.

 

s01

 

Po wgraniu szablonu widzimy jeden z popularniejszych wyglądów. Oczywiście  dostoswany do rozdzielności FULLHD 1920px.

Na pozycji top widzimy Logotyp wraz z menu.

 

s02

 

W menu nie tylko możemy umieszczać kategorie i linki do stron CMS ale także bannery. Bardzo przydatne w przypadku gdy chcemy reklamować nasze TOP produkty.

Po prawej strony widzimy koszyk, wyszukiwarkę, logowanie do konta klienta oraz opcje zmiany języka i waluty ukryte w wysuwanym menu aktywnym po kliknięciu. Rzadko spotykam się z takim układem zazwyczaj klienci chcą mieć te informacje dostępne nad menu i od razu widoczne, ale jak widać układ szablonu nie pozwala na umieszczenie ich w tym miejscu. Jest to cenna uwaga dla projektanta, który powinien pomyśleć nad dodatkową opcją wyboru dla potencjalnych klientów.

Poniżej menu widzimy dużo slajder obrazkowy i kilka mały bannerów. Mamy tutaj możliwość wyboru kilku układów. Duży plus za tą opcje.

 

s03

 

Kolejną cechą która wyróżnia ten szablon w porównaniu z ofertą dostępną na dzień pisania tej recenzji jest układ list produktów. Zdjęcia są duże i czytelne, od razu widzimy nazwę choć jest za krótka. Ze względu na SEO powinna być w dwóch linijkach. Oczywiście to możemy zmienić, ale bez odpowiedniej pomocy będzie ciężko. Dalej jest cena oraz komentarze. Po najechaniu myszką na produkt widzimy coś znakomitego co jest w tego typu branży odpowiednie. Oprócz atrybutów kolorów, widzimy także miniaturki zdjęć, które znajdują się na karcie produktu a po kliknięciu na nie zmieniają się zdjęcia. Nie musimy wchodzić w kartę produktu, gdy coś zwróci naszą uwagę i możemy w szybki sposób przeglądnąć galerie.  O tym, dlaczego warto wejść w kartę produktu będzie nieco niżej.

 

s04

 

Pod produktami na stronie głównej mamy bardzo fajną parallaxe z zegarem odliczającym do końca promocji oraz karuzele z markami. 2 rzeczy które powinien mieć każdy sklep odzieżowy.

 

s05

 

Stopa oczywiście standardowa, informacje, strony, moje konto linki społecznościowe oraz newsletter. Nic dodać nic ująć.

Drugą ważna stroną w szablonie jest kategoria produktów. Tutaj mamy dokładnie ten sam widok produktów co na stronie głównej ze wszystkimi tymi samymi funkcjonalnościami. Dochodzi oczywiści lewa kolumna, zdjęcie kategorii i opis.

 

s06

 

Menu wraz z koszykiem i wyszukiwarką powinna mieć opcje wędrowania za klientem, podczas przesuwania, Gdy ilość produktów w liście będzie 18 albo więcej, to aby zmienić kategorie czy przejść do koszyka musimy wracać. Co prawda jest przycisk przejścia na górę strony zawsze po prawej stronie, ale projektant powinien uwzględnić tą funkcje. W końcu jest to sklep modowy, a produktów będzie dużo. W lewej kolumnie możemy umieścić kilka modułów podobnie jak w wersji 1.6, ale najciekawszą opcją jest nowy Blok filtrów Nawigacyjnych w nowej wersji 1.7. Po zaznaczeniu kategorii, koloru otrzymujemy nie tylko produkt ale także stały link. Coś czego brakowało w wersji 1.6. Bez problemu możemy ten link wysłać znajomych, wstawić na Facebooka itp. Na pewno skorzystają z tego marketerzy i mając sklep modowy warto już teraz przeskoczyć na 1.7. Jest to funkcja standardowa ale warto ją tutaj było przytoczyć odnośnie szablonu.

Teraz pora na kartę produktu.

 

s07

 

Od razu widzimy duże zdjęcia, które po najechaniu jest dodatkowo powiększane, a kliknięcie otwiera galeria. Połączenia dwóch rzeczy które w wersji 1.6 musieliśmy zawsze wybierać. Powiększanie po najechaniu czy galeria.

Nazwa produktu może zawierać aż 2 linijki i jest czytelna. Oprócz tego widzimy ilość sztuk na stanie, informacje o obniżce, krótki opis oraz wybór atrybutów. Duże przycisku które bez problemu mogą być wybrane na smartfonie czy tablecie.

Poniżej znajdziemy długi opis, szczegóły produktu wraz logiem marki, komentarze i tutaj autor dodaje dodatkową zakładkę na opis. Przydatna, choć nie wszystkim.

Koszyk i strony informacyjne są standardowe dostosowane kolorystycznie do całości. Na pewno każdy przed przejściem na wersje 1.7 sprawdzi jak wygląda ten proces więc nie ma konieczności dalszego opisywania go. Demo szablonu możemy w każdej chwili zobaczyć pod adresem https://www.templatemonster.com/pl/szablony-prestashop-63988.html

Sam szablon nie jest drogi i kosztuje 519 zł i jest bardzo dobrą ceną i na pewno tańszą niż przygotowanie indywidualne projektu graficznego. Oczywiście coś za cos, cena albo indywidualność.

Podsumowując

Plusy:

  • Szablon responsywny
  • Bardzo fajny dodatek z galerią w liście produktów i kategorii
  • Moduł odliczania czasu wyprzedaży, przydatny do wszelkich promocji
  • Rozbudowane menu z różnymi opcjami
  • Karta produktu w opcji powiększania zdjęcia oraz galerii
  • Cena

Minusy:

  • Układ koszyka, wyszukiwarki, konta, z prawej strony
  • Brak opcji wędrowania menu oraz wyżej wymienionych elementów
  • Wygląd i układ nie jest indywidualny.
  • Mało miejsca na logo (tylko kwadratowe)
  • Ciemne kolory

 

 

 

W internecie bardzo mało krąży instrukcji do PrestaShop w wersji 1.6, dlatego postanowiłem napisać własną i umieścić ją na moim blogu. Pełna instrukcja zajmuje 800 stron, jej skrócona wersja 400 i dostępna jest w kilku językach. Niestety nie ma jej w języku Polskim. Większosć opcji nie jest potrzebna użytkownikom do jej obsługi,a część która jest pomijana negatywnie wpływa na pozycjonowanie, dlatego od początku napiszę, na co zwracać uwagę i które pola muszą być uzupełnione, a które nie są nam potrzebne.

Jeżeli w tym momencie czytasz ten tutorial i masz jakieś pytania napisz do mnie maila. Twoje pytanie przeanalizuje, odpowiem na nie i umieszczę w tutorialu, aby inni użytkownicy mieli pełną bazę wiedzy na temat Prestashop.

Na początku widzimy okno logowania, wygląda ono dokładnie tak:

 

logowanie prestashop

Ważne w tym miejscu jest to, aby zaznaczyć opcję [Nie pozwól mnie wylogować], inaczej często po odejściu na 2 minuty będziemy musieli się jeszcze raz logować, a nasza praca nie zapisana wcześniej zostanie utracona.

Gdy już się zalogujemy, mamy pełen panel administracyjny (tzw. Back-Office).

prestashop backoffice

 

Na razie na nim się nie skupiamy, od razu z menu po lewej wybieramy [Katalog]->[Kategorie] i pojawi się nam lista Kategorii.

Kategoria Woman jest główną kategorią poniżej Home. Home to jest kategoria najwyższa.

Wygląda to tak:

Home

         Woman

Zalecam zawsze dodawanie kategorii na poziomie kategorii o nazwie Woman i poniżej jako podkategoria.

W celu dodania kategorii wybieramy z prawego górnego rogu [Dodaj nową kategorie].

Dodawania kategorii Prestashop

Nazwa: nazwa kategorii (np. "Woman")

Wyświetlane: [Tak/Nie] (czy kategoria ma być wyświetlana w sklepie. Najczęściej ukrywam je towarując ją produktami i gdy już się pojawią aktywujemy ją.

Kategoria nadrzędna. Aby lista kategorii wyświetliła się klikamy na Home, dokładnie na folder. Jeżeli chcemy dodać kategorię na tym samym poziomie co "Woman" zaznaczamy tylko Home, jeżeli ma być to podkategoria "Woman" zaznaczamy właśnie tą kategorie czyli "Woman".

Opis kategorii. Uzupełniamy ze względu na SEO, warto tutaj zamieścić informacje z słowami kluczowymi produktów. Dla przykładu może to być nazwa producenta, modele produktu. Ważne aby nie przesadzić i opis był także przyjazny użytkownikowi, nie tylko robotowi Google.

Meta-tytuł: Tytuł kategorii dla robota Google. Nie więcej niż 65 znaków

Opis Meta: Opis dla robota Google, Skrócona wersja Opisu katagori. Ważne, aby były to opisy wspólne, lub bardzo podobne. Maksymalnie 140 znaków.

Meta słowa kluczowe: Słowa kluczowe dla całej kategorii.

Po uzupełnieniu wybieramy dla jakich grup ma być dostępna kategoria.

Visitors - dla odwiedzających sklep.

Guest - dla gości.

Customer - tylko dla klientów którzy założą konto w naszym sklepie.

Na końcu klikamy na [Zapisz]

W ten sposób dodajemy nowe kategorie do naszego sklepu lub podkategorie. Aby edytować już stworzone kategorie (uzupełnić SEO), które mamy w sklepie klikamy z prawej strony na strzałkę w dół obok [Zobacz] i wybieramy [Edytuj].

 

Tak dobiegliśmy do końca pierwszego tutoriala PrestaShop PL. Następny będzie za tydzień. Kliknijcie Lubie to! na Facebooku aby dowiedzieć się od razu o opublikowaniu kolejnej części.

Przeglądając nowa stronę onetu na moim laptopie (nie lubię słowa notebook, wole nazewnictwo starej szkoły) miałem wrażenie, że przeglądam ja na moim ipadzie.

Projektantom nowego interfejsu udało się z łatwością oszukać mój mózg oraz znakomicie wdrożyć responsywaność. Oczywiście pomimo tego, ze jak większość wolałem stara stronę onetu zmiana wisiała w powietrzu, w końcu onet robi to, co 3 lata.

Jeszcze nie miałem okazji na spersonalizowanie swojego onetu, ale na pewno to zrobię, przekonała mnie do tego ciekawość oraz media, które reklamują nowa funkcjonalność, co godzinę.

Dlaczego jeszcze tego nie zrobiłem? Ponieważ nie mam na to czasu, choć w mojej branży teraz powinien panować spokój a wszyscy powoli powinni żyć świętami, które będą za 2 miesiące. Okazuje się ze w świeci Internetu, informatyki i sklepów internetowych rok w rok o tej samej porze jest inaczej.

Głównie w tym roku panuje moda na wspomniana responsywność. Każdy w trybie pilnym przerabia swoją stronę, sklep pod urządzenia mobilne lub wdraża nowe w miejsce starych. Swoja przygodę z responsywnością zacząłem z bootstrap 2.0. Od razu powiem ze łatwo nie było, choć nie jest to takie trudne. W pełni responsywne sklepy zacząłem wdrażać od wersji Prestashop 1.6, nie dlatego ze standardowo posiada domyślny szablon responsywny, ale dlatego ze silnik jest lżejszy i działa o wiele lepiej niż w wersji 1.5 gdzie responsywność kulała. Wiem, co mowie wdrażałem responsywność pod 1.5 i klienci od razu uaktualniali do 1.6 jak tylko w marcu 2014 się pojawiła.

 

1394060068099

Część wdrożonych projektów możecie zobaczyć w moim portfolio, resztę uzupełnię jak znajdę więcej czasu...

 

Rada:

Moja rada na koniec, jeżeli ktoś zaproponuje wam responsywność na wersji 1.5 od razu dajcie sobie spokój, ponieważ oprócz stracenia klientów zamiast ich zyskania zapłacicie za usługę podwójnie, ponieważ będziecie musieli i tak uaktualnić swój sklep do wersji 1.6 i zrobić grafikę od nowa.

Podkategorie

W internecie bardzo mało krąży instrukcji do PrestaShop w wersji 1.6, dlatego postanowiłem napisać własną i umieścić ją na moim blogu. Pełna instrukcja zajmuje 800 stron, jej skrócona wersja 400 i dostępna jest w kilku językach. Niestety nie ma jej w języku Polskim. Większosć opcji nie jest potrzebna użytkownikom do jej obsługi,a część która jest pomijana negatywnie wpływa na pozycjonowanie, dlatego od początku napiszę, na co zwracać uwagę i które pola muszą być uzupełnione, a które nie są nam potrzebne.

Jeżeli w tym momencie czytasz ten tutorial i masz jakieś pytania napisz do mnie maila. Twoje pytanie przeanalizuje, odpowiem na nie i umieszczę w tutorialu, aby inni użytkownicy mieli pełną bazę wiedzy na temat Prestashop.

Na początku widzimy okno logowania, wygląda ono dokładnie tak:

 

logowanie prestashop

Ważne w tym miejscu jest to, aby zaznaczyć opcję [Nie pozwól mnie wylogować], inaczej często po odejściu na 2 minuty będziemy musieli się jeszcze raz logować, a nasza praca nie zapisana wcześniej zostanie utracona.

Gdy już się zalogujemy, mamy pełen panel administracyjny (tzw. Back-Office).

prestashop backoffice

 

Na razie na nim się nie skupiamy, od razu z menu po lewej wybieramy [Katalog]->[Kategorie] i pojawi się nam lista Kategorii.

Kategoria Woman jest główną kategorią poniżej Home. Home to jest kategoria najwyższa.

Wygląda to tak:

Home

         Woman

Zalecam zawsze dodawanie kategorii na poziomie kategorii o nazwie Woman i poniżej jako podkategoria.

W celu dodania kategorii wybieramy z prawego górnego rogu [Dodaj nową kategorie].

Dodawania kategorii Prestashop

Nazwa: nazwa kategorii (np. "Woman")

Wyświetlane: [Tak/Nie] (czy kategoria ma być wyświetlana w sklepie. Najczęściej ukrywam je towarując ją produktami i gdy już się pojawią aktywujemy ją.

Kategoria nadrzędna. Aby lista kategorii wyświetliła się klikamy na Home, dokładnie na folder. Jeżeli chcemy dodać kategorię na tym samym poziomie co "Woman" zaznaczamy tylko Home, jeżeli ma być to podkategoria "Woman" zaznaczamy właśnie tą kategorie czyli "Woman".

Opis kategorii. Uzupełniamy ze względu na SEO, warto tutaj zamieścić informacje z słowami kluczowymi produktów. Dla przykładu może to być nazwa producenta, modele produktu. Ważne aby nie przesadzić i opis był także przyjazny użytkownikowi, nie tylko robotowi Google.

Meta-tytuł: Tytuł kategorii dla robota Google. Nie więcej niż 65 znaków

Opis Meta: Opis dla robota Google, Skrócona wersja Opisu katagori. Ważne, aby były to opisy wspólne, lub bardzo podobne. Maksymalnie 140 znaków.

Meta słowa kluczowe: Słowa kluczowe dla całej kategorii.

Po uzupełnieniu wybieramy dla jakich grup ma być dostępna kategoria.

Visitors - dla odwiedzających sklep.

Guest - dla gości.

Customer - tylko dla klientów którzy założą konto w naszym sklepie.

Na końcu klikamy na [Zapisz]

W ten sposób dodajemy nowe kategorie do naszego sklepu lub podkategorie. Aby edytować już stworzone kategorie (uzupełnić SEO), które mamy w sklepie klikamy z prawej strony na strzałkę w dół obok [Zobacz] i wybieramy [Edytuj].

 

Tak dobiegliśmy do końca pierwszego tutoriala PrestaShop PL. Następny będzie za tydzień. Kliknijcie Lubie to! na Facebooku aby dowiedzieć się od razu o opublikowaniu kolejnej części.

POLUB NAS

SZYBKI KONTAKT

 tel2   +48 790 83 23 14

Ten adres pocztowy jest chroniony przed spamowaniem. Aby go zobaczyć, konieczne jest włączenie w przeglądarce obsługi JavaScript.     Skontaktuj się z nami

Skontaktuj się używając Skype

 

Scroll to top