Monstroid – mój nowy faworyt wśród motywów WordPress PREMIUM

Monstroid – mój nowy faworyt wśród motywów WordPress PREMIUM

Poniższy artykuł jest poświęcony recenzji motywu Monstroid, który można zakupić na stronie templatemonster.com/pl/. Po przetestowaniu produktu, chcę podzielić się moimi wnioskami oraz spostrzeżeniami opartymi na kilkuletniej praktyce wdrożeniowej WordPress-a.

Motyw Monstroid posiada wiele możliwości wykorzystania. Wskazuje na to fakt, że po zakupie klient otrzymuje 29 child theme (tzw. motywów potomnych), darmowe wsparcie techniczne oraz klikanaście profesjonalnych zdjęć / obrazków do dowolnego wykorzystania.

Dla grafików jest też dodatkowa korzyść. Wraz z motywem można pobrać 120 layoutów psd, dzięki którym można stworzyć swój unikalny wygląd, a następnie go wdrożyć w oparciu o motyw Monstroid.

Zanim zacznę omawiać szczegółowo, napiszę krótko o podstawowych zaletach i wadach tego motywu WordPress.

Zalety:

  1. Responsywność (strona jest zbudowana na frameworku Bootstrap oraz Cherry Framework)
  2. Czcionki z Google
  3. Przyjazna i zoptymalizowana pod Google
  4. Wsparcie dla BuddyPress, bbPress, Woocommerce
  5. Edytor oraz opcje motywu
  6. Wsparcie dla Retiny

Wady

  1. Stosunkowo długa instalacja motywu i wszystkich niezbędnych wtyczek (jest to proces jednorazowy przed rozpoczęciem pracy nad stroną)

Uwagi:

  1. Podczas pierwszej instalacji motywu napotkałem błąd, który polegał na tym, że musiałem kilka razy powtarzać cykl ładowania wszystkich wtyczek polecanych przez autorów w tym instalatorze. W efekcie przedłużało to czas jego instalacji. Na ten czynnik może wpływać m.in. funkcjonowanie lub słabe parametry serwera, problem z Internetem (np. instalacja wykonywana na łączu mobilnym). U Ciebie ten problem może nie wystąpić.

Proces instalacji motywu Monstroid

Wymagane jest działanie rozszerzenia Monstroid Wizard, które automatycznie wspiera w instalacji: motywu, rekomendowane wtyczki i motywy potomne. Choć jest to niestandardowe rozwiązanie to nie zaburza to pracy nad stroną i w prosty sposób przeprowadza nas przez proces uruchomienia strony na tym motywie. W trakcie instalacji automatycznie pobiera się wszystko, co jest wymagane do działania motywu. Czas oczekiwania instalacji jest dość długi i jest praktycznie jedyna wada jaką napotkałem, ale nie stwarza żadnych skutków ubocznych w dalszej pracy.

Polecam postępować krok po kroku jak wskazują porady na: http://www.templatemonster.com/help/quick-start-guide/wordpress-themes/monstroid/quick_guide/index_en.html . Dzięki tym wskazówkom będziesz mógł uniknąć problemów oraz zaoszczędzić mnóstwo czasu, ponieważ sama instalacja i uruchomienie Monstroid-a różni się od standardowej instalacji, która wygląda tak:

  1. Wchodzisz do zakładki WYGLĄD > MOTYWY
  2. Wybierasz dostępny motyw lub wgrywasz ładując plik ZIP
  3. Instalujesz i włączasz

Dużą zaletą jest możliwość wyboru jednego motywu spośród 29 motywów potomnych. Jest to dogodne, jeśli chcemy w szybki sposób uruchomić stronę w oparciu o gotowy wygląd przygotowany przez Template Monster. Instalacja motywu potomnego polega na przejściu do zakładki Narzędzia > Kreator Monstroid, wybraniu konkretnego child theme i wówczas zacznie się proces importu.

Natomiast myślę, że warto podejść do tej funkcji z pewną ostrożnością i nie instalować wszystkich motywów potomnych, tylko ten który faktycznie chcemy wykorzystać. Dlatego jeśli nie znamy jeszcze Monstroid-a to warto uruchomić sobie najpierw wersję testową na serwerze, zainstalować i przejrzeć wszystkie motywy potomne, a jak już się wybierze to po prostu ten motyw zainstalować na docelowej stronie. Przecież nie zmienia się motywu raz dziennie. Jest to decyzja na pewien okres czasu i bez sensu jest przetrzymywać wszystkie motywy potomne na stronie docelowej (jest to też mało bezpieczne rozwiązanie).

