Panel kursanta w nowej odsłonie i we własnych kolorach

Panel kursanta to miejsce, w którym Twoi klienci spędzają najwięcej czasu. Tu wracają po pracy do kolejnej lekcji, tu zaglądają do społeczności i tu widzą Twoją markę częściej niż na jakiejkolwiek stronie sprzedażowej. Dlatego odświeżyliśmy wygląd panelu kursanta i daliśmy Ci możliwość dopasowania go do siebie. Nawigacja przeszła do menu bocznego, kursant może zapisywać ulubione szkolenia i lekcje, a Ty ustawiasz kolor akcentów, własny CSS i układ produktów.

Co się zmieniło

Zmiana jest wizualna. Kursanci mają dostęp do tych samych szkoleń, materiałów i ustawień co wcześniej, tylko ułożonych w nowy sposób.

• Menu boczne po lewej. Na górze „Produkty”, „Społeczność”, „Biblioteka”, „Blog” i „Poziomy i nagrody”. Niżej sekcja „Produkty” z pozycjami „Ostatnie”, „Wszystkie Produkty”, „Egzaminy i certyfikaty” i „Notatki”, a na końcu „Pozostałe” z „Ustawieniami” i „Więcej informacji”.
• Nowy górny pasek. Pośrodku najważniejsze miejsca, po prawej lupa wyszukiwarki, dzwonek z powiadomieniami i zdjęcie profilowe.
• Skróty pod jedną ikoną. Ikona z czterema kwadracikami otwiera okienko z kafelkami: „Mój profil”, „Rozliczenia”, „Powiadomienia”, „Bezpieczeństwo”, „Produkty”, „Społeczność”, „Ustawienia” i „Blog”.
• Kafelki zachęcające na stronie głównej: najnowszy post, najnowsze szkolenie, grywalizacja i najbliższe wydarzenie, każdy z przyciskiem, który prowadzi prosto na miejsce.
• Zaokrąglone miniaturki i sekcje, równe odstępy i dopracowane okienka.

Na telefonie

Na małym ekranie menu boczne chowa się pod ikoną z trzema kreskami w lewym górnym rogu. Kursant dotyka jej i dostaje te same pozycje co na komputerze, a treść strony zostaje pod spodem. Kafelki i miniaturki układają się w jedną kolumnę, więc lekcję da się spokojnie obejrzeć w tramwaju.

Ulubione szkolenia i lekcje

Na każdej miniaturce szkolenia i lekcji jest serduszko w prawym górnym rogu. Kursant klika je, serduszko robi się czerwone, a na stronie głównej pojawia się sekcja „Ulubione szkolenia” albo „Ulubione lekcje” z licznikiem „Ilość”. Ponowne kliknięcie zdejmuje oznaczenie.

Prowadzisz kurs gotowania dla zabieganych rodziców. Kasia przerobiła już dwadzieścia lekcji, ale co tydzień wraca do trzech: planu zakupów na siedem dni, szybkiego sosu do makaronu i obiadu z jednego garnka. Oznacza je serduszkiem i w niedzielę wieczorem ma je na samej górze strony głównej, zamiast szukać ich w trzech różnych modułach.

Na stronie szkolenia kursant przełącza też widok ikonami obok pola wyszukiwania: kafelki albo lista, w której obok miniaturki stoi nazwa lekcji i termin dostępu.

W lekcji po prawej stronie jest „Lista lekcji” i „Notatki”, nad treścią ocena gwiazdkami i przycisk „Dalej”. Przycisk „Zwęź” zmienia widok szeroki na węższy, a „Rozszerz” przywraca szeroki.

Jak ustawić własne kolory i CSS

Kolory panelu kursanta ustawiasz w jednym miejscu.

1. W menu panelu administratora rozwiń „Konfiguracja Platformy” i wybierz „Własny Wygląd”.
2. Zjedź do sekcji „Ustawienia nowego panelu”. Masz tam dwa pola: „Kolor tła” i „Kolor akcentów”, a pod nimi edytor „Własny styl CSS dla nowego panelu”.

