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

Użyj domyślnych modułów w swoim szablonie

Data ostatniej aktualizacji: października 18, 2021

Dotyczy:

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

Jest to przegląd wszystkich domyślnych modułów dostępnych dla szablonów typu "przeciągnij i upuść " w narzędziach do projektowania. Każdy typ modułu można dostosować za pomocą opcji stylizacji i zawartości w inspektorze. Można również dodać moduł domyślny do szablonu HTML za pomocą jego fragmentu HubL.

Dodaj moduł do swojego szablonu

Aby dodać moduły do swoich szablonów metodą "przeciągnij i upuść", kliknij + Dodaj w inspektorze w prawym górnym rogu edytora. Wszystkie domyślne moduły i wszelkie zapisane niestandardowe moduły lub grupy pojawią się tutaj. Aby znaleźć konkretny moduł, wpisz jego nazwę nazwa w pasku wyszukiwania. Możesz też kliknąć na Filtruj według kategorii lub tagówmenu rozwijane i wybrać jeden lub więcej filtrów.

Gdy moduł jest zaznaczony w edytorze, możesz modyfikować style, ustawienia i zawartość modułu w inspektorze. W sekcji Zawijanie HTML kliknij przycisk Rozwiń, aby dodać więcej niestandardowych stylizacji w edytorze kodu.

W dolnej części inspektora możesz zablokować moduł, aby użytkownicy nie mogli modyfikować domyślnej zawartości podczas edycji bloga, wiadomości e-mail lub strony. Kliknij, aby włączyć przełącznik Zapobiegaj edycji w edytorach treści, aby włączyć to ustawienie.

Dostosuj moduł domyślny

Wszystkie Hub marketingowy Konta Professional i Enterprise orazHub CMS KontaProfessional i Enterprise mają domyślnie folder @hubspot w narzędziach projektowych. Folder ten zawiera wszystkie Twoje motywy i domyślne moduły, w tym moduły e-mailowe typu "przeciągnij i upuść". Te motywy i moduły są tylko do odczytu, ale mogą być sklonowane, jeśli chcesz je edytować.

design-manager-hubspot-folder

  • W koncie HubSpot przejdź do Marketing > Pliki i szablony > Narzędzia do projektowania.
  • W finderze kliknij na folder @hubspot.
  • Kliknij prawym przyciskiem myszy moduł domyślny , który chcesz sklonować, a następnie wybierz Clone module.

    design-manager-clone-module
  • W sklonowanym module edytuj kod źródłowy modułu w centralnym panelu edycyjnym.
  • Aby zapisać zmiany, w prawym górnym rogu kliknij przycisk Opublikuj zmiany. Moduł będzie wtedy dostępny do użycia podczas budowania szablonów.

Typy modułów domyślnych

Wypisanie się z kopii zapasowej

Zapasowy szablon rezygn acji z subskrypcji jest wyświetlany odbiorcom wiadomości e-mail, którzy klikną łącze rezygnacji z subskrypcji, jeśli HubSpot nie jest w stanie określić ich adresu e-mail. Tekst pomocy wyświetlany na stronie wypisywania się z kopii zapasowej można dostosować w sekcjiZawartość domyślnatego modułu.

Backup Unsubscribe

Komentarze na blogu

Uwaga: moduł komentarzy blogowych nie jest dostępny dla szablonów stron i wiadomości e-mail.

Modułkomentarzy blogowych dodaje sekcję komentarzy do szablonu postuna blogu. Możesz dostosować formularz komentarzy do blogaw swoim narzędziu formularzy. Formularz będzie miał nazwę opartą na tytule Twojego bloga.


Default blog comments form

Zawartość bloga

Uwaga: moduł treści bloga nie jest dostępny dla szablonów stron i wiadomości e-mail.

Moduł zawartości bloga zawiera znaczniki HTML/HubL dla Twoich postów na blogu i stron z listą blogów. Możesz edytować znaczniki swoich postów, klikającEdytuj szablon postu, a także edytować znaczniki stron listingów, klikającEdytuj szablon listingu. Dowiedz się więcej o znacznikachmodułu zawartości bloga.