Motyw WordPress Monstroid - Instalacja motywu potomnego

Monstroid – Instalacja motywu potomnego

Dokumentacja motywu WordPress – Monstroid

Po instalacji motywu w zakładce Monstroid wyświetlają się trzy linki. Każdy z nich przekierowuje do innego rodzaju dokumentacji. Pierwszy link wskazuje na minimalistyczną dokumentację, drugi link na instrukcję typu Jak zacząć – pozwalającą sprawniej pracować z szablonem, a z kolei trzeci link do podstrony z wideo tutotrialami. Ich ilość przekracza 250 filmów, także jest się czego uczyć 🙂

Myślę, że tak duża ilość informacji pozwoli zaoszczędzić czas i wyeliminuje konieczność szukania rozwiązań w Google. Ponadto warto pamiętać o tym, że dostępne jest także bezpośrednie wsparcie autorów.

Ogromne możliwości konfiguracji

Jeśli nie masz wiedzy specjalistycznej możesz być spokojny. Uważam, że moduły stworzone przez autorów Monstroid-a w zupełności wystarczą, aby prowadzić m.in. blog, stronę firmową, portal z funkcjami społecznościowy / forum (dzięki wykorzystaniu BuddyPress /bbPress) oraz sklep internetowy (dzięki wykorzystaniu Woocommerce). Ponadto edycja treści jest bardzo intuicyjna.

Podstrona blogowa posiada wiele układów wyświetlania postów. Artykuły mogą wyświetlać się w układzie równych kolumn, linii czasu, klasycznie oraz podobnie jak na pinterest.com w postaci kafelek. W wersji demo możesz zobaczyć poszczególne warianty.

Dla osób, które nie posiadają wiedzy technicznej w ustawieniach motywu jest miejsce na wklejenie kodu z Google Analitycs. Uważam, że jest to bardzo dobre rozwiązanie, ponieważ najczęściej robiąc wdrożenia na WordPress-ie instaluję dodatkową wtyczkę do GA lub tworząc motyw potomny wklejam kod bezpośrednio do nagłówka header.php. Ponadto myślę, że warto ograniczyć ilość instalowanych wtyczek do minimum, jeśli oczywiście jest taka możliwość.

Rozbudowując witrynę możemy skorzystać z wielu modułów. Mamy do dyspozycji m.in sekcje: kontaktu, opisania usług, przedstawienia zespołu, wyświetlenia rekomendacji, najnowszych wpisów. Monstroid oferuje również animowane przejścia oraz inne dodatki. Jednym z nich są eleganckie wykresy, które zwłaszcza na stronach firmowych są świetnym dodatkiem. Dzięki tym gotowym ułatwieniom nie ma potrzeby narażać się na dodatkowe koszty i zlecać specjalistom dodatkową pracę.

W opisywanym produkcie jest również możliwość tworzenia podstron w stylu OnePage. Poinformuję też o tym, że nawigacja może być dostosowana do przewijania wewnątrz jednej podstrony, jak to zazwyczaj bywa w stronach typu OnePage. Osobiście nie przepadam za stronami tego typu, ale są pewne sytuacje gdzie ten typ stron się świetnie sprawdza (zwłaszcza jak klient nie ma zbyt wielu materiałów na stronę, a chce mieć schludną i atrakcyjną stronę).

Dzięki specjalnemu edytorowi dla osób bardziej zaawansowanych jest dodatkowe rozwiązanie. Polega ono na edycji shortcode w odrębnej zakładce poprzez ingerencję kodu HTML. Całkiem ciekawy dodatek, który będę musiał dokładnie przetestować.

Motyw WordPress Monstroid - Edycja Shortcode

Monstroid – Edycja Shortcode

Jeśli pracowałeś z edytorami drag and drop możesz znać wtyczkę Visual Composer lub Divi Builder. W tym szablonie wdrożony jest edytor MotoPress Content Editor. Do tej pory nie korzystałem z tego edytora. Natomiast z moich testów opracowanych na potrzebę tego artykułu wynika, że edycja treści przebiega intuicyjnie i całkiem możliwe, że będę częściej korzystał z motywów WordPress oferowanych przez Template Monster. Edytor jest prosty w obsłudze, ale nie należy do moich ulubionych rozwiązań – najczęściej korzystam z Divi Builder-a i bardzo sobie go chwalę. Miałem wielokrotnie styczność z Visual Composer-em, ale jak dla mnie jest to ogromny kombajn, który nie tylko mocno obciąża całą stronę, to jeszcze dodaje bardzo dużo zbędnego wynikowego kodu. Idealnym rozwiązaniem jest nie korzystać kompletnie z builder-ów, jednak są one obecnie nie tylko bardzo popularne, ale też dają dużą kontrolę użytkownikowi końcowemu nad wyglądem strony.

