Chcesz zbudować stronę lub sklep internetowy, ale nie potrafisz kodować? Motyw Monstroid2 pozwala zbudować bloga, landing page, sklep internetowy bez umiejętności kodowania. Zmiany wprowadzone na stronie są widoczne od razu, a to wszystko za pomocą metody „przeciągnij i upuść”.
Monstroid2 – Motyw uniwersalny
Monstroid2 to wszechstronny motyw z ogromnymi możliwościami. Ponad 70 gotowych szablonów przyspiesza cały proces tworzenia strony, a sama praca z tym motywem jest dzięki temu dużo przyjemniejsza.
W skrócie wygląda to tak:
- Instalujesz WordPress na hostingu
- Wgrywasz motyw i go aktywujesz
- Instalujesz szablon demo z zawartością i niezbędne wtyczki za pomocą autoinstalatora
- Edytujesz wygląd i treść pod siebie
- Gotowe
Jednak, aby nie było za przyjemnie, trzeba najpierw przebrnąć przez etap poznawania tego motywu i wszystkich jego funkcji, dodatkowych wtyczek… Jest tego sporo, a jeśli ktoś jest całkowitym laikiem to może pojawić się sporo problemów takich jak:
- Wybór niewłaściwego hostingu – Ten motyw ma swoje wymagania i należy wybrać odpowiedni hosting. Wszystko jest dobrze opisane w dokumentacji.
- Brak znajomości wtyczek – Trzeba nauczyć się korzystać chociażby z Elementora – Oczywiście jest mnóstwo darmowych filmików i poradników, ale wiadomo, że potrzeba na to trochę czasu.
- Błędy przy instalacji wtyczek – instalator może się zacinać, jednak nie jest to wina motywu, a ustawień hostingu.
- Instalacje niepotrzebnych wtyczek – Pamiętaj, aby instalować tylko te wtyczki, których będziesz rzeczywiście używał.
Zakładając, że masz już podstawową wiedzę o hostingu i WordPressie to bez problemu poradzisz sobie ze stworzeniem strony na motywie Monstroid2. Potrzeba tylko chwili na zapoznanie się z wszystkimi ustawieniami. Poniżej opiszę cały proces instalacji i stworze przykładową stronę.
Motyw można kupić tutaj za $75.
Plusy Monstroid2
- Uniwersalny motyw
- Współpracuje z WooCommerce
- Automatyczny instalator szablonów, wtyczek i treści demo
- Bardzo szybki mimo rozbudowanych funkcji
- Wiele możliwości dostosowywania
- Płatne wtyczki JetPlugins w cenie motywu
- Ciągłe aktualizacje
- 73+ gotowe projekty do natychmiastowego wykorzystania
- Motyw potomny – przy aktualizacjach Twoje zmiany w motywie nie znikną (np. kod Google Analytics w headerze)
- Support 24/7
Minusy Monstroid2
- Dokumentacja w języku angielskim
- Zacinający się autoinstalator – trzeba ustawić odpowiednio hosting
- Nieintuicyjny panel na templatemonster
- Motyw w języku angielskim
Dodatkowe wtyczki
W zestawie otrzymasz dodatkowe wtyczki, które rozbudowują możliwości edycji motywu. W pakiecie otrzymasz takie pluginy:
- M2 Theme Wizard – Wtyczka do instalacji motywu Monstroid2
- Motopress Hotel Booking – Wtyczka do zarządzania rezerwacjami nieruchomości (apartamenty, hotele, pokoje itp.)
- Revslider – Tworzenie sliderów
- JetPlugins: Pluginy dla Elementora – Te pluginy są w cenie motywu, za 75$ mamy motyw + pluginy.
- JetBlog (15$) – Dodaje nowe możliwości prezentacji treści.
- JetBlocks (15$) – Dodatkowe elementy nawigacji (menu, logowanie, widget formularza rejestracji itp)
- JetElements(19$) – Znacznie rozbudowuje możliwości Elementora (widgety, suwaki, mapa, osie czasu i wiele więcej)
- JetMenu(19$) – Tworzenie rozbudowanych menu.
- JetParallax -Pozwala stworzyć efekt paralaksy z obrazka (ruchome tło)
- JetPopup(19$) – W szybki sposób stworzysz dowolny popup
- JetTabs(15$) – Stworzysz dodatkowe karty np. FAQ, zakładki itp.
- JetThemeCore – Dodasz gotowe stylizacji i bloki tekstu do obszaru roboczego w Elementorze
- JetTricks (15$) – Dodatkowe elementy wizualne, animacje, efekty paralaksy dla tekstu itp.
- JetWoo Builder(19$) – Mnóstwo nowych możliwości edycji dla WooCommerce
- JetWooProductGallery (10$) – Wtyczka galerii WooCommerce
Więcej informacji o JetPlugins znajdziesz tutaj.
Instalacja motywu
Krok 1. Wybierz odpowiedni hosting i zainstaluj WoordPress’a. Przeczytaj artykuł: Jaki hosting wybrać dla WordPress?
Zalecana konfiguracja dla motywu Monstroid2:
- ‘max_execution_time’ => 60;
- ‘memory_limit’ => 128;
- ‘post_max_size’ => 8;
- ‘upload_max_filesize’ => 8;
- ‘max_input_time’ => 45;
- ‘file_uploads’ => ‘on’;
- ‘safe_mode’ => ‘off’.
- 50 MB miejsca na dysku.
- Limit pamięci na proces: 64 MB (zalecane 128 MB lub więcej).
- W pliku .htaccess, ‘php_value max_execution_time’ => 60.
- W pliku wp-config.php, ‘set_time_limit’ => 60.
Każdy polecany przez mnie hosting na spokojnie będzie działał z tym motywem. Jeśli masz wątpliwości czy Twój hosting będzie okej, to napisz do supportu z zapytaniem i wyślij te wymagania.
Krok 2. Zainstaluj motyw Monstroid2
- W kokpicie WordPressa przejdź do Wygląd > Motywy, a następnie Dodaj > Wyślij motyw na serwer > Wybierz plik. Tutaj wybierz plik motywu w: Manual Install > Theme > monstroid2.zip. i kliknij Zainstaluj teraz. Poczekaj aż instalacja się zakończy i zainstaluj motyw potomny. Na koniec aktywuj motyw monstroid2-child. Więcej o motywach potomnych tutaj.
- Na górze strony w kokpicie wyświetli Ci się propozycja instalacji wtyczki Jet Plugins Wizard. Kliknij w Begin installing plugin i zainstaluj tą wtyczkę.
- W pierwszym oknie instalatora wprowadź licencję. Licencja to numer zamówienia (order ID), znajdziesz go w emailu i w swoim profilu Templatemonster przy motywie w zakładce Download.
- Po poprawnym wprowadzeniu licencji dostaniesz krótkie info i podziękowanie, kliknij Next.
- W tym momencie masz do wyboru ponad 70 gotowych szablonów stron. Przejrzyj sobie najpierw wersje DEMO, przekonasz się czy motyw odpowiada twoim oczekiwaniom. Kiedy już się zdecydowałeś wystarczy kliknąć Start Install. Ja wybrałem skórkę Woods do zarządzania rezerwacjami apartamentów w hotelu.
- Ja wybrałem w taki sposób, nie potrzebuje wtyczek do WooCommerce więc zostawiam odznaczone. Pozostałe zostawiam i klikam Next.
- Zaczekaj aż wszystkie wtyczki zostaną zainstalowane. W przypadku złej konfiguracji hostingu mogą wystąpić problemy z zacinaniem się autoinstalatora (kręci się mimo tego, że wtyczka już została zainstalowana). Wystarczy odświeżyć stronę i wszystko powinno zadziałać. Ten problem możesz łatwo naprawić dodając jedną linijkę kodu do .htaccess – więcej info na końcu artykułu.
- W tym miejscu możesz zainstalować przykładową treść, która zapełni Twoją stronę. Ja wybrałem zamianę treści, ponieważ mam nową instalację WordPressa. Jest to duże ułatwienie, szczególnie jeśli nie znasz tego motywu, bo pozwala od razu zobaczyć jak wygląda dana podstrona czy funkcja i sposób jej działania. Pamiętaj aby usunąć niepotrzebne elementy kiedy już edytujesz treść na swoją. Jeśli nie chcesz korzystać z wgrywania przykładowej treści to po prostu pomiń ten krok klikając: „Skip demo content installation”.
- Zaczekaj, aż wszystko się zakończy i przejdź dalej.
- Kiedy zakończy się generowanie miniaturek, instalacja dobiegnie końca. Teraz czas na edycję motywu.
Edycja motywu
Instalację masz już za sobą więc możesz przejść do edycji motywu.
Na stronie głównej w kokpicie kliknij Spersonalizuj swoją witrynę. Zostaniesz przekierowany do personalizacji witryny.
Najlepiej po kolei przeanalizować wszystkie zakładki i zmienić wszystko co potrzebujesz.
Przeanalizujmy dostępne opcje podstawowej edycji motywu:
Tożsamość witryny
W pierwszej zakładce ustawiamy tytuł witryny, opis oraz trzy opcje dodatkowe – patrz obrazek. Pamiętaj, aby ustawić odpowiednio tytuł witryny ponieważ będzie on widoczny w wynikach wyszukiwania Google.
Wgraj swoje logo, pamiętaj o odpowiednich wymiarach, w moim przypadku 135px na 35px. po kliknięciu Wybierz logo znajdziesz informacje o sugerowanych wymiarach loga do Twojego szablonu.
Pozostałe opcje ustaw wedle własnego uznania, ja zostawiłem wszystkie trzy.
Booking styles
Po kliknięciu w drugą zakładkę pojawią się dwie kolejne: Colors i Typography (Kolory i Typografia – Czcionki). Ustawiasz tutaj style dla rezerwacji.
Wybierz Colors i ustaw odpowiednio kolory. Kolor twojej witryny to też tworzenie świadomości marki – ludzie będą kojarzyli Twoją firmę po kolorach, logu, czcionce. Staraj się trzymać tej samej kolorystyki. Wprowadzone zmiany będziesz od razu widział w podglądzie, aby zatwierdzić edycję wystarczy kliknąć Opublikuj.
General Site settings
W tym miejscu ustawisz kilka głównych opcji, takich jak:
- Favicon – To ikona widoczna na kartach przeglądarek. Powinna być kwadratowa i mieć co najmniej 512 x 512 px
- Breadcrumbs – Jest to nawigacja dzięki której użytkownik może śledzić aktualną lokalizację w witrynie.
- Social links – Ta opcja pozwala włączyć ikony społecznościowe w nagłówku i stopce.
- Page Layout – Umożliwia edycję wielkości kontenera oraz szerokość paska bocznego (sidebar).
Kolory
Jedyna opcja to zmiana koloru tła.
Color Scheme
Tutaj mamy znacznie więcej możliwości edycji kolorów. Bardzo wygodnie pracuje się z tym motywem, kilkoma kliknięciami zmieniamy kolory w całej witrynie bez znajomości CSS.
Typography
Wybierz font dla każdego nagłówka i akapitów. Jedno kliknięcie pozwala na błyskawiczną edycję wyglądu czcionki na całej stronie.
Jeśli nie widzisz żadnych zmian to prawdopodobnie to nie ta wielkość nagłówka, spróbuj kliknąć inne H. Jeśli nie widzisz zmian w Body text to wejdź w podglądzie w jakiś wpis blogowy i spróbuj wtedy.
Przy edycji Menu, Twoje zmiany mogą być niewidoczne ponieważ element header wraz z menu został stworzony w Elementorze i to za jego pomocą będziesz mógł edytować czcionkę.
Przykład zmiany czcionki wszystkich tagów H4.
Header
Tutaj możesz zmieniać style dla nagłówka. Jeśli jednak (jak w moim przypadku) masz header stworzony w Elementorze, to właśnie tam będziesz musiał nanieść zmiany, ale o tym w dalszej części artykułu.
Obrazek tła
Jeśli chcesz możesz wgrać background, polecam pobrać jakiś darmowy z np. pixabay.com. W moim przypadku lepiej jednak wygląda bez dodatkowego tła. 🙂
Za pomocą strzałek możesz wypozycjonować odpowiednio swoje tło.
Menu
Banalnie proste ustawianie kolejności menu, po prostu przesuwasz i upuszczasz. Czasem zmiany mogą być niewidoczne, trzeba odświeżyć stronę. Pamiętaj, aby przed odświeżeniem strony zapisać zmiany!
Edycja tekstu do menu zmieniasz po kliknięciu w strzałeczkę \/.
Odnośniki dla menu możesz edytować w Kokpit > Wygląd > Menu.
Footer
Szybka zmiana stopki na własną.
Blog
Wejdź w podglądzie w zakładkę Blog aby widzieć zmiany.
Do wyboru jest kilka rodzajów prezentacji treści, a do każdego 7-10 stylizacji:
- Grid Style
- Listing
- Masnory
- Vertical Justify
- Creative
Jak widać, opcji edycji wyświetlania postów jest bardzo dużo więc na pewno któryś będzie dla Ciebie odpowiedni.
Ustawienia strony głównej
W tym miejscu ustawiasz która strona ( z zakładki kokpit > Strony > Wszystkie strony) ma być wyświetlana jako główna. Jeśli masz sklep w WooCommerce to możesz ustawić ją jako stronę główną.
To samo dotyczy strony z wpisami, standardowo jest to Blog.
Dodatkowy CSS
Jeśli znasz CSS to w tym miejscu możesz dodać swój niestandardowy kod.
Edycja strony głównej w Elementorze
W motywie Monstroid2 już w samej personalizacji podstawowej możesz zmodyfikować bardzo wiele elementów. Całą resztę wykonasz za pomocą Elementora. Polecam Ci przeczytać dokumentację, ponieważ to temat tak obszerny, że mogę Ci tutaj pokazać jedynie niektóre funkcje. Baza wiedzy ELEMENTOR.
Aby edytować stronę główną (lub inną) wystarczy przejść do Kokpit > Strony > Wszystkie strony i Wybrać Edytuj w Elementorze. Druga opcja to odwiedzić odpowiednią stronę i w górnym pasku kliknąć Edytuj w Elementorze.
Teraz masz możliwość zmiany całego układu strony, kolorów, treści, zdjęć. Działa tutaj prawy przycisk myszy więc nie zapominaj z niego korzystać, jest dużo wygodniej.
Przykład zmiany treści na stronie głównej:
Jak edytować nagłówek w Elementorze?
Przejdź do swojej witryny na stronę główną i w górnym pasku kliknij Edytuj w Elementorze > Header-front
Możesz dowolnie zmieniać wymiary, kolory, logo, ikony społecznościowe, przyciski.
Przykład zmiany koloru buttona:
Podsumowanie
Motyw Monstroid2 to naprawdę wszechstronne narzędzie, które daje potężne możliwości tworzenia stron internetowych. Mimo swojej rozbudowanej struktury jest bardzo szybki i prosty w obsłudze. Bardzo doceniam to, że kupując jeden motyw mogę stworzyć setki całkowicie różnych stron.