blog-content-1.png

Subskrypcja e-mail bloga

Uwaga: moduł subskrypcji e-maili na blogu nie jest dostępny dla szablonów e-maili.

Modułsubskrypcji e-mail blogapozwala odwiedzającym subskrybować wiadomości e-mail z Twojego bloga przez wypełnienie formularza. Ten moduł jest wypełniany przez formularz subskrybenta bloga, który może być dostosowany w narzędziu formularzy.

Kliknij menu rozwijane Wybierz blog do wyświetleniai wybierz blog, który odwiedzający subskrybują. W polu tekstowym Tytuł do wyświetl enia nad formularzem dostosuj tekst, który pojawi się w tytule nad formularzem. Najedź kursorem na istniejącą odpowiedź inline i kliknijikonę rozwin ięcia,aby dostosować tekst, który pojawia się po przesłaniu formularza przez odwiedzającego.

Blog email subscription

Call-to-action

Moduł wezwania do działania (CTA) umieszcza CTA w swoim własnym module w layoucie. Możesz również wstawić CTA do modułu bogatego tekstu.

W inspektorze kliknij menurozwijane CTA iwybierz domyślne CTA dla tego modułu w swoim szablonie. Lub kliknij+ Utwórz nowe C TA w tym samym menu , aby utworzyć nowe CTA jako domyślne CTA.

HubSpot Help article screenshot


Kolumna elastyczna

Elastyczne kolumny mogą być dodawane do szablonów stron, aby umożliwić dodawanie, usuwanie i zmianę kolejności modułów w edytorze treści. Daje to twórcom stron elastyczność w używaniu jednego szablonu do tworzenia wielu układów stron.

Proszę zwrócić uwagę:
  • Elastyczne kolumny nie są dostępne w szablonach blogów, stron systemowych i wiadomości e-mail.
  • Po dostosowaniu elastycznej kolumny dla konkretnej strony w edytorze treści zmiany wprowadzone w elastycznej kolumnie w szablonie nie zostaną odzwierciedlone na tej stronie. Gwarantuje to, że dostosowana zawartość nie zostanie nadpisana.

Gdy dodasz moduł elastycznej kolumny do swojego szablonu, możesz przeciągnąć i upuścić inne moduły, aby utworzyć grupę elastycznych kolumn. Możesz również kliknąć prawym przyciskiem myszy na istniejącą grupę statyczną i wybrać Utwórz elastyczną kolumnę.


Follow me

Uwaga: moduł follow me nie jest dostępny dla szablonów e-mail.

Możesz użyć opcji "follow memodułaby pomóc odwiedzającym nawiązać kontakt z Twoją firmą w mediach społecznościowych. W przeciwieństwie do modułu udostępniania społecznościowego, moduły follow me kierują użytkowników z Twojej strony do odpowiednich stron mediów społecznościowych.

Po dodaniu modułu "śledź mnie" można dostosować nagłówek modułu, który pojawia się nad ikonami społecznościowymi.

Możesz określić, które sieci mediów społecznościowych pojawiają się w tym module w sekcjiFollow Mew ustawieniach społecznościowych.

Uwaga:moduł Follow Me wykorzystuje domyślne ikony dla każdej sieci społecznościowej. Jeśli chcesz użyć własnychikon społecznościowych, możesz stworzyćwłasnąwersję modułu.

Śledź mnie - email

Uwaga: ten moduł jest dostępny tylko dla e-maili utworzonych w edytorze drag and drop. Możesz zlokalizować moduł w edytorze pod nazwąSocial.

Moduł follow me - email oferuje dodatkowe opcje formatowania i ustawieńdla szablonów email metodą "przeciągnij i upuść". Możesz dostosować kształt ikony społecznościowej, koloryiwyrównanie w twoim module. Możesz również dodać niestandardowe konto społecznościowe iprzesłać własną ikonę w edytorze.

Aby edytować sieci społecznościowe, które pojawiają się w tym module, kliknij ikonę+ Dodajw sekcjiSieci społecznościowew inspektorze. Następnie najedź kursorem na nazwę sieci społecznościowej i kliknij ikonęedytuj ikonę edytujorusuwanie ikonę usuwaniato wprowadzić zmiany.

