Skocz do zawartości

Centrum IP.Board

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

IP.Board 4 - Responsywny szablon Front-Endu

Wpis ten przedstawia na przykładach pokrótce responsywny szablon w IP.Board 4.

Co to jest responsywność?

Zanim zacznę opisywać wygląd w IP.Board 4 pozwólcie, że napiszę co to jest responsywność. Responsywny design jest metodą na to, aby wygląd Twojej strony dopasowywał się do ekranu jaki posiada użytkownik. Oznacza to, że jeden motyw obsługuje wygląd zarówno dla komputerów jak i użytkowników telefonów komórkowych.

Kiedy programiści podjęli decyzję o responsywności w IP.Board 4, ich celem było zapewnienie, że użytkownicy urządzeń mobilnych nie stracą na funkcjonalności.

Główna nawigacja

W widoku mobilnym główna nawigacja się zwija i przenosi się do menu dostępnego pod ikoną w prawym górnym rogu. Breadcrumb zamienia się w przycisk "Wstecz", który przenosi nas poziom wyżej niż aktualnie jesteśmy:

blogentry-1094-0-20284000-1399958656.png

Po otworzeniu głównej nawigacji wygląda ona tak:

blogentry-1094-0-05773200-1399958784.png

Moderowanie

Biorąc pod uwagę fakt, że responsywny szablon obsługuje wszystkie funkcjonalności, obejmuje to także moderowanie. IP.Board 4 obsługuje wszystkie możliwości moderacyjne niezależnie od urządzenia, którego używasz. Poniżej prezentuję przykład moderowania zdjęć w galerii. Zwróć uwagę na menu, które pozwala szybko wybrać typ zawartości do moderowania, a także pływający pasek na dole ekranu pozwalający wybrać akcję, która ma być wykonana.

blogentry-1094-0-42646500-1400170361.jpg

Strona ustawień

Pisząc o ustawieniach jako przykładzie, poniżej prezentuję screeny z trzech urządzeń: komputer, tablet i telefon.

blogentry-1094-0-14365000-1399959399.png

blogentry-1094-0-42293400-1399959400.png

blogentry-1094-0-83500100-1399959399.png

Widok profilu

Poniżej przedstawiam wygląd profilu (który był szerzej omawiany we wpisie IP.Board 4 — Profile) na telefonie.

blogentry-1094-0-03610200-1399959745.png

Kalendarz

Wygląd kalendarza na telefonie:

blogentry-1094-0-27176700-1399960132.png

blogentry-1094-0-87550000-1399960132.png

Galeria

Wygląd albumów i obrazków w kategorii.

blogentry-1094-0-11651400-1399960390.png

Blog

Strona główna blogów:

blogentry-1094-0-55144600-1399960646.png

I widok blogu:

blogentry-1094-0-47848800-1399960890.png

Fora

Dodawanie tematów na telefonie:

blogentry-1094-0-37977500-1399961255.png



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.