Poniżej przedstawiam zrzut ekranu, który pokazuje ten edytor. W lewym pasku są dostępne moduły, które możemy przeciągnąć na dane miejsce wyświetlania.

Motyw WordPress Monstroid - MotoPress edytor

Monstroid – MotoPress edytor

Moduły MotoPress, które możemy umieścić na stronie,to m.in.:

  • przyciski,
  • obrazy (np. galerie, slidery, zdjęcia i video w formie parallax, podglądy wideo)
  • obszary tekstowe (np. opinie, dłuższe teksty, tytuły, inicjały, ikonki, wypunktowania)
  • media (np. wideo z youtube, audio ładowane z biblioteki mediów)
  • pozostałe dodatki (np. wpis, licznik, efekt ładowania, możliwość embedowania kodu, zakładki usług)

W Monstroid znajdziemy także wtyczkę MotoPress Slider.

Edycja jest naprawdę bardzo rozbudowana i pozwala tworzyć ciekawe slidery. Pomimo tego zarówno osoba techniczna, jak i osoba rozpoczynająca przygodę z WordPress-em poradzi sobie z jej konfiguracją. Niezbędny jest tylko czas, chęć do nauki i czasami cierpliwość do poprawiania własnych błędów

Testowanie szybkości motywu Monstroid

Świetne funkcje to nie wszystko, ponieważ w przypadku budowy strony www należy też zwrócić uwagę na szybkość jej działania, ponieważ to właśnie od tego elementu zależy konwersja, np. w sklepie internetowym, czy zapisy na listę adresową, oraz wpływa to też bezpośrednio na współczynnik odrzuceń, który jest jednym z elementów rankingowych SEO w Google. Dlatego tak ważne jest, aby stron internetowa była nie tylko atrakcyjna wizualnie, ale też działała szybko.

Do testów na szybko użyłem Google Pagespeed Insights, Tools Pingdom oraz GTMetrix. Są to narzędzia, które używam na co dzień do wstępnej analizy szybkości strony oraz zebrania informacji o tym na co należy zwrócić uwagę podczas optymalizacji szybkości działania strony.

Motyw WordPress Monstroid - Google PageSpeed Mobile

Monstroid – Google PageSpeed Mobile

Motyw WordPress Monstroid - Google PageSpeed Desktop

Monstroid – Google PageSpeed Desktop

Motyw WordPress Monstroid - GTMetrix

Monstroid – GTMetrix

Motyw WordPress Monstroid - Pingdom

Monstroid – Pingdom

Wyniki tych testów jak  są bardzo pozytywne biorąc pod uwagę fakt, że jest to wersja bazowa bez żadnej optymalizacji. Wskazały one, że nie ma żadnych poważnych błędów w optymalizacji. Wystarczą tylko małe zmiany, aby strona była idealnie zoptymalizowana i szybko działała. W zakres tych tych zmian wchodzi przede wszystkim kompresja obrazków. Dzięki temu uzyskamy szybsze działanie strony i mniejsze zużycie transferu. Oprócz tego oczywiście dobrze też zadbać o konfigurację cache, wykorzystać możliwości przechowywania plików statycznych w przeglądarce użytkownika, czy minifikację plików JS i CSS. Mimo wszystko jestem bardzo mile zaskoczony!

Kompresję obrazków można wykonać ręcznie za pomocą strony: http://tinypng.com/ lub wykorzystując wtyczki WordPress, np. EWWW Image Optimizer lub WP Smush – Image Optimization.

W zakładce Cherry możesz znaleźć ustawienia o nazwie „Optymalizacja”. Będziesz mógł włączyć minifikację CSS. Jest to świetne rozwiązanie, tym bardziej że często właśnie pliki CSS motywu są dodatkowym obciążeniem całej witryny i bywają z nimi problemy przy optymalizacji. Poniżej wysyłam zrzut ekranu tylko po tym zabiegu. Oprócz tego jak wspomniałem warto też zadbać o minifikację reszty plików CSS i JS oraz o poprawną konfigurację cache i konfigurację przechowywania plików statycznych w cache przeglądarki.