follow-me-email-options

Kliknij ikonęedycji, aby wybrać, która sieć społeczna się pojawi i do jakiego adresu URL prowadzi. Jeśli wybierzesz opcję Custom Icon, zobaczysz dodatkowe opcje, aby określić niestandardowy obraz dla tej sieci. KliknijReplace, aby wybrać obraz z narzędzia plików lub przesłać nowy obraz z komputera.

custom-icon

Formularz

Uwaga: moduł formularzynie jest dostępny dla szablonów wiadomości e-mail.

Moduł formularza umożliwia dodanie formularza do strony lub bloga w celu przechwycenia informacji kontaktowych od odwiedzających witrynę.

W tym module można dostosować następujące ustawienia:

  1. Tytuł formularza: wprowadź tytuł formularza, który będzie wyświetlany na stronie lub blogu.
  2. Formularz: wybierz istniejący formularz HubSpot, który ma się pojawić na stronie, lub dodaj nowy formularz.
  3. Co zobaczy odwiedzający po wysłaniu formularza?: wybierz, czy przekierować osobę, która wysłała formularz na inną stronę, czy wyświetlić wiadomość z podziękowaniem na tej samej stronie.
  4. Wiadomość z podziękowaniem: dostosuj swoją wiadomość z podziękowaniem w linii.
  5. Wysyłaj powiadomienia o formularzach na określone adresy e-mail zamiast domyślnych formularzy: wysyłaj e-maile z powiadomieniami o formularzach na określone adresy. Zastąpi to wszystkich odbiorców powiadomień ustawionych w narzędziu formularzy.
  6. Dodaj do przepływu pracy: dodaj odwiedzających, którzy wysłali formularz, do przepływu pracy(tylkoMarketing Hub Professional lubEnterprise ).
  7. Wyślij wiadomość uzupełniającą: wyślij do trzech wiadomości uzupełniającychdo odwiedzających, którzy przesłali formularz.

form-module-2

Modułnagłówkawyświetla linię tekstu w znaczniku HTML nagłówka.W poluZawartośćnagłówka wpisz domyślny tekst nagłówka. Kliknijmenu rozwijane Typ nagłówka,aby wybrać znaczniknagłówka(H1-H4).

Pozioma ramka dystansowa

Modułodstępu poziomego tworzy pusty znacznik div, który dodaje odstępy pomiędzy elementami na stronie.

HubSpot Help article screenshot

Obraz

Moduł obrazu dodaje pojedynczy obraz do fragmentu treści. Dowiedz się więcej o opcjach edycji modułów graficznych.

Galeria zdjęć

Moduł galerii obrazów dodaje serię obracających się obrazów do pojedynczego modułu. Dowiedz się więcej o konfigurowalnych ustawieniach modułu galerii obrazów.

Przełącznik języków

Uwaga: moduł przełącznika językównie jest dostępny dla szablonów wiadomości e-mail.

Moduł przełącznika językowego pozwala odwiedzającym przełączać się między przetłumaczonymi wersjami strony lub bloga. Kliknij menu rozwijane Tryb wyświetlania, aby dostosować sposób wyświetlania nazw przetłumaczonych języków:

  • Pagelang: nazwa każdego języka będzie wyświetlana w języku bieżącej strony. Na przykład, jeśli oglądasz angielską wersję strony z francuskim tłumaczeniem, po kliknięciu przełącznika języków zobaczysz nazwy angielskie i francuskie jako nazwy języków.
  • Zlokalizowane: nazwa każdego języka będzie wyświetlana w tym języku.Na przykład, jeśli oglądasz angielską wersję strony z tłumaczeniem na język francuski, po kliknięciu przełącznika języków zobaczysz nazwy angielski i francuski jako nazwy języków.
  • Hybrydowy: połączenie tych dwóch języków. Na przykład, jeśli oglądasz angielską wersję strony z francuskim tłumaczeniem, po kliknięciu przełącznika języków, zobaczysz angielski i francuski (Français) jako nazwy języków.

