WordPress / WooCommerce - przygotowanie szablonu strony produktu dla klimatyzatorów

WordPress / WooCommerce - przygotowanie szablonu strony produktu dla klimatyzatorów

Szukam kogoś, kto pomoże mi przygotować stały, wielokrotnego użytku szablon strony produktu w WooCommerce.

Prowadzę firmę, która instaluje systemy klimatyzacyjne. Na mojej stronie internetowej mam produkty takie jak klimatyzatory typu split. Chcę, aby strony produktów wyglądały bardziej profesjonalnie i były nastawione na sprzedaż, a nie jak standardowy opis w stylu katalogu WooCommerce.

Przykładowy produkt, nad którym ostatnio pracowałem:

https://strefaklimy.pl/produkt/gree-airy-champagne-27-kw/

Po kilku godzinach udało mi się stworzyć bardziej atrakcyjny opis dla tego klimatyzatora, ale robienie tego ręcznie dla każdego produktu zajmuje zbyt dużo czasu. Chcę zacząć przygotowywać treści dla kolejnych modeli, ale potrzebuję stałego szablonu, aby nie musieć budować wszystkiego od podstaw.

Cel projektu

Chcę, aby stałe sekcje na stronach produktów były przygotowane raz jako szablon, aby dla przyszłych produktów wystarczyło tylko wymienić tekst, parametry, nazwę modelu, wideo, FAQ i inne dane.

Chcę, aby sekcje na każdej stronie produktu wyglądały wizualnie identycznie:

• ten sam układ
• ta sama przestrzeń
• te same kolory
• ten sam typ kafelków/karteczek
• spójne przyciski
• ta sama szerokość opisu
• odpowiedni wygląd na komputerach stacjonarnych i urządzeniach mobilnych

Treść dla każdego klimatyzatora będzie inna i przygotuję ją sam. Potrzebuję, aby wykonawca zajął się techniczną i wizualną stroną szablonu.

Sekcje, które chciałbym mieć jako stały układ

Strona produktu powinna zawierać następujące sekcje:

• krótki wstęp do produktu
• pasek CTA z numerem telefonu
• kafelki/karteczki z głównymi korzyściami, na przykład: „Dlaczego warto wybrać Gree Airy Champagne - 5 głównych korzyści”
• sekcja „Do jakich pomieszczeń?”
• sekcja „Kluczowe parametry w skrócie” - mile widziana, ale nie absolutnie wymagana
• sekcja „Co wyróżnia tę serię/model?”
• miejsce na wideo z YouTube, galerię zdjęć lub oba
• sekcja „Montaż klimatyzacji z StrefaKlimy.pl”
• pole zachęcające użytkowników do obejrzenia galerii zdjęć naszych zrealizowanych projektów
• FAQ - „Najczęściej zadawane pytania”
• końcowe CTA

Sekcja instalacji

W sekcji instalacji chciałbym stały układ 6 kafelków/karteczek:

1. Lokalizacja jednostki wewnętrznej

2. Trasa instalacji

3. Odprowadzanie skroplin

4. Jednostka zewnętrzna

5. Zasilanie i ochrona

6. Estetyka wykończenia

Na komputerach stacjonarnych najlepszy układ to 3 x 2.
Na urządzeniach mobilnych kafelki powinny układać się jeden pod drugim.

Problemy techniczne do rozwiązania

1. Szerokość opisu produktu i centrowanie

Obecnie opis produktu jest dość wąski i pozostawia dużo pustego miejsca po prawej stronie.

Chciałbym, aby był wyświetlany podobnie do strony Aero7:

https://aero7.pl/klimatyzator/gree-airy-champagne

To oznacza, że cały opis powinien być wyśrodkowany, z podobną ilością białej przestrzeni po lewej i prawej stronie. Strona produktu powinna wyglądać spokojnie, profesjonalnie i nie powinna sprawiać wrażenia, że treść „ucieka” na jedną stronę.