3. Kliknij kwadracik z kolorem przy „Kolor akcentów”. Otworzy się paleta: wybierz odcień myszką albo wpisz kod HEX z identyfikacji swojej marki (np. #7b2d8e) i kliknij „choose”.

4. Tak samo ustaw „Kolor tła”, jeśli chcesz go zmienić.
5. Jeśli znasz CSS, wklej własne style w edytor między znacznikami „<style>” i „</style>”. Styl działa globalnie w całym nowym panelu kursanta. Na przykład jedna linijka „.product-thumbnail { border-radius: 4px !important; }” daje miniaturkom szkoleń ostrzejsze rogi.
6. Zjedź na sam dół strony i kliknij niebieski przycisk „Zapisz”.

Gotowe. Kursanci widzą nowy kolor po odświeżeniu strony: mają go przyciski „Dalej” i „Lista lekcji”, ikony przy nazwach kategorii i pasek przy otwartej lekcji na liście. Bez własnego koloru akcenty są niebieskie.

Ważne: pole CSS jest opisane w panelu jako „Opcja dla zaawansowanych administratorów”. Błąd w stylach widzą od razu wszyscy kursanci, więc po zapisie zajrzyj do panelu kursanta i sprawdź, czy wszystko wygląda tak, jak chcesz.

Jak ustawić układ panelu

To, co kursant widzi po zalogowaniu i jak wyświetlają się produkty, wybierasz w „Konfiguracja Platformy”, w pozycji „Ogólne Ustawienia”, w części „Nowy panel”. Każde pole ma ikonkę „i” z krótką podpowiedzią.

• „Domyślny ekran główny”: „Produkty” albo „Społeczność”. Przy społeczności upewnij się, że jest włączona.
• Jak produkty wyświetlają się pod przyciskiem z menu bocznego i z menu górnego, osobno dla każdego: „Lista wszystkich produktów”, „Lista kategorii z karuzelą” albo „Lista kategorii z siatką”. Przy siatce strona „Produkty” dalej grupuje szkolenia według kategorii, ale układa je w rzędy, bez strzałek przewijanej karuzeli.
• „Domyślny widok lekcji”: „Standardowy” albo „Szeroki”.
• „Domyślny układ wyświetlania produktów”: „Kafelki” albo „Lista”, czyli to, co kursant widzi po wejściu w szkolenie, zanim sam przełączy widok.
• „Szybka ścieżka dostępu do lekcji”: przy widoku szerokim kliknięcie prowadzi do pierwszej nieukończonej lekcji.
• Liczba komentarzy na miniaturce szkoleń i lekcji (dymek z liczbą w lewym dolnym rogu obrazka), ukrywanie odpowiedzi na komentarze w lekcji i w społeczności oraz oceny lekcji od 1 do 5 gwiazdek.
• Kafelki zachęcające na stronie głównej, baner z reklamą aplikacji mobilnej i mini-baner polecający Web To Learn na dole lewego menu, każdy z wyborem „Tak” albo „Nie”.

Zmiany zapisujesz przyciskiem „Zapisz” na dole strony.

Dobrze wiedzieć

• Kolory z sekcji „Ustawienia starego panelu” dotyczą wyłącznie starego panelu. Nowy panel bierze kolory z sekcji „Ustawienia nowego panelu”.
• Logo, favikona i domyślne miniaturki są w „Ustawieniach ogólnych” na górze tej samej strony i działają w obu panelach.
• Kolory maili systemowych i aplikacji mobilnej ustawiasz niżej na stronie „Własny Wygląd”, w osobnych sekcjach.

Czy musisz coś zrobić?

Nie. Nowy wygląd działa od razu, a kolory i układ zmieniasz tylko wtedy, gdy chcesz.

Instrukcja krok po kroku

Chcesz zobaczyć to w akcji? Przeklikaj krótką instrukcję poniżej. Pokazuje ustawienie koloru akcentów i układu produktów w panelu administratora.

Zacznij od jednej rzeczy: wpisz kolor swojej marki w „Kolor akcentów”, zapisz i zajrzyj do panelu kursanta.