Zrozumienie ustawień układu strony w elementorze

Podczas projektowania z Elementor ustawienia układu strony odgrywają istotną rolę w projekcie witryny.

Ustawienia te pozwalają kontrolować strukturę, styl, a nawet domyślny fundament projektowy twoich stron.
Możesz tworzyć blog, stronę docelową lub niestandardowy układ; We wszystkich przypadkach zrozumienie tych opcji pomoże Ci projektować z pewnością.

W tym przewodniku przejdziemy przez ustawienia strony Elementor i globalne ustawienia układu, odpowiemy na typowe pytania dotyczące edycji układu i pomoże Ci zdecydować o najlepszym podejściu podczas tworzenia stron.

Zrozumienie ustawień układu strony w elementorze

Jak edytować układ strony w Elementor?

Aby edytować układ strony w Elementor, zaloguj się do pulpitu WordPress i przejdź do stron. Wybierz stronę, którą chcesz dostosować i kliknij Edytuj za pomocą Elementor.

Gdy będziesz w Elementor, poszukaj ikony małej przekładni na środku. Kliknięcie tego otwiera panel ustawień strony, w którym znajdziesz opcje dostosowania ogólnych, stylu i zaawansowanych ustawień dla tej konkretnej strony.

• Ustawienia ogólne zarządzają tytułami, wizerunkami, komentarzami i układem strony.
• Ustawienia stylu kontrolują tło, odstępy i wyrównanie.
• Zaawansowane ustawienia umożliwiają dodawanie niestandardowych CSS i animacji.

Ustawienia ogólne

Karta ogólna jest miejscem, w którym konfigurujesz niezbędne elementy swojej strony. Każda opcja tutaj wpływa na sposób wyświetlania Twojej strony i jak interakcja z motywem lub środowiskiem WordPress.

1. Tytuł: Opisz tytuł strony, aby opisać cel Twojej treści. Dobrze wybrany tytuł poprawia czytelność odwiedzających i przyczynia się do SEO.
2. Status: Wybierz, czy Twoja strona jest szkicem (nie jest widoczna dla odwiedzających), opublikowaną (na żywo w witrynie), czy prywatna (widoczna tylko dla użytkowników zalogowanych z odpowiednimi uprawnieniami).
3. Fragment: Napisz podsumowanie treści strony. Jest to pomocne w przypadku fragmentów wyszukiwarek i wyświetlania podglądu na stronach archiwum lub listy.
4. Wyróżniony obraz: Ustaw wyświetlony obraz, aby przedstawić stronę wizualnie. Jest to przydatne podczas udostępniania linków w mediach społecznościowych lub podczas wyświetlania postów w siatkach i widżetach blogów.
5. Zamów: Użyj liczb, aby zorganizować sekwencję stron w menu lub listach stron. Strony z niższymi liczbami pojawiają się pierwsze, pomagając kontrolować kolejność wyświetlania.
6. Zezwalaj na komentarze: Zdecyduj, czy odwiedzający mogą zostawić komentarze na stronie. Zazwyczaj jest to włączone dla postów na blogu, ale często wyłączane w przypadku stron docelowych lub treści statycznych.
7. Ukryj tytuł: Przełącz tę opcję, jeśli chcesz usunąć domyślny tytuł strony i zacznij od czystego płótna. To jest
8. Układ strony: Elementor daje kilka opcji układu strony do kontrolowania, w jaki sposób pojawia się twoja treść. Każda opcja służy inny cel, w zależności od rodzaju strony, którą chcesz utworzyć.
   • Domyślnie: Ten układ jest zgodny z domyślnym szablonem strony Ustaw w panelu Elementor >> Menu Hamburger >> Ustawienia witryny . Utrzymuje strukturę projektową zdefiniowaną przez Twój motyw. Idealny do zwykłych stron lub blogów, w których chcesz spójność w całej witrynie.
   • Elementor Canvas: zapewnia całkowicie pustą stronę bez nagłówka, stopki lub paska bocznego. Ta opcja jest idealna do projektów wolnych od rozproszenia, takich jak strony docelowe, wkrótce strony lub strony sprzedaży.
   • Elementor Pełna szerokość: Utrzymuje nagłówek i stopkę z motywu, ale usuwa pasek boczny, umożliwiając główną zawartość rozciągania się na pełnej szerokości ekranu. Dobry wybór przy projektowaniu wciągających układów, sekcji bohaterów lub suwaków pełnej szerokości.
   • Motyw: Używa domyślnego szablonu strony z aktywnego motywu. Jeśli twój motyw ma wiele wariantów szablonów (takich jak „Brak paska bocznego” lub „tylko treść”), mogą również pojawić się tutaj.
   • Strona Brak tytułu: Usuwa tytuł strony, jednocześnie utrzymując nienaruszone resztę struktury motywu. Ta opcja jest pomocna, gdy chcesz czystej konstrukcji bez domyślnego tytułu pokazującego u góry.

Ustawienia stylu

Karta Style koncentruje się na wizualnym wyglądzie Twojej strony. Tutaj możesz zdefiniować tło i odstępy, które opracowują Twoją treść.

