Data ostatniej aktualizacji: listopada 22, 2021
Projektanci mogą budować szablony stron internetowych, landing page i blogów od podstaw za pomocą HTML. Możliwe jest również klon przekształcenie układu szablonu HubSpot na HTML i dostosowanie go do własnych potrzeb jako szablonu kodowanego.
- KontaCMS Hub Starter nie są w stanie używać niestandardowych zakodowanych szablonów dla stron docelowych.
- KontaMarketing Hub Professional i Enterprise mogą również tworzyć niestandardowe kodowane szablony wiadomości e-mail.
Ten artykuł zawiera informacje o tym, jak tworzyć i rozwiązywać problemy z niestandardowymi szablonami kodowanymi, a także o tym, co jest wymagane w szablonach HubSpot. Jeśli nie czujesz się komfortowo pracując z kodem, użyj jednego z gotowych szablonów na swoim koncie HubSpot lub sprawdź rynek szablonów do zakup gotowych szablonów.
Uwaga: niestandardowo kodowany szablon nie jest domyślnie responsywny. Współpracuj z profesjonalnym projektantem, aby upewnić się, że Twój szablon jest responsywny dla różnych rozmiarów ekranu.
Tworzenie nowego pliku HTML & HUBL
- W koncie HubSpot przejdź do Marketing > Pliki i szablony > Narzędzia do projektowania.
- W lewym pasku bocznym utwórz nowy plik, klikającPlik>Nowy plik.Może być konieczne kliknięcie ikona folderu aby rozwinąć wyszukiwarkę.
- W oknie dialogowym kliknij menu rozwijaneCo chciałbyś dzisiaj zbudować?i wybierzHTML & HUBL.
- KliknijDalej.
- Wprowadź szczegóły nowego pliku:
- WybierzSzablonlubSzablon częściowy. Szablon częściowy to szablon, który może być użyty w innych szablonach.
- W menu rozwijanym wybierz typ szablonu, który kodujesz (strona, blog lub email).
- Nadaj swojemu plikowi nazwę.
- Aby zaktualizować lokalizację pliku, w sekcjiLokalizacjapliku kliknij przyciskZmieńi wybierz folder, do którego chcesz dodać plik.
- Kliknij przyciskUtwórz.
- Napisz kod HTML dla swojej strony lub szablonu wiadomości e-mail.
- Aby zobaczyć, jak Twój HubL będzie renderować, kliknij, aby włączyć przełącznik Pokaż wyjście. Po prawej stronie otworzy się panel z podglądem renderowania.
- W prawym górnym rogu kliknij Podgląd, aby zobaczyć, jak Twój szablon będzie wyglądał i funkcjonował w edytorze treści. Ten podgląd jest synchronizowany z edytorem i będzie automatycznie odświeżany w trakcie pracy.
- W prawym górnym rogu kliknij przyciskOpublikuj zmiany
Aby uzyskać dodatkowe zasoby na temat niestandardowego projektowania, możesz zapoznać się zdokumentacją projektanta HubSpot. Znajduje się tam dodatkowadokumentacja dotycząca zakodowanych opcji modułu, takich jak znaczniki filtrów i ikony.
Dodaj wymagane znaczniki HubL
Zobaczysz komunikat o błędzie, jeśli w Twoim kodzie brakuje jakichkolwiek wymaganych znaczników HubL, jeśli spróbujesz opublikować plik.
Szablony stron internetowych, landing page i blogów wymagają następujących znaczników:
- {{standard_footer_includes}}
- {{standard_header_includes}}
- Dołącz ten token, który wciąga do sekcji unsubscribe CAN-SPAM: {{unsubscribe_section}}. Następnie dodaj te tokeny indywidualnie:
- {{site_settings.company_street_address_1}}
- {{site_settings.company_city}}
- {{site_settings.company_state}}
- {{site_settings.company_zip}}
- Przy tej metodzie nie będziesz miał możliwości formatowania języka i stylu tekstu oraz linków.
- Użyj tych tokenów indywidualnie..:
- {{site_settings.company_name}}
- {{unsubscribe_link}} lub {{unsubscribe_link_all}} (dołącz co najmniej jedno)
- {{unsubscribe_anchor}}
- {{site_settings.company_name}}
- {{site_settings.company_street_address_1}}
- {{site_settings.company_city}}}{{site_settings.company_state}}
- {{site_settings.company_zip}}
- Używanie tokenów indywidualnie pozwoli Ci na elastyczność w dodawaniu sformułowań wokół tokenów i linków oraz na formatowanie ich w pożądanym stylu i języku.
Klonowanie do HTML
Oprócz tworzenia szablonu od podstaw, możesz również sklonować jeden z szablonów HubSpot do formatu HTML. Klonowanie szablonu do HTML daje dostęp do zawartości HTML szablonu.
Aby utworzyć zakodowaną wersję istniejącego szablonu:
- W koncie HubSpot przejdź do Marketing > Pliki i szablony > Narzędzia do projektowania.
- KliknijAkcje>Klonujdo HTMLw oknie wyszukiwania. Plik HTML zostanie utworzony w tym samym folderze co plik oryginalny. Jego nazwa będzie zgodna z nazwą oryginalnego szablonu z dodaną do niejkopią.