Ten moduł będzie wyświetlany tylko na stronach na żywo z więcej niż jednym opublikowanym tłumaczeniem. Dowiedz się więcej o pracy zzawartością wielojęzycznąw HubSpot.


Moduł logo

TheLogomoduł pobiera logo firmy automatycznie z ustawień witryny.Aby użyć innego logo, kliknij, aby włączyć przełącznik Zastąp domyślne logo dla tej strony, aby załadować nowy obraz tylko dla tej strony. Aby zmienić domyślne logo dla całej zawartości w ustawieniach witryny, kliknij Edytuj domyślne logo w tej domenie.

Twój moduł logo będzie automatycznie łączył się z domeną Twojej firmy. Aby zastąpić ten domyślny i link do innej strony, wprowadź unikalny Link URL.

edit-logo-module


Główna treść wiadomości e-mail

Główny moduł treści wiadomości e-mailjest standardowym modułem rich text, który jest domyślnie dołączany do każdego szablonuwiadomości e-mail.Możesz dostosować domyślnązawartość treściwiadomości e-mail do konkretnego szablonu.

Oprócz standardowych opcji stylizacji, moduł ten można dostosować za pomocą domyślnych kolorów, obramowań i odstępów. Kliknij dymekkolorów i wybierz kolor z palety kolorów lub wpisz wartość szesnastkową w polu tekstowym, aby ustawić domyślne kolory. W polach tekstowychSzerokość obramowania i Odstęp wewnętrzny wpisz wartości w pikselach, aby ustawić domyślne odstępy.

Email Body

Menu

Moduł menu dodaje nawigację do Twoich treści i szablonów. Menu są tworzone i zarządzane bezpośrednio w ustawieniach Twojej strony.

W ramach narzędzi projektowych można dostosować następujące cechy modułu menu:

  1. Menu: wybierz jedno z istniejących menuz ustawień.
  2. Zaawansowany typ menu: wybierz, w jaki sposób pozycje menu powinny pojawiać się w Twojej witrynie:
    • Statyczne - Zawsze pokazuj wmenustrony najwyższego poziomu: zachowaj spójność menu na wszystkich stronach.
    • Dynamiczne według sekcji- Pokaż strony wmenu, które są związane z przeglądanąsekcją: wyświetlaj pozycje menu w stosunku do przeglądanej pozycji menu najwyższego poziomu.
    • Dynamicznie według strony- Pokaż strony wmenu, które są powiązane z przeglądanąstroną:wyświetlaj pozycje menu związane z konkretną przeglądaną stroną.
    • Menu ścieżki w stylu Breadcrumb (używa przepływu poziomego):wyświetlaj pozycje menu poziomo we względnej ścieżce na górze witryny.
  3. Maks. poziomów: wybierz maksymalną liczbę pozycjimenu dziecka, które mogą być wyświetlane.
  4. Orientacja:wybór, czy elementy menu mają być wyświetlane poziomo czy pionowo.
  5. Enable flyouts: zaznaczto pole wyboru, aby pokazaćelementy menu dziecka po najechaniu na rodzica. Wyczyść to polewyboru, aby zawsze pokazywać elementy menu dziecka.
Advanced Menu Options


Moduły

Moduły utworzone w edytorze kodu pozwalają na użycie HTML, CSS, Javascript i HubL do dodania zaawansowanej funkcjonalności do twoich szablonów, jednocześnie pozwalając twoim użytkownikom na edycję zawartości modułu w edytorze treści bez zmiany kodu. Te komponenty będą oznaczone ikoną modułu CustomModulesw wyszukiwarce i inspektorze. Dowiedz się więcej o pracy z niestandardowymi modułami w naszej dokumentacja deweloperska.

Informacje o lokalizacji biura

Moduł lokalizacji biura zawiera wymagane tokeny, które muszą być zawarte w szablonie wiadomości e-mail, aby legalnie wysyłać wiadomości marketingowe. Chociaż można edytować styl tego modułu, nie będzie można zapisać szablonu wiadomości e-mail bez modułu informacji o lokalizacji biura lubwymaganych znacznikówHubL.