1. Typ tła: Wybierz stały kolor, tło gradientu lub obraz, aby ustawić nastrój dla swojej strony. Dobrze wybrane tło powoduje wpływ wizualny i wzmacnia markę.
2. Odstępy: Dostosuj marginesy i wyściółkę, aby kontrolować, ile miejsca pojawia się wewnątrz i wokół treści. Marginesy pchają elementy, a wyściółka tworzy miejsce oddechowe wewnątrz pojemnika.

Możesz także ustawić wyrównanie tekstu, responsywne ustawienia projektowe i regulacje odstępów, aby Twoja strona wygląda dobrze na komputerach stacjonarnych, tabletach i telefonach komórkowych.

Zaawansowane ustawienia

Aby uzyskać większą elastyczność, Elementor zawiera zaawansowaną kartę z opcjami wykraczającymi poza podstawy.

1. Niestandardowe CSS: Dodaj własny kod CSS do elementów określonych w stylu. Kod tutaj dotyczy tylko bieżącej strony, co daje swobodę tworzenia unikalnych dostosowań bez wpływu na resztę witryny.
2. Przewiń Efekty Snap and Motion: Dodaj animacje lub przewijanie efektów, aby uzyskać dodatkowy atrakcyjność wizualna.

Zaawansowana karta to miejsce, w którym projektanci i programiści mogą naprawdę dostosować wygląd strony.

Globalne ustawienia układu

Podczas gdy ustawienia strony kontrolują poszczególne strony, globalne ustawienia układu umożliwiają zdefiniowanie domyślnych dla całej witryny. Aby uzyskać dostęp do ustawień globalnych, otwórz dowolną stronę w Elementor, kliknij ikonę ustawienia witryny w lewym polu i wybierz układ.

Stąd możesz dostosować:

1. Szerokość zawartości: Zdefiniuj maksymalną szerokość treści. Standardowe ustawienie to 1140px, które działa dobrze dla większości ekranów komputerów stacjonarnych.
2. Wyściółka pojemnika: Ustaw domyślny odstęp wewnętrzny dla pojemników. Możesz zastosować tę samą wyściółkę po wszystkich stronach lub indywidualnie dostosować górną, dolną, lewą i prawą.
3. LIKA: Kontroluj przestrzeń między kolumnami i wierszami wewnętrznymi pojemnikami. Pomaga to utrzymać czyste wyrównanie i spójne odstępy.
4. SELECTOR TYTUŁU STRONY: Jeśli motyw używa unikalnego selektora dla tytułów stron, określ go tutaj. Umożliwia to Elementor poprawnie ukryć lub styl tytuły stron.
5. Rozciągnięta sekcja Dopasuj do: Zdefiniuj, który element tagu HTML powinien użyć podczas rozciągania sekcji do pełnej szerokości. Najczęstszym tagiem jest ciało, ale niektóre motywy mogą używać innego opakowania.
6. Układ strony domyślnej: Wybierz globalny domyślnie, taki jak Elementor Canvas lub Elementor Pełna szerokość, zamiast polegać na ustawieniach motywu dla każdej nowej strony.

Po skonfigurowaniu preferencji kliknij Zapisz zmiany , aby zastosować je w swojej witrynie.

Jaka jest domyślna szerokość układu w Elementor?

Domyślna szerokość układu Elementora wynosi 1140 pikseli. Ta szerokość jest szeroko stosowana, ponieważ zapewnia wygodne wrażenia z czytania na ekranach stacjonarnych, jednocześnie dobrze dostosowując się do tabletów i mniejszych urządzeń.

Możesz zmienić to ustawienie w ustawieniach witryny >> Układ, jeśli Twój projekt wymaga węższego lub szerszego układu.

Jaki jest optymalny sposób utworzenia strony z Elementor?

Optymalny sposób zależy od twojego celu:

• Jeśli budujesz regularną stronę treści lub blog, trzymaj się domyślnego układu , aby nagłówek, stopka i pasek boczny pozostały nienaruszone.
• W przypadku stron docelowych lub linii sprzedaży używaj Elementor Canvas , aby uzyskać projekt bez rozproszenia.
• Jeśli chcesz szeroko, wciągające układy, ale nadal potrzebujesz elementów nawigacji i stopki, idź z pełną szerokością Elementor.

Dobrą praktyką jest najpierw ustawienie globalnych wartości domyślnych, więc wszystkie nowe strony zaczynają się od preferowanej struktury. Następnie dopracuj poszczególne strony za pomocą panelu ustawień strony w razie potrzeby.

Podsumowanie!

Ustawienia układu strony w Elementor zapewniają kontrolę zarówno na poszczególnych stronach, jak i witrynie jako całości.

Ucząc się, jak korzystać z ogólnych, zaawansowanych i globalnych ustawień układu , możesz tworzyć projekty, które wyglądają profesjonalnie, są łatwe w zarządzaniu i dopasować cele Twojej witryny.

Jeśli budujesz jednorazową stronę docelową, ustawienia specyficzne dla strony wystarczy.

Ale jeśli pracujesz na większej stronie internetowej, konfigurowanie globalnych wartości domyślnych zaoszczędzi czas i zapewni spójność projektowania na wszystkich stronach.

Dzięki tym opcjom ustawienia Elementor zapewnia elastyczność w projektowaniu witryny dokładnie tak, jak ją wyobrażasz.