Przejdź do treści
Uwaga: Tłumaczenie tego artykułu jest podane wyłącznie dla wygody. Tłumaczenie jest tworzone automatycznie za pomocą oprogramowania tłumaczącego i mogło nie zostać sprawdzone. W związku z tym, angielska wersja tego artykułu powinna być uważana za wersję obowiązującą, zawierającą najnowsze informacje. Możesz uzyskać do niej dostęp tutaj.
Design Manager

Struktura i dostosowywanie układów szablonów

Data ostatniej aktualizacji: grudnia 15, 2021

Dotyczy:

Marketing Hub Professional, Enterprise
CMS Hub Professional, Enterprise
Wcześniejsze konto Marketing Hub Basic

Dowiedz się, jak skonfigurować i dostosować istniejący szablon metodą "przeciągnij i upuść" oraz jak pracować z modułami, grupami i kolumnami jako elementami konstrukcyjnymi szablonu.

Struktura Twojego szablonu

Korzystając z edytora układu w menedżerze projektów, możesz szybko zbudować układ treści bez konieczności pisania kodu HTML.

  • W koncie HubSpot przejdź do Marketing > Pliki i szablony > Narzędzia do projektowania.
  • W wyszukiwarce kliknij naszablon, aby go edytować.

Dodawanie i przeciąganie modułów

Aby dodać moduł do układu, kliknij przycisk+ Dodajwgórnej części inspektoraukładów.Wyszukaj lub zaznaczmoduł, a następnie przeciągnij go w miejsce, w którym chcesz, aby moduł był renderowany w układzie. Przeciąganie modułów na wierzch innych modułów spowoduje utworzenie kolumn lub pogrupowanie modułów.

Zmiana szerokości kolumn

Aby zmienić szerokość kolumny, najedź kursorem na moduły, kliknij i przeciągnij w poziomie.

Moduły grupowe

Grupy modułów to jednostki modułów, które tworzą różne sekcje strony.

Aby zgrupować dwa moduły, kliknijpierwszy moduł, a następnie naciśnij i przytrzymajklawisz Control/Commandi wybierzdrugi moduł. Powtórz ten krok, jeśli grupujesz więcej niż dwa moduły. Następnie kliknijikonę grupygroupModulew inspektorzemodułów.

Uwaga:grupy modułów nie mogą przekraczać separatora sekcji ani zawierać częściowo wybranej grupy modułów.

Podziel moduły poziomo

Podział modułu powoduje jego podzielenie na pół, tworząc dwa moduły. Aby podzielić moduł, kliknijmoduł, a następnie kliknijikonę podzielmodułsplitModulew inspektorzemodułów. Możesz też kliknąć prawym przyciskiem myszy na moduł w layoucie i wybrać opcjęPodziel moduł.

Moduły środkowe

Dzięki odstępnikom poziomym możesz wyśrodkować moduły i grupy na stronie lub dodać pustą przestrzeń po obu ich stronach. Aby dodać odstępnik poziomy, kliknij przycisk + Dodajna górze inspektora układu. Odszukaj pozycję Przekładkapozioma, a następnie przeciągnij ją i upuść do szablonu.

Aby zmienić rozmiar poziomego elementu dystansowego, zmień szerokość kolumny oddzielającej go od innych modułów. Aby wyśrodkować moduł lub grupę, dodaj poziome elementy dystansowe z każdej strony.

add-horizontal-spacer

Dodaj elastyczną kolumnę

Elastyczne kolumny zostały zaprojektowane w celu ułatwienia twórcom treści zarządzania treścią na poziomie strony. Po dodaniu elastycznej kolumny do szablonu strony HubSpot, użytkownicy otrzymają możliwość dodawania, usuwania i zmiany kolejności modułóww indywidualnym edytorze strony. Funkcja ta pozwala projektantom na tworzenie mniejszej ilości szablonów, jednocześnie dając marketerom elastyczność w dostosowywaniu każdej strony do ich potrzeb.

Aby dodać elastyczną kolumnę, kliknij przycisk+ Dodajw górnej części inspektora układu. Znajdź pozycjęElastyczna kolumna, a następnie przeciągnij ją i upuść do szablonu.