2. Wideo z YouTube w opisie produktu

Wideo z YouTube nie wyświetla się poprawnie w opisie produktu. Dla testowego klimatyzatora to jest wideo:

https://www.youtube.com/watch?v=fhULgSsc1uE

Trzeba sprawdzić, jak najlepiej osadzić wideo w obecnym motywie i WooCommerce, aby działało poprawnie na komputerach stacjonarnych i urządzeniach mobilnych. Może to być iframe, oEmbed, shortcode, blok WordPressa lub inne bezpieczne rozwiązanie.

3. Kolor tekstu CTA

W niektórych polach CTA część tekstu ma kolor podobny do tła, co sprawia, że jest nieczytelna. To musi być uporządkowane w szablonie, aby tekst w przyciskach i ciemnych polach był zawsze czytelny.

4. Rozmiar czcionki i spójność

Rozmiary czcionek w szablonie również muszą być zdefiniowane, aby były spójne z całą stroną internetową. Opisy produktów nie powinny wyglądać jak oddzielny, losowo wklejony moduł.

Chodzi o to, aby nagłówki, akapity, listy, kafelki/karteczki, FAQ i CTA używały czcionek zgodnych z aktualnym stylem strony internetowej. Tekst musi być czytelny, ale nie za duży i nie za mały. Dopasowanie rozmiarów czcionek na komputerach stacjonarnych i urządzeniach mobilnych jest szczególnie ważne.

Kolory strony internetowej

Proszę zachować aktualną paletę kolorów:

• granatowy #23355D
• jasnoniebieski #E6ECFD
• niebieski #6CA9E0
• zielony #71A200
• pomarańczowy #FDB033
• czerwony CTA #CA232A
• szary #727272 lub #808080

Czego oczekuję od wykonawcy

Szukam kogoś, kto naprawdę potrafi pracować z WordPress, WooCommerce i CSS. Nie chodzi o ręczne wklejanie jednorazowego opisu, ale o przygotowanie rozwiązania wielokrotnego użytku.

Wykonawca powinien:

• sprawdzić aktualny motyw i układ WooCommerce
• zaproponować najlepszy sposób wdrożenia szablonu
• poprawić szerokość i centrowanie opisu produktu
• przygotować wielokrotnego użytku układ sekcji
• rozwiązać problem z wideo z YouTube
• zadbać o wygląd na komputerach stacjonarnych i urządzeniach mobilnych
• nie psuć innych produktów ani układu strony
• krótko opisać, jak wymieniać treści dla przyszłych produktów

Czego nie szukam

Nie szukam kogoś, kto:

• tylko wklei HTML do jednego produktu
• zrobi wszystko ręcznie dla każdego produktu
• nie zna WooCommerce
• nie sprawdzi wersji mobilnej
• pracuje z podejściem „spróbuję, może zadziała”

Potrzebuję kogoś, kto rozumie WordPress, WooCommerce, CSS i potrafi przygotować sensowny szablon strony produktu.

Proszę o uwzględnienie w odpowiedzi

1. Jak technicznie podszedłbyś do przygotowania takiego szablonu?

2. Jak rozwiązałbyś problem wąskiego opisu i pustej przestrzeni po prawej stronie?

3. Czy zrobiłbyś to za pomocą CSS, modyfikacji szablonu WooCommerce, shortcode, bloków Gutenberga, ACF, Elementora czy inną metodą?

4. Ile czasu potrzebujesz na dopracowanie całego projektu?

5. Jaka byłaby cena?

6. Czy możesz pokazać 2-3 podobne projekty, najlepiej WooCommerce lub strony produktów?

Zależy mi na konkretnej odpowiedzi, a nie ogólnym „zrobię to profesjonalnie”. Chcę wiedzieć, jak technicznie podszedłbyś do tematu i czy jesteś w stanie przygotować rozwiązanie, które później można będzie wykorzystać dla przyszłych produktów.