Poniżej zobaczysz jak zmieniły się poszczególne elementy po uruchomieniu minifikacji CSS w opcjach Cherry. O ile w Google Pagespeed Insights wynik jest gorszy (tego akurat kompletnie nie rozumiem 😀 ), to w pozostałych dwóch narzędziach widać od razu różnicę w ilości zapytań do serwera, wielkości witryny oraz czasie ładowania się strony.

Motyw WordPress Monstroid - Google PageSpeed Mobile po optymalizacji

Monstroid – Google PageSpeed Mobile po optymalizacji

Motyw WordPress Monstroid - Google PageSpeed Desktop po optymalizacji

Monstroid – Google PageSpeed Desktop po optymalizacji

Motyw WordPress Monstroid - GTMetrix po optymalizacji

Monstroid – GTMetrix po optymalizacji

Motyw WordPress Monstroid - Pingdom po optymalizacji

Monstroid – Pingdom po optymalizacji

Google również interpretuje szablon jako dobrze przygotowany w kwestii responsywności i po ostatnich informacjach będzie on bardziej premiował witryny dostosowane do urządzeń mobilnych.

Motyw WordPress Monstroid - RWD

Monstroid – RWD

Wsparcie dla wtyczki Woocommerce

Motyw Monstroid wspiera wtyczkę Woocoommerce. Autorzy Woothemes wymagają integracji każdego motywu z ich wtyczką. W tym celu należy dostosować się do zaleceń opisanych na stronie: https://docs.woocommerce.com/document/third-party-custom-theme-compatibility/

Natomiast Monstroid jest już gotowy i nie potrzeba stosować żadnej modyfikacji technicznej. Wystarczy zainstalować wtyczkę Woocommerce, skonfigurować, dodać produkty i rozpocząć sprzedaż 🙂

Wygląd podstrony z pojedynczym produktem można w prosty sposób edytować. To my decydujemy w jakim układzie graficznym ustawimy treści. Możesz też ustawiać wygląd nagłówka. Dostępnych jest wiele innych ustawień wpływających na wygląd produktu oraz sklepu. To też duży atut tego motywu WordPress.

Motyw WordPress Monstroid - Widok pojedynczego produktu

Monstroid – Widok pojedynczego produktu

Dodatkowe i polecane wtyczki WordPress

Monstroid wyświetla komunikat o zainstalowaniu polecanych przez autorów wtyczek. Są one również zawarte w folderze, który pobierzemy z panelu na Template Monster. W polecanych wtyczkach znajdziemy dodatki do Woocommerce.

Są to m.in.:

  • YITH WooCommerce Wishlist
  • YITH WooCommerce Quick View
  • YITH WooCommerce Compare

Tworzenie layout-ów w Photoshopie na podstawie dołączonych PSD

Do dyspozycji mamy oddzielne projekty dla:

  • sklepu,
  • bloga,
  • podstron,
  • strony głównej,
  • galerii,
  • oraz poszczególnych elementów, np. typografia.

Tak wiele wersji pozwala nam na szybkie utworzenie wizualizacji strony bez zbędnej pracy i dostosowania wyglądu do naszych potrzeb. Tak przygotowany layout możemy później bez większych problemów wdrożyć wykorzystując motyw Monstroid.

Podsumowanie

Moim zdaniem Monstroid jest produktem bardzo profesjonalnym i wartym uwagi. Cieszy się wieloma pozytywnymi opiniami w sieci, które można przeczytać na stronie produktu oraz na wielu blogach branżowych. Biorąc pod uwagę jego wartość uważam, że cena jest niewygórowana, także w wersji dla web developerów. Warta uwagi jest możliwość pobrania stockowych zdjęć. Edycja motywu nie sprawia większych problemów i jest intuicyjna. Motyw funkcjonuje poprawnie i co najważniejsze szybko. Grafika jest przygotowana bardzo profesjonalnie. Do dyspozycji mamy wiele grup wsparcia „fanów” WordPress-a.  Te wszystkie cechy wskazują, że warto poważnie rozważyć zakup tego motywu. Sam pewnie zacznę go wykorzystywać w swoich wdrożeniach 🙂 Jestem też ciekaw Twoich uwag / opinii na temat tego produktu, także napisz w komentarzu co o nim myślisz.

Dodaj komentarz

CommentLuv badge
Share This
Przeczytaj poprzedni wpis:
Wyniki konkursu – Trendy w projektowaniu stron internetowych w 2015 r.

zakończył się konkurs "Trendy w projektowaniu stron internetowych w 2015 r.". Wspólnie z Janem Kamińskim z Template Monster wylosowaliśmy zwycięzców....

Zamknij