{"id":5030,"date":"2025-08-20T14:47:34","date_gmt":"2025-08-20T12:47:34","guid":{"rendered":"https:\/\/cocos.codes\/?p=5030"},"modified":"2026-01-21T16:11:12","modified_gmt":"2026-01-21T15:11:12","slug":"prestashop-kategorie-na-stronie-glownej","status":"publish","type":"post","link":"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/archiwa\/prestashop-kategorie-na-stronie-glownej\/","title":{"rendered":"PrestaShop Kategorie Na Stronie G\u0142\u00f3wnej 1.0"},"content":{"rendered":"<h6 data-rm-block-id=\"block-1\">Dokumentacja PrestaShop Kategorie Na Stronie G\u0142\u00f3wnej<\/h6>Kompleksowa <a href=\"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/kategoria\/baza-wiedzy\/prestashop\/dokumentacje-prestashop\/\" title=\"Dokumentacja\">dokumentacja<\/a> dla modu\u0142u wy\u015bwietlania kategorii na stronie g\u0142\u00f3wnej <a href=\"https:\/\/addons.prestashop.com\/\" target=\"_blank\" rel=\"noopener\">PrestaShop<\/a> (<a href=\"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/produkt\/prestashop-kategorie-na-stronie-glownej-1-0-1\/\" title=\"Cc_ps_home_categories\">cc_ps_home_categories<\/a>) z zaawansowanymi opcjami stylizacji, wieloma trybami wy\u015bwietlania i pe\u0142n\u0105 kontrol\u0105 nad wygl\u0105dem kategorii.<br \/><br \/><strong>Spis tre\u015bci<\/strong><ol><li data-rm-block-id=\"block-2\">Wprowadzenie<\/li><li data-rm-block-id=\"block-3\">Instalacja<\/li><li data-rm-block-id=\"block-4\">Aktywacja licencji<\/li><li data-rm-block-id=\"block-5\">Panel zarz\u0105dzania<\/li><li data-rm-block-id=\"block-6\">Ustawienia og\u00f3lne<\/li><li data-rm-block-id=\"block-7\">Style wy\u015bwietlania<\/li><li data-rm-block-id=\"block-8\">Konfiguracja obraz\u00f3w<\/li><li data-rm-block-id=\"block-9\">Wyb\u00f3r kategorii<\/li><li data-rm-block-id=\"block-10\">Customizacja wygl\u0105du<\/li><li data-rm-block-id=\"block-11\">Responsywno\u015b\u0107<\/li><li data-rm-block-id=\"block-12\">Rozwi\u0105zywanie problem\u00f3w<\/li><li data-rm-block-id=\"block-13\">FAQ<\/li><\/ol><h6 data-rm-block-id=\"block-14\"><br \/>1. Wprowadzenie<\/h6>CC PrestaShop Kategorie G\u0142\u00f3wna to zaawansowany modu\u0142 umo\u017cliwiaj\u0105cy eleganckie wy\u015bwietlanie kategorii na stronie g\u0142\u00f3wnej sklepu. Modu\u0142 oferuje szerok\u0105 gam\u0119 styl\u00f3w wy\u015bwietlania, od klasycznych siatek po nowoczesne slidery, zapewniaj\u0105c pe\u0142n\u0105 kontrol\u0119 nad wygl\u0105dem i funkcjonalno\u015bci\u0105.<br \/><br \/><strong>G\u0142\u00f3wne funkcje modu\u0142u:<\/strong><ul><li data-rm-block-id=\"block-15\">7 r\u00f3\u017cnych styl\u00f3w siatki (klasyczna, nowoczesna, minimalistyczna, kolorowa, elegancka, dark mode, light bordered)<\/li><li data-rm-block-id=\"block-16\">Slider z nawigacj\u0105 i obs\u0142ug\u0105 gest\u00f3w dotykowych<\/li><li data-rm-block-id=\"block-17\">3 tryby list (pozioma, pionowa, kompaktowa)<\/li><li data-rm-block-id=\"block-18\">Pe\u0142na kontrola nad wyborem kategorii<\/li><li data-rm-block-id=\"block-19\">Zaawansowane opcje obraz\u00f3w<\/li><li data-rm-block-id=\"block-20\">Responsywny design<\/li><li data-rm-block-id=\"block-21\">System licencyjny COCOS<\/li><li data-rm-block-id=\"block-22\">Wieloj\u0119zyczna obs\u0142uga<\/li><li data-rm-block-id=\"block-23\">Animacje i efekty przej\u015b\u0107<\/li><li data-rm-block-id=\"block-24\">Mo\u017cliwo\u015b\u0107 umieszczenia w r\u00f3\u017cnych hookach<\/li><\/ul><h6 data-rm-block-id=\"block-25\"><br \/>2. Instalacja<\/h6><strong>Wymagania systemowe<\/strong><ul><li data-rm-block-id=\"block-26\"><a href=\"https:\/\/prestashop.com\/\" title=\"PrestaShop\" target=\"_blank\" rel=\"noopener\">PrestaShop<\/a> 1.7.0.0 lub nowszy<\/li><li data-rm-block-id=\"block-27\"><a href=\"https:\/\/www.php.net\/\" title=\"PHP\" target=\"_blank\" rel=\"noopener\">PHP<\/a> 7.2 lub nowszy<\/li><li data-rm-block-id=\"block-28\"><a href=\"https:\/\/www.mysql.com\/\" title=\"MySQL\" target=\"_blank\" rel=\"noopener\">MySQL<\/a> 5.6 lub nowszy<\/li><li data-rm-block-id=\"block-29\">Uprawnienia do instalacji modu\u0142\u00f3w<\/li><li data-rm-block-id=\"block-30\">Minimum 256 MB RAM (zalecane 512 MB)<\/li><li data-rm-block-id=\"block-31\">Rozszerzenie GD dla przetwarzania obraz\u00f3w<\/li><\/ul><strong>Proces instalacji<\/strong><ol><li data-rm-block-id=\"block-32\">Pobierz plik ZIP modu\u0142u z oficjalnego sklepu <a href=\"https:\/\/iarina029.supserv.cozmoslabs.com\" title=\"Cocos.codes\">cocos.codes<\/a><\/li><li data-rm-block-id=\"block-33\">Zaloguj si\u0119 do panelu administracyjnego PrestaShop<\/li><li data-rm-block-id=\"block-34\">Przejd\u017a do: Modu\u0142y &gt; Mened\u017cer modu\u0142\u00f3w &gt; Dodaj nowy modu\u0142<\/li><li data-rm-block-id=\"block-35\">Kliknij \u201eDodaj modu\u0142&#8221; i wybierz pobrany plik ZIP<\/li><li data-rm-block-id=\"block-36\">Po zako\u0144czeniu instalacji kliknij \u201eKonfiguruj&#8221;<\/li><li data-rm-block-id=\"block-37\">Modu\u0142 automatycznie zarejestruje si\u0119 w hooku displayHome<\/li><\/ol><div class=\"cc-alert cc-alert-info\"><div class=\"cc-alert-title\" data-rm-block-id=\"block-38\">Info<\/div><div class=\"cc-alert-content\" data-rm-block-id=\"block-39\">Po instalacji modu\u0142 automatycznie ustawia si\u0119 na pierwszej pozycji w hooku displayHome i tworzy domy\u015bln\u0105 konfiguracj\u0119. Wszystkie style CSS i JavaScript s\u0105 \u0142adowane automatycznie na stronie g\u0142\u00f3wnej.<\/div><\/div><h6 data-rm-block-id=\"block-40\"><br \/>3. Aktywacja licencji<\/h6>Przed rozpocz\u0119ciem korzystania z pe\u0142nej funkcjonalno\u015bci modu\u0142u konieczna jest aktywacja licencji:<ol><li data-rm-block-id=\"block-41\">Po instalacji przejd\u017a do konfiguracji modu\u0142u<\/li><li data-rm-block-id=\"block-42\">Wybierz zak\u0142adk\u0119 \u201eLicencja&#8221;<\/li><li data-rm-block-id=\"block-43\">Wprowad\u017a klucz licencyjny otrzymany po zakupie<\/li><li data-rm-block-id=\"block-44\">Kliknij \u201eAktywuj licencj\u0119&#8221;<\/li><li data-rm-block-id=\"block-45\">System sprawdzi wa\u017cno\u015b\u0107 licencji na serwerach COCOS<\/li><li data-rm-block-id=\"block-46\">Po pomy\u015blnej aktywacji zobaczysz komunikat potwierdzaj\u0105cy<\/li><\/ol><div class=\"cc-alert cc-alert-warning\"><div class=\"cc-alert-title\" data-rm-block-id=\"block-47\">Ostrze\u017cenie<\/div><div class=\"cc-alert-content\" data-rm-block-id=\"block-48\">Bez aktywnej licencji modu\u0142 nie b\u0119dzie wy\u015bwietla\u0142 kategorii na stronie g\u0142\u00f3wnej. W g\u00f3rnej cz\u0119\u015bci panelu administracyjnego b\u0119dzie wy\u015bwietlany komunikat o niewa\u017cnej licencji wraz z linkiem do aktywacji.<\/div><\/div><h6 data-rm-block-id=\"block-54\"><br \/>4. Panel zarz\u0105dzania<\/h6>Panel zarz\u0105dzania modu\u0142em sk\u0142ada si\u0119 z kilku zak\u0142adek umo\u017cliwiaj\u0105cych pe\u0142n\u0105 konfiguracj\u0119:<br \/><br \/><strong>G\u0142\u00f3wne zak\u0142adki:<\/strong><ul><li data-rm-block-id=\"block-55\"><strong>Ustawienia<\/strong> &#8211; g\u0142\u00f3wna konfiguracja modu\u0142u (dost\u0119pna tylko z wa\u017cn\u0105 licencj\u0105)<\/li><li data-rm-block-id=\"block-56\"><strong>Dokumentacja<\/strong> &#8211; link do pe\u0142nej dokumentacji online<\/li><li data-rm-block-id=\"block-57\"><strong>Wsparcie<\/strong> &#8211; link do strony wsparcia technicznego COCOS<\/li><li data-rm-block-id=\"block-58\"><strong>Wtyczki<\/strong> &#8211; lista dost\u0119pnych rozszerze\u0144 COCOS<\/li><li data-rm-block-id=\"block-59\"><strong>Licencja<\/strong> &#8211; zarz\u0105dzanie licencj\u0105 modu\u0142u<\/li><\/ul>System automatycznie przekierowuje na zak\u0142adk\u0119 licencji je\u015bli klucz nie jest aktywny, zapewniaj\u0105c intuicyjny proces konfiguracji.<h6 data-rm-block-id=\"block-60\"><br \/>5. Ustawienia og\u00f3lne<\/h6>W sekcji ustawie\u0144 og\u00f3lnych znajdziemy podstawowe opcje steruj\u0105ce dzia\u0142aniem modu\u0142u:<br \/><br \/><table class=\"woocommerce-table shop_table\"><thead><tr><td data-rm-block-id=\"block-61\"><strong>Ustawienie<\/strong><\/td><td data-rm-block-id=\"block-62\"><strong>Opis<\/strong><\/td><td data-rm-block-id=\"block-63\"><strong>Domy\u015blna warto\u015b\u0107<\/strong><\/td><\/tr><\/thead><tbody><tr><td data-rm-block-id=\"block-64\">W\u0142\u0105cz modu\u0142<\/td><td data-rm-block-id=\"block-65\">Globalne w\u0142\u0105czenie\/wy\u0142\u0105czenie wy\u015bwietlania<\/td><td data-rm-block-id=\"block-66\">W\u0142\u0105czony<\/td><\/tr><tr><td data-rm-block-id=\"block-67\">Poka\u017c tytu\u0142 sekcji<\/td><td data-rm-block-id=\"block-68\">Wy\u015bwietlanie nag\u0142\u00f3wka nad kategoriami<\/td><td data-rm-block-id=\"block-69\">W\u0142\u0105czony<\/td><\/tr><tr><td data-rm-block-id=\"block-70\">Tytu\u0142 sekcji<\/td><td data-rm-block-id=\"block-71\">Wieloj\u0119zyczny tekst nag\u0142\u00f3wka<\/td><td data-rm-block-id=\"block-72\">&#8222;Nasze Kategorie&#8221;<\/td><\/tr><tr><td data-rm-block-id=\"block-73\">Limit kategorii<\/td><td data-rm-block-id=\"block-74\">Maksymalna liczba kategorii (1-50)<\/td><td data-rm-block-id=\"block-75\">6<\/td><\/tr><\/tbody><\/table><strong>Funkcjonalno\u015b\u0107 g\u0142\u00f3wnego prze\u0142\u0105cznika<\/strong><ul><li data-rm-block-id=\"block-76\"><strong>W\u0142\u0105czony<\/strong> &#8211; kategorie s\u0105 widoczne na stronie g\u0142\u00f3wnej zgodnie z konfiguracj\u0105<\/li><li data-rm-block-id=\"block-77\"><strong>Wy\u0142\u0105czony<\/strong> &#8211; modu\u0142 nie wy\u015bwietla \u017cadnych kategorii<\/li><\/ul><div class=\"cc-alert cc-alert-tip\"><div class=\"cc-alert-title\" data-rm-block-id=\"block-78\">Wskaz\u00f3wka<\/div><div class=\"cc-alert-content\" data-rm-block-id=\"block-79\">U\u017cywaj g\u0142\u00f3wnego prze\u0142\u0105cznika do szybkiego wy\u0142\u0105czenia modu\u0142u bez utraty konfiguracji, np. podczas prac konserwacyjnych sklepu lub testowania nowych ustawie\u0144.<\/div><\/div><h6 data-rm-block-id=\"block-80\"><br \/>6. Style wy\u015bwietlania<\/h6>Modu\u0142 oferuje 11 r\u00f3\u017cnych styl\u00f3w wy\u015bwietlania kategorii, podzielonych na 3 g\u0142\u00f3wne grupy:<br \/><br \/><strong>Style siatki (Grid)<\/strong><table class=\"woocommerce-table shop_table\"><thead><tr><td data-rm-block-id=\"block-81\"><strong>Styl<\/strong><\/td><td data-rm-block-id=\"block-82\"><strong>Opis<\/strong><\/td><td data-rm-block-id=\"block-83\"><strong>Zalecane u\u017cycie<\/strong><\/td><\/tr><\/thead><tbody><tr><td data-rm-block-id=\"block-84\">grid_classic<\/td><td data-rm-block-id=\"block-85\">Klasyczne karty z ramkami i cieniami<\/td><td data-rm-block-id=\"block-86\">Uniwersalne sklepy<\/td><\/tr><tr><td data-rm-block-id=\"block-87\">grid_modern<\/td><td data-rm-block-id=\"block-88\">Gradient t\u0142a z overlay na obrazach<\/td><td data-rm-block-id=\"block-89\">Nowoczesne marki<\/td><\/tr><tr><td data-rm-block-id=\"block-90\">grid_minimal<\/td><td data-rm-block-id=\"block-91\">Czyste, minimalistyczne karty<\/td><td data-rm-block-id=\"block-92\">Sklepy premium<\/td><\/tr><tr><td data-rm-block-id=\"block-93\">grid_colorful<\/td><td data-rm-block-id=\"block-94\">Kolorowe ramki z animacjami<\/td><td data-rm-block-id=\"block-95\">Sklepy dla dzieci\/m\u0142odzie\u017cy<\/td><\/tr><tr><td data-rm-block-id=\"block-96\">grid_elegant<\/td><td data-rm-block-id=\"block-97\">Eleganckie karty ze z\u0142otymi akcentami<\/td><td data-rm-block-id=\"block-98\">Luksusowe marki<\/td><\/tr><tr><td data-rm-block-id=\"block-99\">grid_dark<\/td><td data-rm-block-id=\"block-100\">Ciemny motyw z efektami \u015bwietlnymi<\/td><td data-rm-block-id=\"block-101\">Gaming\/elektronika<\/td><\/tr><tr><td data-rm-block-id=\"block-102\">grid_light_bordered<\/td><td data-rm-block-id=\"block-103\">Jasne karty z wyra\u017anymi ramkami<\/td><td data-rm-block-id=\"block-104\">Sklepy korporacyjne<\/td><\/tr><\/tbody><\/table><strong>Style listy (List)<\/strong><table class=\"woocommerce-table shop_table\"><thead><tr><td data-rm-block-id=\"block-105\"><strong>Styl<\/strong><\/td><td data-rm-block-id=\"block-106\"><strong>Opis<\/strong><\/td><td data-rm-block-id=\"block-107\"><strong>Zalecane u\u017cycie<\/strong><\/td><\/tr><\/thead><tbody><tr><td data-rm-block-id=\"block-108\">list_horizontal<\/td><td data-rm-block-id=\"block-109\">Poziome karty z obrazkiem z lewej<\/td><td data-rm-block-id=\"block-110\">Strony kategorii g\u0142\u00f3wnych<\/td><\/tr><tr><td data-rm-block-id=\"block-111\">list_vertical<\/td><td data-rm-block-id=\"block-112\">Pionowe karty w kolumnach<\/td><td data-rm-block-id=\"block-113\">W\u0105skie sekcje<\/td><\/tr><tr><td data-rm-block-id=\"block-114\">list_compact<\/td><td data-rm-block-id=\"block-115\">Kompaktowa lista z ma\u0142ymi obrazkami<\/td><td data-rm-block-id=\"block-116\">Sidebar, stopka<\/td><\/tr><\/tbody><\/table><strong>Style slidera (Slider)<\/strong><ul><li data-rm-block-id=\"block-117\"><span class=\"cc-highlight\">slider_classic<\/span> &#8211; Elegancki slider z nawigacj\u0105 i overlay na hover<\/li><\/ul><div class=\"cc-alert cc-alert-note\"><div class=\"cc-alert-title\" data-rm-block-id=\"block-118\">Notatka<\/div><div class=\"cc-alert-content\" data-rm-block-id=\"block-119\">Ka\u017cdy styl ma w\u0142asne unikalne style CSS i animacje. Style grid obs\u0142uguj\u0105 konfiguracj\u0119 liczby kolumn, podczas gdy slider automatycznie dostosowuje liczb\u0119 widocznych element\u00f3w do szeroko\u015bci ekranu.<\/div><\/div><h6 data-rm-block-id=\"block-120\"><br \/>7. Konfiguracja obraz\u00f3w<\/h6>Modu\u0142 oferuje pe\u0142n\u0105 kontrol\u0119 nad wy\u015bwietlaniem obraz\u00f3w kategorii:<br \/><br \/><strong>Rozmiary kontener\u00f3w<\/strong><table class=\"woocommerce-table shop_table\"><thead><tr><td data-rm-block-id=\"block-121\"><strong>Rozmiar<\/strong><\/td><td data-rm-block-id=\"block-122\"><strong>Wysoko\u015b\u0107<\/strong><\/td><td data-rm-block-id=\"block-123\"><strong>Zalecane dla<\/strong><\/td><\/tr><\/thead><tbody><tr><td data-rm-block-id=\"block-124\">small<\/td><td data-rm-block-id=\"block-125\">150px<\/td><td data-rm-block-id=\"block-126\">Kompaktowe uk\u0142ady<\/td><\/tr><tr><td data-rm-block-id=\"block-127\">medium<\/td><td data-rm-block-id=\"block-128\">250px<\/td><td data-rm-block-id=\"block-129\">Standardowe wy\u015bwietlanie<\/td><\/tr><tr><td data-rm-block-id=\"block-130\">large<\/td><td data-rm-block-id=\"block-131\">350px<\/td><td data-rm-block-id=\"block-132\">Efektowne prezentacje<\/td><\/tr><\/tbody><\/table><strong>Typy obraz\u00f3w<\/strong><br \/>System automatycznie wykrywa dost\u0119pne typy obraz\u00f3w zdefiniowane w PrestaShop dla kategorii:<ul><li data-rm-block-id=\"block-133\"><span class=\"cc-highlight\">category_default<\/span> &#8211; standardowy typ dla kategorii<\/li><\/ul><strong>Fallback obraz\u00f3w<\/strong><br \/>Je\u015bli kategoria nie ma przypisanego obrazu, system automatycznie wy\u015bwietla domy\u015blny obraz zast\u0119pczy <span class=\"cc-highlight\">no-image-category.jpg<\/span>.<h6 data-rm-block-id=\"block-141\"><br \/>8. Wyb\u00f3r kategorii<\/h6>Modu\u0142 oferuje dwa tryby wyboru kategorii do wy\u015bwietlenia:<br \/><br \/><strong>Tryb automatyczny<\/strong><br \/>System automatycznie wybiera kategorie g\u0142\u00f3wne wed\u0142ug ich pozycji:<ul><li data-rm-block-id=\"block-142\">Pomija kategori\u0119 root (ID: 1)<\/li><li data-rm-block-id=\"block-143\">Pomija kategori\u0119 g\u0142\u00f3wn\u0105 sklepu<\/li><li data-rm-block-id=\"block-144\">Sortuje wed\u0142ug pozycji w drzewie kategorii<\/li><li data-rm-block-id=\"block-145\">Wybiera tylko aktywne kategorie<\/li><li data-rm-block-id=\"block-146\">Respektuje ustawiony limit<\/li><\/ul><strong>Tryb r\u0119czny<\/strong><br \/>Administrator mo\u017ce r\u0119cznie wybra\u0107 konkretne kategorie:<ul><li data-rm-block-id=\"block-147\">Lista ID kategorii oddzielonych przecinkami<\/li><li data-rm-block-id=\"block-148\">Przyk\u0142ad: <span class=\"cc-highlight\">2,5,8,12<\/span><\/li><li data-rm-block-id=\"block-149\">System sprawdza czy kategorie istniej\u0105 i s\u0105 aktywne<\/li><li data-rm-block-id=\"block-150\">Porz\u0105dek wy\u015bwietlania wed\u0142ug kolejno\u015bci w li\u015bcie<\/li><li data-rm-block-id=\"block-151\">Automatyczne pomijanie nieistniej\u0105cych kategorii<\/li><\/ul><strong>Walidacja kategorii<\/strong><br \/>Niezale\u017cnie od trybu system sprawdza:<ul><li data-rm-block-id=\"block-152\">Czy kategoria istnieje w bazie danych<\/li><li data-rm-block-id=\"block-153\">Czy kategoria jest aktywna<\/li><li data-rm-block-id=\"block-154\">Czy kategoria ma nazw\u0119 w aktualnym j\u0119zyku<\/li><li data-rm-block-id=\"block-155\">Czy u\u017cytkownik ma uprawnienia do jej wy\u015bwietlenia<\/li><\/ul><div class=\"cc-alert cc-alert-tip\"><div class=\"cc-alert-title\" data-rm-block-id=\"block-156\">Wskaz\u00f3wka<\/div><div class=\"cc-alert-content\" data-rm-block-id=\"block-157\">W trybie r\u0119cznym mo\u017cesz \u0142atwo zmieni\u0107 kolejno\u015b\u0107 kategorii zmieniaj\u0105c ich porz\u0105dek w li\u015bcie ID. System b\u0119dzie respektowa\u0142 dok\u0142adnie t\u0119 kolejno\u015b\u0107.<\/div><\/div><h6 data-rm-block-id=\"block-158\"><br \/>9. Dostosowanie wygl\u0105du<\/h6><strong>Kontrola nad tre\u015bci\u0105<\/strong><table class=\"woocommerce-table shop_table\"><thead><tr><td data-rm-block-id=\"block-159\"><strong>Opcja<\/strong><\/td><td data-rm-block-id=\"block-160\"><strong>Funkcja<\/strong><\/td><td data-rm-block-id=\"block-161\"><strong>Domy\u015blnie<\/strong><\/td><\/tr><\/thead><tbody><tr><td data-rm-block-id=\"block-162\">Poka\u017c nazwy kategorii<\/td><td data-rm-block-id=\"block-163\">Wy\u015bwietlanie tytu\u0142\u00f3w kategorii<\/td><td data-rm-block-id=\"block-164\">W\u0142\u0105czone<\/td><\/tr><tr><td data-rm-block-id=\"block-165\">Poka\u017c opisy kategorii<\/td><td data-rm-block-id=\"block-166\">Wy\u015bwietlanie opis\u00f3w (skr\u00f3cone)<\/td><td data-rm-block-id=\"block-167\">W\u0142\u0105czone<\/td><\/tr><tr><td data-rm-block-id=\"block-168\">Liczba kolumn<\/td><td data-rm-block-id=\"block-169\">Podzia\u0142 siatki (1-6 kolumn)<\/td><td data-rm-block-id=\"block-170\">3<\/td><\/tr><\/tbody><\/table><strong>Responsywne zachowanie<\/strong><br \/>System automatycznie dostosowuje liczb\u0119 kolumn:<ul><li data-rm-block-id=\"block-171\"><strong>Desktop<\/strong> &#8211; pe\u0142na liczba kolumn<\/li><li data-rm-block-id=\"block-172\"><strong>Tablet<\/strong> &#8211; maksymalnie 2-3 kolumny<\/li><li data-rm-block-id=\"block-173\"><strong>Mobile<\/strong> &#8211; zawsze 1 kolumna<\/li><\/ul><strong>Efekty i animacje<\/strong><ul><li data-rm-block-id=\"block-174\">Fade-in podczas \u0142adowania strony<\/li><li data-rm-block-id=\"block-175\">Hover effects na kartach<\/li><li data-rm-block-id=\"block-176\">Smooth transitions<\/li><li data-rm-block-id=\"block-177\">Scroll reveal animations<\/li><li data-rm-block-id=\"block-178\">Loading states dla obraz\u00f3w<\/li><\/ul><strong>Responsywno\u015b\u0107 slidera<\/strong><br \/>Slider automatycznie:<ul><li data-rm-block-id=\"block-179\">Dostosowuje liczb\u0119 widocznych element\u00f3w<\/li><li data-rm-block-id=\"block-180\">Obs\u0142uguje gestyswipe na urz\u0105dzeniach dotykowych<\/li><li data-rm-block-id=\"block-181\">Pokazuje\/ukrywa nawigacj\u0119 w zale\u017cno\u015bci od potrzeb<\/li><li data-rm-block-id=\"block-182\">Zachowuje proporcje na r\u00f3\u017cnych ekranach<\/li><\/ul><h6 data-rm-block-id=\"block-183\"><br \/>10. Responsywno\u015b\u0107<\/h6>Modu\u0142 jest w pe\u0142ni responsywny i automatycznie dostosowuje si\u0119 do r\u00f3\u017cnych rozmiar\u00f3w ekran\u00f3w:<br \/><br \/><strong>Breakpointy<\/strong><table class=\"woocommerce-table shop_table\"><thead><tr><td data-rm-block-id=\"block-184\"><strong>Urz\u0105dzenie<\/strong><\/td><td data-rm-block-id=\"block-185\"><strong>Szeroko\u015b\u0107<\/strong><\/td><td data-rm-block-id=\"block-186\"><strong>Kolumny<\/strong><\/td><td data-rm-block-id=\"block-187\"><strong>Zachowanie<\/strong><\/td><\/tr><\/thead><tbody><tr><td data-rm-block-id=\"block-188\">Desktop<\/td><td data-rm-block-id=\"block-189\">&gt; 768px<\/td><td data-rm-block-id=\"block-190\">Pe\u0142na konfiguracja<\/td><td data-rm-block-id=\"block-191\">Standardowe wy\u015bwietlanie<\/td><\/tr><tr><td data-rm-block-id=\"block-192\">Tablet<\/td><td data-rm-block-id=\"block-193\">481-768px<\/td><td data-rm-block-id=\"block-194\">Maksymalnie 2-3<\/td><td data-rm-block-id=\"block-195\">Uproszony layout<\/td><\/tr><tr><td data-rm-block-id=\"block-196\">Mobile<\/td><td data-rm-block-id=\"block-197\">&lt; 480px<\/td><td data-rm-block-id=\"block-198\">1<\/td><td data-rm-block-id=\"block-199\">Pionowy uk\u0142ad<\/td><\/tr><\/tbody><\/table><strong>Optymalizacje mobilne<\/strong><ul><li data-rm-block-id=\"block-200\">Automatyczne zmniejszenie padding i margin<\/li><li data-rm-block-id=\"block-201\">Responsive typography<\/li><li data-rm-block-id=\"block-202\">Touch-friendly navigation<\/li><li data-rm-block-id=\"block-203\">Zoptymalizowane rozmiary obraz\u00f3w<\/li><li data-rm-block-id=\"block-204\">Uproszczone animacje<\/li><\/ul><strong>Style mobilne dla poszczeg\u00f3lnych tryb\u00f3w<\/strong><ul><li data-rm-block-id=\"block-205\"><strong>Lista pozioma<\/strong> &#8211; przekszta\u0142ca si\u0119 w pionow\u0105<\/li><li data-rm-block-id=\"block-206\"><strong>Lista kompaktowa<\/strong> &#8211; elementy uk\u0142adaj\u0105 si\u0119 jeden pod drugim<\/li><li data-rm-block-id=\"block-207\"><strong>Slider<\/strong> &#8211; zmniejsza szeroko\u015b\u0107 element\u00f3w i odst\u0119py<\/li><\/ul><div class=\"cc-alert cc-alert-note\"><div class=\"cc-alert-title\" data-rm-block-id=\"block-208\">Notatka<\/div><div class=\"cc-alert-content\" data-rm-block-id=\"block-209\">Wszystkie style responsywne s\u0105 wbudowane w modu\u0142 i nie wymagaj\u0105 dodatkowej konfiguracji. System automatycznie wykrywa rozmiar ekranu i stosuje odpowiednie style.<\/div><\/div><h6 data-rm-block-id=\"block-210\"><br \/>11. Rozwi\u0105zywanie problem\u00f3w<\/h6><strong>Kategorie nie wy\u015bwietlaj\u0105 si\u0119 na stronie g\u0142\u00f3wnej<\/strong><ol><li data-rm-block-id=\"block-211\">Sprawd\u017a czy modu\u0142 jest w\u0142\u0105czony w ustawieniach og\u00f3lnych<\/li><li data-rm-block-id=\"block-212\">Upewnij si\u0119, \u017ce licencja jest aktywna<\/li><li data-rm-block-id=\"block-213\">Sprawd\u017a czy wybrane kategorie s\u0105 aktywne w PrestaShop<\/li><li data-rm-block-id=\"block-214\">Wyczy\u015b\u0107 pami\u0119\u0107 podr\u0119czn\u0105 PrestaShop i przegl\u0105darki<\/li><li data-rm-block-id=\"block-215\">Sprawd\u017a czy hook displayHome jest obs\u0142ugiwany przez szablon<\/li><\/ol><strong>Style CSS nie s\u0105 \u0142adowane<\/strong><ol><li data-rm-block-id=\"block-216\">Sprawd\u017a czy plik <span class=\"cc-highlight\">views\/css\/front.css<\/span> istnieje<\/li><li data-rm-block-id=\"block-217\">Upewnij si\u0119, \u017ce jeste\u015b na stronie g\u0142\u00f3wnej (kontroler: IndexController)<\/li><li data-rm-block-id=\"block-218\">Sprawd\u017a czy nie ma konflikt\u00f3w z innymi modu\u0142ami<\/li><li data-rm-block-id=\"block-219\">Wy\u0142\u0105cz Cache CSS w ustawieniach PrestaShop<\/li><li data-rm-block-id=\"block-220\">Sprawd\u017a uprawnienia do odczytu plik\u00f3w modu\u0142u<\/li><\/ol><strong>Slider nie dzia\u0142a poprawnie<\/strong><ol><li data-rm-block-id=\"block-221\">Sprawd\u017a konsol\u0119 przegl\u0105darki na b\u0142\u0119dy JavaScript<\/li><li data-rm-block-id=\"block-222\">Upewnij si\u0119, \u017ce plik <span class=\"cc-highlight\">views\/js\/front.js<\/span> jest \u0142adowany<\/li><li data-rm-block-id=\"block-223\">Sprawd\u017a czy nie ma konflikt\u00f3w z jQuery<\/li><li data-rm-block-id=\"block-224\">Wy\u0142\u0105cz inne modu\u0142y slider na czas test\u00f3w<\/li><li data-rm-block-id=\"block-225\">Sprawd\u017a czy elementy maj\u0105 poprawn\u0105 struktur\u0119 HTML<\/li><\/ol><strong>Obrazy nie s\u0105 wy\u015bwietlane<\/strong><ol><li data-rm-block-id=\"block-226\">Sprawd\u017a czy kategorie maj\u0105 przypisane obrazy<\/li><li data-rm-block-id=\"block-227\">Upewnij si\u0119, \u017ce wybrany typ obrazu istnieje w systemie<\/li><li data-rm-block-id=\"block-228\">Sprawd\u017a uprawnienia do katalogu <span class=\"cc-highlight\">img\/c\/<\/span><\/li><li data-rm-block-id=\"block-229\">Sprawd\u017a czy plik <span class=\"cc-highlight\">no-image-category.jpg<\/span> istnieje<\/li><li data-rm-block-id=\"block-230\">Wyczy\u015b\u0107 pami\u0119\u0107 podr\u0119czn\u0105 obraz\u00f3w<\/li><\/ol><strong>B\u0142\u0119dy licencji<\/strong><ol><li data-rm-block-id=\"block-231\">Sprawd\u017a czy klucz licencyjny jest poprawny<\/li><li data-rm-block-id=\"block-232\">Upewnij si\u0119, \u017ce domena jest zgodna z licencj\u0105<\/li><li data-rm-block-id=\"block-233\">Sprawd\u017a po\u0142\u0105czenie z serwerami COCOS<\/li><li data-rm-block-id=\"block-234\">Wyczy\u015b\u0107 pami\u0119\u0107 podr\u0119czn\u0105 modu\u0142u<\/li><li data-rm-block-id=\"block-235\">Skontaktuj si\u0119 z supportem w przypadku problem\u00f3w z aktywacj\u0105<\/li><\/ol><div class=\"cc-alert cc-alert-error\"><div class=\"cc-alert-title\" data-rm-block-id=\"block-236\">B\u0142\u0105d<\/div><div class=\"cc-alert-content\" data-rm-block-id=\"block-237\">Je\u015bli napotykasz nierozwi\u0105zywalne problemy, upewnij si\u0119 \u017ce u\u017cywasz najnowszej wersji modu\u0142u i PrestaShop. W przypadku ci\u0105glych trudno\u015bci skontaktuj si\u0119 z supportem COCOS poprzez <a href=\"https:\/\/iarina029.supserv.cozmoslabs.com\/wsparcie\/\" title=\"Cocos.codes\/wsparcie\">cocos.codes\/wsparcie<\/a>.<\/div><\/div><h6 data-rm-block-id=\"block-238\"><br \/>12. FAQ<\/h6><strong>Czy mog\u0119 u\u017cywa\u0107 kilku styl\u00f3w jednocze\u015bnie?<\/strong><br \/>Nie, modu\u0142 pozwala na wyb\u00f3r tylko jednego stylu wy\u015bwietlania na raz. Mo\u017cesz jednak \u0142atwo zmieni\u0107 styl w ustawieniach.<br \/><br \/><strong>Jak doda\u0107 w\u0142asny styl wy\u015bwietlania?<\/strong><br \/>Nowe style wymagaj\u0105 modyfikacji plik\u00f3w CSS i PHP. Zalecamy skopiowanie istniej\u0105cego stylu i dostosowanie go do swoich potrzeb.<br \/><br \/><strong>Czy mog\u0119 wy\u015bwietla\u0107 podkategorie?<\/strong><br \/>Obecnie modu\u0142 obs\u0142uguje tylko kategorie g\u0142\u00f3wne. Wy\u015bwietlanie podkategorii wymaga modyfikacji kodu \u017ar\u00f3d\u0142owego.<br \/><br \/><strong>Jak zmieni\u0107 pozycj\u0119 modu\u0142u na stronie?<\/strong><br \/>Modu\u0142 jest automatycznie umieszczony w hooku displayHome na pierwszej pozycji. Mo\u017cesz zmieni\u0107 kolejno\u015b\u0107 w menu Pozycja w panelu modu\u0142\u00f3w.<br \/><br \/><strong>Czy modu\u0142 dzia\u0142a z cache&#8217;owaniem?<\/strong><br \/>Tak, modu\u0142 jest kompatybilny z systemami cache PrestaShop i nie wymaga specjalnej konfiguracji.<br \/><br \/><strong>Jak przet\u0142umaczy\u0107 tytu\u0142 sekcji?<\/strong><br \/>Pole &#8222;Tytu\u0142 sekcji&#8221; obs\u0142uguje wszystkie aktywne j\u0119zyki w sklepie. Prze\u0142\u0105cz j\u0119zyk w panelu administracyjnym i wprowad\u017a t\u0142umaczenie.<br \/><br \/><strong>Czy mog\u0119 ukry\u0107 opisy kategorii dla niekt\u00f3rych styl\u00f3w?<\/strong><br \/>Opcja &#8222;Poka\u017c opisy kategorii&#8221; dzia\u0142a globalnie dla wszystkich styl\u00f3w. Niekt\u00f3re style (jak grid_modern) wy\u015bwietlaj\u0105 opisy w overlay.<br \/><br \/><strong>Dlaczego slider pokazuje strza\u0142ki nawigacji gdy nie s\u0105 potrzebne?<\/strong><br \/>JavaScript automatycznie ukrywa strza\u0142ki gdy wszystkie elementy mieszcz\u0105 si\u0119 w widoku. Sprawd\u017a czy elementy maj\u0105 poprawne wymiary.<br \/><br \/><strong>Jak dzia\u0142a lazy loading obraz\u00f3w?<\/strong><br \/>Obrazy s\u0105 \u0142adowane automatycznie gdy staj\u0105 si\u0119 widoczne w viewport. To oszcz\u0119dza przepustowo\u015b\u0107 i przyspiesza \u0142adowanie strony.<br \/><br \/><strong>Czy mog\u0119 zmieni\u0107 animacje hover?<\/strong><br \/>Animacje s\u0105 zdefiniowane w CSS dla ka\u017cdego stylu. Mo\u017cesz je modyfikowa\u0107 edytuj\u0105c plik <span class=\"cc-highlight\">front.css<\/span>.<br \/><br \/><strong>Dlaczego niekt\u00f3re kategorie nie s\u0105 wy\u015bwietlane?<\/strong><br \/>System pomija nieaktywne kategorie, kategorie bez nazwy oraz te do kt\u00f3rych u\u017cytkownik nie ma uprawnie\u0144.<br \/><br \/><strong>Jak zmieni\u0107 domy\u015blny obraz kategorii?<\/strong><br \/>Zast\u0105p plik <span class=\"cc-highlight\">views\/img\/no-image-category.jpg<\/span> w\u0142asnym obrazem o tych samych wymiarach.<br \/><br \/><strong>Czy modu\u0142 obs\u0142uguje RTL (right-to-left)?<\/strong><br \/>Modu\u0142 u\u017cywa standardowych klas Bootstrap kt\u00f3re obs\u0142uguj\u0105 RTL. Mo\u017ce by\u0107 potrzebne dostosowanie niekt\u00f3rych styl\u00f3w.<br \/><br \/><strong>Jak wy\u0142\u0105czy\u0107 animacje?<\/strong><br \/>Mo\u017cesz usun\u0105\u0107 lub zakomentowa\u0107 animacje CSS w pliku <span class=\"cc-highlight\">front.css<\/span> lub doda\u0107 <span class=\"cc-highlight\">animation: none;<\/span> do odpowiednich selektor\u00f3w.<br \/><br \/><strong>Czy mog\u0119 zmieni\u0107 liczebowo\u015b\u0107 opis\u00f3w kategorii?<\/strong><br \/>Opisy s\u0105 automatycznie skracane do 80-120 znak\u00f3w w zale\u017cno\u015bci od stylu. Mo\u017cesz zmieni\u0107 to w pliku template <span class=\"cc-highlight\">home_categories.tpl<\/span>.<br \/><br \/><strong>Dlaczego modu\u0142 nie dzia\u0142a po aktualizacji PrestaShop?<\/strong><br \/>Sprawd\u017a kompatybilno\u015b\u0107 wersji w pliku modu\u0142u. Mo\u017cliwe \u017ce potrzebna jest aktualizacja modu\u0142u do najnowszej wersji.<br \/><br \/><strong>Jak zoptymalizowa\u0107 wydajno\u015b\u0107 dla du\u017cej liczby kategorii?<\/strong><br \/>U\u017cyj trybu r\u0119cznego wyboru kategorii i ogranicz liczb\u0119 do maksymalnie 12 element\u00f3w. W\u0142\u0105cz lazy loading i cache obraz\u00f3w.<br \/><br \/><strong>Czy mog\u0119 u\u017cywa\u0107 modu\u0142u na stronach kategorii?<\/strong><br \/>Modu\u0142 jest przeznaczony dla strony g\u0142\u00f3wnej. Umieszczenie na innych stronach wymaga modyfikacji hookew w kodzie \u017ar\u00f3d\u0142owym.<br \/><br \/><strong>Jak sprawdzi\u0107 kt\u00f3re hooki s\u0105 dost\u0119pne w moim szablonie?<\/strong><br \/>U\u017cyj modu\u0142u &#8222;Hook displayer&#8221; lub sprawd\u017a pliki template w katalogu szablonu. Nie wszystkie szablony obs\u0142uguj\u0105 wszystkie hooki.<br \/><br \/><strong>Dlaczego style dark mode nie wy\u015bwietlaj\u0105 si\u0119 poprawnie?<\/strong><br \/>Style dark wymagaj\u0105 specjalnego wrappera. Sprawd\u017a czy szablon nie nadpisuje kolor\u00f3w t\u0142a i czy nie ma konflikt\u00f3w z innymi stylami.<br \/><br \/><strong>Jak eksportowa\u0107 konfiguracj\u0119 modu\u0142u?<\/strong><br \/>Konfiguracja jest przechowywana w tabeli <span class=\"cc-highlight\">ps_configuration<\/span> z prefiksem <span class=\"cc-highlight\">CC_PS_HC_<\/span>. Mo\u017cesz wyeksportowa\u0107 te rekordy przez phpMyAdmin.<br \/><br \/><div class=\"cc-alert cc-alert-success\"><div class=\"cc-alert-title\" data-rm-block-id=\"block-239\">Sukces<\/div><div class=\"cc-alert-content\" data-rm-block-id=\"block-240\">Modu\u0142 CC PrestaShop Kategorie G\u0142\u00f3wna to profesjonalne narz\u0119dzie do eleganciego prezentowania kategorii w sklepach internetowych. Dzi\u0119ki szerokim mo\u017cliwo\u015bciom stylizacji i konfiguracji pozwala stworzy\u0107 unikalne do\u015bwiadczenie dla klient\u00f3w i zwi\u0119kszy\u0107 konwersj\u0119 sklepu.<\/div><\/div>Je\u015bli prowadzisz sklep na PrestaShop i chcesz poprawi\u0107 prezentacj\u0119 kategorii na stronie g\u0142\u00f3wnej, zalecamy skorzystanie z <a href=\"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/produkt\/kategorie-na-stronie-glownej\/\" title=\"Modu\u0142u CC PrestaShop Kategorie Na Stronie G\u0142\u00f3wnej\">modu\u0142u CC PrestaShop Kategorie Na Stronie G\u0142\u00f3wnej<\/a>, kt\u00f3ry zapewni profesjonalny wygl\u0105d i pe\u0142n\u0105 kontrol\u0119 nad sposobem wy\u015bwietlania kategorii produkt\u00f3w.","protected":false},"excerpt":{"rendered":"Dokumentacja Presta Shop Kategorie Na Stronie G\u0142\u00f3wnej Kompleksowa dokumentacja dla modu\u0142u wy\u015bwietlania kategorii na stronie g\u0142\u00f3wnej Presta Shop (cc_ps_home_categories) z zaawansowanymi opcjami stylizacji, wieloma trybami wy\u015bwietlania i pe\u0142n\u0105 kontrol\u0105 nad","protected":false},"author":1,"featured_media":5034,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"powered_cache_disable_cache":false,"powered_cache_disable_css_optimization":false,"powered_cache_disable_js_optimization":false,"footnotes":""},"categories":[236],"tags":[197,283,250,143],"class_list":["post-5030","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dokumentacje-prestashop","tag-dokumentacja","tag-kategorie-na-stronie-glownej","tag-modul","tag-prestashop"],"_links":{"self":[{"href":"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/wp-json\/wp\/v2\/posts\/5030","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/wp-json\/wp\/v2\/comments?post=5030"}],"version-history":[{"count":0,"href":"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/wp-json\/wp\/v2\/posts\/5030\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/wp-json\/wp\/v2\/media\/5034"}],"wp:attachment":[{"href":"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/wp-json\/wp\/v2\/media?parent=5030"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/wp-json\/wp\/v2\/categories?post=5030"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/iarina029.supserv.cozmoslabs.com\/pl\/wp-json\/wp\/v2\/tags?post=5030"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}