Oprócz standardowych opcji stylizacji, moduł ten można dostosować za pomocą domyślnych kolorów, obramowań i odstępów. Kliknij dymekkolorów i wybierz kolor z palety kolorów lub wpisz wartość szesnastkową w polu tekstowym, aby ustawić domyślne kolory. W polach tekstowychSzerokość obramowania i Odstęp wewnętrzny wpisz wartości w pikselach, aby ustawić domyślne odstępy.

HubSpot Help article screenshot


Jeden wiersz tekstu

Moduł jednej linii tekstu pozwala użytkownikom na edycję pojedynczej linii tekstu w edytorze treści.

Moduł stopki strony wyświetla informacje o prawach autorskich z aktualnym rokiem i nazwą Twojej firmy. Nazwa firmy jest automatycznie pobierana z sekcjiStopkaw ustawieniach poczty elektronicznej..

Podpowiedź hasła

Moduł podpowiedzi hasła jest dostępny w szablonach systemu podpowiedzi hasła. Jeśli strona jest chroniona hasłem, strona podpowiedzi hasła zostanie wyświetlona, zanim użytkownik będzie mógł uzyskać dostęp do strony. Możesz dostosować tekst przycisku przesyłania i tekst do wyświetlenia, jeśli wprowadzono nieprawidłowe hasło.

Filtr post

Uwaga: moduł subskrypcji maili na blogu nie jest dostępny dla szablonów maili.

Moduł filtrowania postów wyświetla listę artykułów blogowych z określonego tematu, miesiąca lub autora.

Możesz dostosować następujące ustawienia dla tego modułu w sekcjiDefault Content:

  • Wybierz blog do wyświetlenia: wybierz , które posty z bloga są używane.
  • Lista wartości dla linków filtrujących: wybierz, czy moduł ma być filtrowany według tagów, miesięcy czy autorów.
  • Porządkowanie wartości dla linków filtrujących: wybierz, czy wartości będą uporządkowane alfabetycznie, czy według liczby postów.
  • Tytuł listy do wyświetlenia:wprowadź tytuł, który ma się pojawić nad postami.
  • Maksymalna liczba wartości filtra do wyświetlenia:wprowadź maksymalnąliczbępostów dla określonego filtra. Pozostaw to pole puste, aby wyświetlić wszystkie posty.
  • Link tekstowy do wyświetlenia, jeśli więcej wartości postów jest obecnych niż dozwolone do wyświetlenia:wprowadźtekst, który pojawi się, jeśli jest więcej dostępnych postów w kategorii. Domyślnym tekstem jest Zobacz wszystkie.


Wpis do rejestru

Uwaga: moduł subskrypcji maili na blogu nie jest dostępny dla szablonów maili.

Moduł listowania postów służy do wyświetlania listy postów z bloga HubSpot. Moduł można ustawić tak, aby wyświetlał najnowsze posty lub te, które były najpopularniejsze w ciągu ostatniego miesiąca, sześciu miesięcy, roku lub przez cały czas.

W inspektorze można dostosować następujące wartości domyślne zawartości:

  • Wybierz blog do wyświetlenia: wybierz blog, dla którego chcesz wyświetlić tytuły postów
  • Lista wpisów na blogu według: wybierz, jak chcesz uporządkować wpisy.
  • Tytuł listy do wyświetlenia: wprowadź tytuł, który ma się pojawić nad postami.
  • Maksymalna liczba postów na blogu do listy:wprowadź maksymalnąliczbępostów, które pojawią się w tym module.
Post listing


Bogaty tekst

Moduł bogatego tekstu jest najbardziej powszechnym modułem treści używanym w narzędziach treści HubSpot. Obsługuje on opcje edycji różnych elementów, takich jak tekst, obrazy i CTA.

Aby dodać domyślną zawartość dla tego modułu, kliknij przycisk Rozwińlub kliknij podgląd zawartości, aby otworzyć edytor bogatego tekstu.

HubSpot Help article screenshot


Lista RSS

Proszę zwrócić uwagę: moduł listingów RSS nie jest dostępny dla szablonów e-mail. Zamiast tego należy użyć wiadomości e-mail RSS.