Proszę zwrócić uwagę:
  • Elastyczne kolumny można dodawać tylko do szablonów stron, nie można ich dodawać do szablonów wiadomości e-mail ani szablonów blogów.
  • Moduły dodane do elastycznych kolumn nie mogą mieć powiązanych z nimi klas CSS, stylizacji inline, ani zawijanego HTML. Opcje stylizacji muszą być dodane do samej elastycznej kolumny.


Dostosuj swój szablon

Kiedy już zorganizujesz ogólny układ swojego szablonu, możesz wymieniać moduły i dokonywać innych modyfikacji szablonu.

Edycja opcji modułu

Możesz edytować opcjemodułu, klikając na niego w edytorze układu. W inspektorze modułów po prawej stronie zobaczysz edytowalne opcje modułu. Opcje te zazwyczaj obejmują stylizację, domyślną zawartość oraz opcje edytora i mogą się różnić w zależności od konkretnego typu modułu. Dowiedz się więcej na tematedycji CSS modułu oraz domyślnej zawartości i ustawień.

Edit options

Zamień moduł

Po dodaniu modułu do szablonu możesz zamienić go na inny. Kliknij prawym przyciskiem myszy namodułw edytorze układu, a następnie kliknijZamień moduł. W rozwijanym menu, które się pojawi, wybierzmoduł, którym chcesz zastąpić oryginalny moduł.

Konwersja do modułu globalnego

Możesz przekonwertować moduł w swoim szablonie na moduł globalny, który może być używany w wielu szablonach. Jest to przydatne, gdy stylizowałeś moduł w określony sposób i/lub masz domyślną zawartość w module, którą chciałbyś ponownie wykorzystać w innych szablonach.

  • Kliknijmodułw edytorze układu.
  • W inspektorze modułów kliknij menu rozwijane Więcej i wybierzKonwertuj do modułu globalnego.
  • W oknie dialogowym wpisznazwę modułu globalnego, a następnie kliknij przyciskUtwórz.

Usuń moduł

Aby usunąćmoduł, kliknij go w edytorze układu, a następnie kliknijikonę kosza na śmieciUsuńw inspektorze modułów. Możesz też kliknąćmodułprawym przyciskiem myszy i wybrać opcjęUsuń moduł.

Zarządzaj swoim szablonem w wyszukiwarce

Poza opcjami modułu, istnieje kilka akcji, które możesz wykonać dla swojego szablonu.

  • W prawej górnej części szablonu kliknijikonę folderufolder.
  • Kliknij prawym przyciskiem myszy nanazwęszablonu. W rozwijanym menu możesz dostosować następujące opcje:
    • Kopiuj do portali: skopiuj szablon do innego portalu, którego jesteś użytkownikiem. Szablony zakupione w Marketplace nie będą mogły być kopiowane do innych portali.
    • Klonuj szablon: tworzy dokładny duplikat twojego szablonu i jest przydatny, gdy chcesz stworzyć odmianę istniejącego szablonu.
    • Klonujdo HTML: tworzy oddzielną wersję HTML Twojego szablonu. Jest to pomocne, jeśli potrzebujesz większej kontroli nad znacznikami lub chcesz dowiedzieć się więcej o tym, jak szablony są kodowane.
    • Wyświetl źródło szablonu: wyświetlanie koduźródłowego HTML szablonu. W przeciwieństwie do opcjiKlonuj do HTML, ta opcjanietworzy oddzielnej wersji HTML Twojego szablonu.
    • Zmień nazwę szablonu:edytuj wewnętrzną nazwę swojego szablonu.
    • Pokaż elementy zależne: wyświetl wszystkie strony, e-maile lub blogi, które aktualnie korzystają z szablonu.
    • Pokaż historię rewizji: zobacz historię rewizji Twojego szablonu i wybierz opcję przywrócenia szablonu do poprzednio opublikowanej wersji.
    • Utwórz email/stronę:utwórz e-mail lub landing page/stronę internetową bezpośrednio z szablonu.
    • Usuń szablon: usuwa szablon. Po usunięciu, szablon pozostanie dostępny przez30 dni, po czym zostanie trwale usunięty. Aby przywrócić szablon, należy skontaktować się z obsługą klienta.
  • Dostęp do tych opcji można również uzyskać zmenu rozwijanychPlikiCzynnościpowyżej.