Dostosowywanie mobilnej wersji strony internetowej
Jak dodatkowo skonfigurować wyświetlanie strony na różnych urządzeniach
Tilda automatycznie dostosowuje strony internetowe do różnych urządzeń: smartfonów, tabletów, laptopów i komputerów stacjonarnych. W razie potrzeby możesz elastycznie skonfigurować mobilną wersję standardowych bloków lub stworzyć własną responsywną wersję strony internetowej, korzystając z Zero Block.

Zapoznaj się z tym szczegółowym przewodnikiem, aby dowiedzieć się, jak skonfigurować mobilną wersję strony internetowej pod adresem Tilda.
Więcej
Więcej
Więcej
Więcej
Więcej
Więcej
Więcej
Tryb edycji w wersji mobilnej
Po dodaniu i skonfigurowaniu standardowych bloków możesz dodatkowo edytować ich wersję mobilną. W tym celu kliknij ikonę urządzenia mobilnego znajdującą się pośrodku panelu edytora strony.

Z menu rozwijanego wybierz żądany rozmiar ekranu. Jeśli chcesz sprawdzić, jak strona wygląda na konkretnym urządzeniu, wybierz je lub najbliższą opcję w sekcji „Urządzenia”.
Edytor przełączy się w tryb mobilny, co ułatwi edycję bloków.
Ważne: Przełączenie widoku bloków w edytorze nie stanowi pełnego podglądu projektowanej strony internetowej. W tym trybie animacje nie działają, a niektóre bloki mogą wyświetlać się inaczej niż na opublikowanej stronie. Aby zobaczyć, jak strona będzie wyglądać po opublikowaniu, kliknij „Podgląd”.
Tryb podglądu
W trybie podglądu kliknij ikonę urządzenia mobilnego i wybierz żądany rozmiar ekranu.
Ważne: W trybie podglądu nie można edytować ustawień bloku. Służy on wyłącznie do sprawdzenia, jak strona się wyświetla.
Aby ukryć interfejs edytora, kliknij ikonę strzałek w lewym dolnym rogu lub obok opcji „Powrót do edycji”.
Aby zmienić skalę podglądu, kliknij ikonę 100% i wybierz żądaną wartość z menu rozwijanego.
Kliknij ikonę ołówka, aby powrócić do edytora i wprowadzić zmiany w blokach.
Edytowanie ustawień bloku w wersji mobilnej
Każdy blok posiada osobne ustawienia odstępów i typografii dla wersji mobilnej. W zależności od bloku mogą być również dostępne dodatkowe ustawienia dla poszczególnych elementów na urządzeniach mobilnych. Ustawienia te są zazwyczaj oznaczone wskazówkami w panelu ustawień.

Na przykład blok menu może posiadać osobną zakładkę z ustawieniami przeznaczoną właśnie do tego celu.
W blokach okładkowych ustawienia wersji mobilnej mogą być oznaczone ikoną telefonu.
Aby otworzyć osobne ustawienia dla urządzenia mobilnego, kliknij ikonę pulpitu obok odpowiedniego pola. Pojawi się dodatkowe pole z ikoną smartfona.
Zmiana rozmiaru czcionki i odstępów między wierszami dla urządzeń mobilnych. W ustawieniach bloku otwórz sekcję „Typografia”, kliknij ikonę komputera stacjonarnego, a następnie wprowadź rozmiar czcionki dla wersji mobilnej w polu oznaczonym ikoną urządzenia mobilnego.

Odstępy między wierszami konfiguruje się w ten sam sposób.
Zmiana promienia zaokrąglenia narożników i odstępów dla okładek na urządzeniach mobilnych. W blokach z kategorii „Okładka” i „Ob raz ” można ustawić oddzielną wartość promienia zaokrąglenia narożników lub odstępów dla urządzeń mobilnych.

Aby zmienić promień lub odstępy, kliknij „Ustawienia” i znajdź odpowiednie pole. Następnie kliknij ikonę komputera obok tego pola i wprowadź wartość dla wersji mobilnej.
Zmiana położenia obrazu tła. W blokach okładkowych i innych blokach, w których dostępne jest to ustawienie, można wybrać część obrazu, która będzie wyświetlana w bloku.

Aby ustawić automatyczne pozycjonowanie, wybierz odpowiednią wartość z menu rozwijanego, na przykład „Wyśrodkuj”.
Aby ręcznie ustawić pozycję, kliknij ikonę obok pola.
Otworzy się obraz z punktami pozycjonującymi. Możesz wybrać jeden z gotowych punktów lub umieścić własny punkt w wybranym miejscu.
Funkcja pozycjonowania pozwala dostosować sposób wyświetlania obrazu tła w wersji mobilnej, dzięki czemu ten sam obraz wygląda dobrze na różnych ekranach.
Konfiguracja wypełnienia dla urządzeń mobilnych
W dowolnym bloku otwórz ustawienia, kliknij ikonę obok pól „Odstęp u góry” lub „Odstęp u dołu” i wprowadź wartość odpowiednią dla urządzenia mobilnego.
Zakres widoczności na różnych urządzeniach
Jeśli chcesz, aby różne bloki wyświetlały się na smartfonach i komputerach stacjonarnych, skonfiguruj zakres widoczności.

Otwórz ustawienia bloku i przewiń w dół do opcji „Widoczność bloku na urządzeniach”. Określ, na których urządzeniach blok ma się wyświetlać. Następnie zapisz ustawienia i opublikuj stronę ponownie.
Konfiguracja responsywnego projektu w Zero Block
Można skonfigurować responsywność bloku dla różnych urządzeń, przekształcając blok w blok typu „ Zero Block ” za pomocą opcji dostępnej w ustawieniach bloku. Opcja ta jest obecnie dostępna w większości bloków.
Po przekształceniu bloku w „ Zero Block ” jego zawartość i wygląd zostaną zresetowane do ustawień domyślnych. Tekst i obrazy trzeba będzie ponownie dodać do bloku.
Po konwersji będziesz mógł ręcznie skonfigurować wygląd bloku dla pięciu przedziałów szerokości ekranu lub dodać własne przedziały. Więcej informacji na temat konfigurowania responsywnego projektu w „ Zero Block ” znajdziesz w artykułach „Zero Block: Jak utworzyć blok niestandardowy” oraz „Zero Block: Responsywny projekt ”.
Wyłączanie responsywności strony
Jeśli wyłączysz responsywność, strona na urządzeniach mobilnych będzie wyglądać tak samo jak na komputerze stacjonarnym.

Aby wyłączyć wersję responsywną, przejdź do sekcji „Ustawienia strony” → „Dodatkowe”, zaznacz pole wyboru „Wyłącz widok mobilny” i opublikuj stronę ponownie.
Wykonane na
Tilda