Możesz użyć modułu listowania RSS, aby wyświetlić podsumowania postów dla bloga HubSpot lub zewnętrznego kanału RSS.

Moduły listingowe RSS mogą wyświetlać określony blog lub tag. Kliknij, aby włączyć odpowiedni przełącznik, aby wskazać, czy przy każdym poście ma być wyświetlany wyróżniony obraz, nazwisko autora, podsumowanie lub data publikacji.

Po włączeniu tych ustawień, można dostosować następujące szczegóły:

  • Pokaż nazwę autora: wprowadźtekst atrybutu autora, aby pokazać powyżej każdej nazwy autora. Domyślnie, ten moduł będzie zawierał przez jako tekst przypisania.
  • Pokaż podsumowanie: wprowadź długość podsumowania w znakach dla każdego podsumowania bloga. Możesz również dostosowaćtekst kliknięcia podsumowania, który jest linkiem, który odwiedzający blogi klikają, aby przeczytać cały post. Domyślnie, ten tekst będzie oznaczony jakoCzytaj więcej.
  • Pokaż datę publikacji: wybierzFormat daty publikacji, abydostosować sposóbformatowaniadaty i godziny dla każdego postu. Możesz również dostosować tekst wskaźnika daty publikacji. Domyślnie tekst ten będzie brzmiał:Opublikowano o.
HubSpot Help article screenshot


Nagłówek sekcji

Moduł nagłówka sekcjipozwala na przemieszczenie znacznika nagłówka h1z podtytułem akapitu.Moduł ten jest idealny do tytułowania głównej sekcji strony.

Section header


Proste menu

Proste moduły menu pozwalają użytkownikom tworzyć specyficzne dla strony menu w edytorze treści. Ten moduł daje Ci elastyczność w budowaniu prostego menu dla konkretnego szablonu. W inspektorze kliknij przyciskEdytuj menu, aby dodać pozycje menu, łącza i wybrać orientację menu. Edycja ustawienia orientacji menu dodaje klasę hs-menu-flow-horizontal lub hs-menu-flow-vertical do kontenera opakowującego menu, który może być następnie użyty do stylizacji w twoim CSS. Dowiedz się więcej o klasach dodawanych przez ustawienia modułu w naszej dokumentacji deweloperskiej.

Simple menu


Udostępnianie na portalach społecznościowych

Moduł udostępniania społecznościowego pozwala odwiedzającym łatwo udostępniać Twoje treści w kanałach mediów społecznościowych i wiadomościach e-mail. Kliknij, abyprzełączyć przełącznik Włączone obok określonej sieci społecznościowej, aby dołączyć ją do swojej strony lub wiadomości e-mail.

Łącze udostępniania automatycznie wypełni się wymaganymi znacznikami HubL, aby udostępnić swoją zawartość. W wiadomościach e-mail moduł użyje adresu URL wersji internetowej tej wiadomości e-mail w łączu udostępniania.

Proszę zwrócić uwagę:moduł udostępniania społecznościowego używa domyślnych ikon dla każdej sieci społecznościowej. Jeśli chcesz użyć swoich własnychniestandardowe ikony społecznościoweto możesz stworzyć customizowaną wersję modułu.

Preferencje dotyczące subskrypcji

Moduły preferencji subskrypcji są dostępne tylko na szablonach systemu preferencji subskrypcji.

Moduły te pozwalają dostosować stronę, którą widzi odbiorca e-maila, gdy zarządza swoimi preferencjami subskrypcji lub wypisuje się z komunikacji e-mailowej.

Subscription preferences


Potwierdzenie aktualizacji subskrypcji

Moduł potwierdzania aktualizacji subskrypcji to moduł bogatego tekstu, który jest dostępny w szablonach systemu potwierdzania aktualizacji subskrypcji. Umożliwia on dostosowanie sposobu wyświetlania, gdy odbiorca wiadomości e-mail aktualizuje swoje ustawienia subskrypcji.

Subscription updates


Wyświetl jako stronę internetową

Moduł Widok jako strona WWWdaje odbiorcom wiadomości e-mail możliwość otwarciajej w wersji strony WWW.

HubSpot Help article screenshot