Wprowadzenie do układu Layout Grid - Część 1

Layout Grid (układ na siatce) zapewnia szybki i łatwy sposób na stworzenie strony składającej się z wielu kolumn responsywnych (pływających). Siatka może mieć maksymalnie 12 kolumn, o rozmiarach podawanych w procentach.Pozycja obiektów umieszczane na siatce jest względna, co oznacza, że są one umieszczane obok siebie (od lewej do prawej) w zależności od dostępnego miejsca. Jeśli obiekt nie mieści się w bieżącym wierszu zostanie on zawinięty do następnego wiersza. Niektóre obiekty (takie jak obrazy, tekst, blog, galeria zdjęć) zajmujące pełną szerokość czyli cały wiersz  będą podlegać rozciąganiu lub kurczeniu, gdy rozmiar strony jest zmiany. Dla mniejszych ekranów (urządzenia mobilne) wszystkie kolumny są układane w oparciu o zdefiniowane przerwania. Jest to świetny sposób, aby utworzyć nowe elastyczne układy (Bootstrap-like)!

Zobacz także FAQ  o Layout Grid: http://wysiwygwebbuilder.com/forum/viewtopic.php?f=10&t=71391

Ważne: Nie używaj 'Centruj w oknie przeglądarki " gdy używasz układu na siatce (layout grid).
Uwaga: Nie można zmienić rozmiaru lub położenia siatki. Rozmiar siatki zależy od jej zawartości. Pozycja siatka jest "pływająca" (floating) i zostanie ona automatycznie umieszczona po poprzednim obiekcie pływającym (floating).
Dodawanie obiektów
Aby dodać obiekty do
Layout Grid po prostu przeciągnij i upuść obiekt wewnątrz kolumny. Kolumna do której obiekt będzie dodany zaznaczy się (uaktywni).
Desktop:
Mobile:
Menadżer kolumn.

Aby wstawić dodatkową kolumnę, kliknij przycisk "Dodaj". Szerokość kolumny może być regulowana przez przeciąganie uchwytów między kolumnami. Aby usunąć kolumnę, najpierw zaznacz ją i kliknij "Remove". Jest także inny sposób aby usunąć kolumnę (każdą oprócz pierwszej od lewej), przeciągając za prawy uchwyt kolumny na kolumnę po prawej, usuwana będzie kolumna po prawej stronie.
Każda kolumna ma własne wyrównanie(alignment). Aby zmienić ustawienie, kliknij kolumnę, a następnie wybierz ustawienie.

Układ (Layout)
Siatka może być skonfigurowana jako układ stały(fixed) lub płynny(fluid).
Układ stały będzie miał kolumny o stałej szerokości. Układ będzie wycentrowany w viewport.
Układ fluid wykorzystuje całą szerokość okna przeglądarki i wszystkie kolumny zostaną odpowiednio przeskalowane.

Padding
Padding określa szerokość po obu stronach kolumny..  .

Breakpoint
Punkt przerwania który określa szerokość viewport gdy zostanie zmieniona orientacja ekranu (landscape/portrait).


Dodawanie tekstu
Gdy tekst jest dodawany do
Layout Grid automatycznie wykorzystywał będzie on pełną szerokości kolumny. Więc jeśli zmienisz szerokość strony, tekst będzie się dynamicznie zmieniał.

Dodawanie obrazów
Obrazy, które są częścią
Layout Grid mogą być albo reagujące (dostosują się do wielkości kolumny) lub o stałym rozmiarze. Może być to skonfigurowane w oknie właściwości Obrazu -> Layout -> Full width  false/true
Opcja ta jest dostępna i widoczna tylko wtedy, gdy obraz jest częścią
Layout Grid.

Maksymalna szerokość określa maksymalny rozmiar obrazu, gdy jest dozwolona pełna szerokość (true). Zapobiega to aby obraz nie był za  duży w układach responsewnych.
Uwaga: Opcja Layout->FullWith jest dostępna również dla obiektów Rollover Image i Slideshow..
Dodawanie wideo (YouTube / Vimeo / HTML5)
Podobnie jak obrazy, pliki wideo mogą być również responsywne lub mieć stałą wielkość. Jednak w przeciwieństwie do obrazków, przeglądarka nie może tu automatycznie określić proporcji filmu. Określając współczynnik proporcji w Web Builder, film będzie elastyczny z  zachowaniem proporcji!
Dodawanie innych obiektów
Różne obiekty różne zachowują się w
Layout Grid. Niektóre obiekty są elastyczne, więc mogą korzystać z pełnej szerokości kolumny, podczas gdy inne mają stały rozmiar (nie ma na to wpływu szerokość kolumny).
Obiekty  "elastyczne":
• Tekst
• Galeria
• Linia pozioma
• Ramka Inline
• Blog
• Pola wejściowe Formularzy (editbox, combobox, textarea)
• formularze logowania
• News Feed Ticker
Przykłady obiektów "stałych":
• Kształty i inne narzędzia z grupy Rysunek
• Przyciski
• obiekty nawigacyjne

Chociaż nie można przeciągnąć formularza na siatkę to już elementy formularza można jak najbardziej, sama siatka może być wtedy formularzem! Aby tak się stało  należy zezwolić na opcję formularza w zakładce Form.

Niektóre obiekty nie mogą być częścią sieci układu na siatce, ponieważ nie mogą zmieniać rozmiaru automatycznie. Na przykład:
• Warstwy
• Formularze
• Tabele
• Akordeon.
Nie jest wykluczone że takie zachowanie może się zmienić w przyszłych aktualizacjach.
Obiekty składowe nie będą miały już ustalonej pozycii wewnąrz kolumny. Będą "pływające" (floating).

Wyjście
---Home------Download------Zakup------Poradniki Online------Szablony------Wsparcie------Forum------Rozszerzenia------Manual------Rózne---
Copyright © 2017