Skocz do zawartości

Centrum IP.Board

Zaloguj się, aby obserwować  
  • wpisy
    44
  • komentarzy
    0
  • wyświetleń
    56491

IP.Board 4 - Wprowadzenie do nowego panelu administratora

Co prawda nie zostanie tutaj pokazana pełna funkcjonalność ACP w IP.Board 4, ale zostaną przedstawione pewne rzeczy.

Informacje ogólne

IP.Board 4 przynosi ze sobą nowy framework CSS, który ma na celu modularyzację stylów. Jest to coś, nad czym zaczęto prace jeszcze w IP.Board 3.2, ale w tamtym czasie nie mogło to rozwiązanie zastąpić całkowicie struktury. Nie ma już jednego głównego pliku ipb_styles.css. Od teraz będzie kilka mniejszych plików, a każdy z nich będzie odpowiadał za coś innego. Jest jeden plik odpowiedzialny za tabele, inny dla formularzy, inny dla przycisków itp.

Daje to kilka kluczowych korzyści. Po pierwsze, kiedy musimy poprawić błąd, powiedzmy, w postaci pliku CSS, IP.Board 4 nadal będzie w stanie automatycznie zaktualizować wszystkie inne pliki CSS dla Ciebie. W wersji 3.x jeden błąd w ipb_styles.css mógł oznaczać, że cały plik musiał być ręcznie aktualizowany. Po drugie, będzie o wiele bardziej oczywiste dla twórców szablonów gdzie szukać konkretnych rzeczy. Potrzebujesz do stylu przycisku? Znajdziesz go w buttons.css. Łatwe. I po trzecie, jeśli budujemy strony w IP.Content, a chcesz korzystać z stylów przycisków z IP.Board, możesz po prostu włączyć ten jeden plik CSS bez dołączania całego frameworka.

CSS jest oczywiście łączony i kompresowany przed dostarczeniem do przeglądarki, ale w środowisku programistycznym jest tak jak opisałem to powyżej.

W IP.Board 4 zarówno frontend jak i panel administratora, dzielą te same frameworki CSS oraz JavaScript. Dzięki temu twórcy skinów będą mogli tworzyć szablony, które działają zarówno w ACP jak i dla użytkownika. Oczywiście robiąc poprawkę poprawiane będą oba obszary.

Nim przejdziemy dalej pragnę wyjaśnić, że pomimo powyższego frontend i ACP mają różne wyglądy. Dzieje się to za sprawą tego, że w framework używany w ACP rozszerza pewne części stylów w zależności od potrzeb.

Cele

Co chcemy osiągnąć w ACP? Obecne ACP jest często uważane za najlepiej wyglądające z dużych platform forumowych, więc przeprojektowanie tego to duże przedsięwzięcie.

  • Lepsze użytkowanie miejsca. Obecnie ACP wykorzystuje pionową przestrzeń do głównego menu i poziomą przestrzeń do menu aplikacji. W erze monitorów panoramicznych może to być lepiej wykorzystane.
  • Pozbycie się rozwijalnych menu. Obecne menu jest trudne do wykorzystania zwłaszcza, jeśli chcemy przeglądać dodatkowe aplikacje. Musimy wtedy przebrnąć przez menu innych aplikacji.
  • Większa spójność strony. Obecna wersja ACP posiada interaktywne tabele (np. lista użytkowników), ale nie każda tabela wykorzystuje tę funkcjonalność. Jeśli ma to tylko sens to każda strona powinna oferować podobną funkcjonalność.
  • Lepsza stylizacja. Ludzie nie są fanami różowego jak się okazuje. W związku z tym trzeba będzie iść w inne kolory np. gradienty niebieskiego.
  • I coś dużego: lepsze wsparcie dla urządzeń mobilnych. Do tej pory korzystanie z ACP na urządzeniach mobilnych było prawie niemożliwe. Nadszedł czas, żeby można było w pełni zarządzać społecznością także na urządzeniach mobilnych.

Resposywność

Panel administratora w IP.Board 4 jest w pełni responsywny, dzięki czemu pozwala zrobić w nim wszystko zarówno na telefonie jak i na tablecie.

Podgląd

Poniżej przedstawione są screeny z wyglądu panelu administratora, zarówno na komputerze stacjonarnym jak i na telefonie.

blogentry-1094-0-20085200-1375651560.png

blogentry-1094-0-46026500-1375652991.png

Nawigacja

Po pierwsze, i chyba najważniejsze, jest nawigacja. Na komputerach Twoje aplikacje umieszczone są na dole po lewej stronie. Menu można aranżować, a każdy użytkownik z dostępem do panelu administratora może je przereorganizować według własnych potrzeb.

W urządzeniach mobilnych nie ma miejsca oczywiście na duże menu, dlatego jest ono aktywne dopiero po kliknięciu w ikonę w prawym górnym rogu.

blogentry-1094-0-85526600-1375654840.png

Tabelki

Na screenach widać nowy system wyświetlania danych w tabelkach. W widoku mamy filtry na górze, pole wyszukiwania i zaawansowane (popup), a nagłówki tabeli można kliknąć, aby dynamicznie sortować dane za pośrednictwem ajax.

Formularze

blogentry-1094-0-38359700-1375666776.png

blogentry-1094-0-01948000-1375666284.png

Zakładki

Zakładki są szeroko stosowane, w miarę potrzeby. Oto zrzuty ekranu pokazujące typową stronę:

blogentry-1094-0-26958500-1375667467.png

blogentry-1094-0-24753400-1375667677.png

Wideo z wersji mobilnej

Poniżej przedstawiam krótki film wideo pokazujący jak działa panel administratora na urządzeniu mobilnym. Film znajdziecie pod adresem http://community.invisionpower.com/blogvideos/responsive-acp.swf



0 komentarzy


Rekomendowane komentarze

Brak komentarzy do wyświetlenia.

Bądź aktywny! Zaloguj się lub utwórz konto

Tylko zarejestrowani użytkownicy mogą komentować zawartość tej strony

×

Ważne informacje

Kontynuując przeglądanie strony, wyrażasz zgodę na używanie przez nas plików cookies.