HubSpot Baza wiedzy

Dostosowywanie motywu bazy wiedzy

Autor: HubSpot Support | Oct 19, 2021 8:06:52 AM

Wygląd bazy wiedzy można dostosować, wybierając układ i konfigurując szablon w edytorze szablonów. Możesz także zobaczyć, jak motyw bazy wiedzy będzie wyświetlany na szablonach, w różnych językach i na różnych rozmiarach ekranu.

Zanim zaczniesz

Zanim rozpoczniesz pracę z tą funkcją, upewnij się, że w pełni rozumiesz, jakie kroki należy podjąć z wyprzedzeniem, a także ograniczenia funkcji i potencjalne konsekwencje jej używania.

Zrozumienie wymagań

Upewnij się, że masz jedno z następujących uprawnień użytkownika:

Poznaj ograniczenia i uwagi

  • Te narzędzia są dostępne tylko dla zmigrowanych baz wiedzy. Dowiedz się więcej o migracji bazy wiedzy.
  • W przypadku baz wiedzy, które nie zostały zmigrowane, dowiedz się więcej o tworzeniu i dostosowywaniu starszej bazy wiedzy.
  • Nie można dostosowywać bazy wiedzy w Menedżerze projektu ani używać niestandardowych motywów.

Wyświetl motyw bazy wiedzy

Po utworzeniu bazy wiedzy można wyświetlić wygląd szablonu w edytorze szablonów. Możesz zobaczyć, jak motyw wygląda w różnych szablonach, językach i rozmiarach ekranu.

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Motyw.
  2. Aby wyświetlić szablon z przykładową zawartością, kliknij menu rozwijane Wyświetl w lewym górnym rogu i wybierz szablon. Zmiany motywu zostaną zastosowane do wszystkich szablonów bazy wiedzy.

  1. Aby wyświetlić szablon w różnych językach, kliknij drugie menu rozwij ane w lewym górnym rogu i wybierz język.

  1. Aby zobaczyć, jak szablon będzie wyświetlany na różnych urządzeniach, kliknij ikony urządzeń w górnej części edytora lub wprowadź szerokość ekranu w pikselach.

Edytowanie kolorów, typografii i układu szablonu bazy wiedzy

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Motyw.
  2. Aby zmienić kolory motywu, kliknij, aby rozwinąć sekcję Kolory. Następnie wprowadź wartość szesnastkową lub wybierz kolor z próbnika kolorów dlapól Primary, Secondary, Accent i Body background . Dla każdej opcji wyświetlone zostanąkoloryTwojej marki.
  3. Aby zmienić typografię szablonu, kliknij opcję Typografia:
    • W sekcjach Primary i Secondarykliknij menu rozwijane czcionki i wybierz czcionkę. Aby zmienić kolor czcionki, kliknij próbnik kolorów i wybierz kolor czcionki. Dodatkowe opcje stylizacji czcionki (np. grubość czcionki, rozmiar czcionki lub wielkość liter) będą zależeć od wybranej czcionki.
    • Aby edytować typografię nagłówka, treści lub łącza, kliknij, aby rozwinąć sekcje Nagłówek (H1-H6), Treść lub Łącze:
      • Kliknij menu rozwijane czcionki i wybierz czcionkę. Dodatkowe opcje stylizacji czcionki (np. grubość czcionki, rozmiar czcionki lub wielkość liter) będą zależeć od wybranej czcionki.
      • Aby zmienić kolor czcionki, kliknij próbnik kolorów i wybierz kolor czcionki.
  4. Aby zmienić układ motywu, kliknij, aby rozwinąć sekcję Układ i wybierz opcję (np. Kafelki lub Minimalny). Różne opcje układu będą obsługiwać różne opcje stylizacji.
  5. Po zakończeniu kliknij przycisk Opublikuj motyw w prawym górnym rogu.

Edytowanie stylów nagłówka szablonu bazy wiedzy

Możesz edytować style nagłówka szablonu bazy wiedzy, w tym szerokość nagłówka, górny pasek, przełącznik języka, menu, przycisk i pasek wyszukiwania. Możesz także edytować kolory, czcionki i style najechania kursorem w tych elementach.

Szerokość nagłówka

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Motyw.
  2. Kliknij Nagłówek na lewym pasku bocznym.
  3. W sekcji Nagłówek wybierz opcję Pełna szerokość lub Szerokość treści.

Górny pasek nagłówka

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Motyw.
  2. Kliknij Nagłówek na lewym pasku bocznym.
  3. W sekcji Nagłówek kliknij, aby rozwinąć sekcję Górny pasek.
  4. Aby edytować kolor tła, wprowadź wartość kodu szesnastkowego lub wybierz kolor tła w próbniku kolorów w polu Kolor tła.
  5. Kliknij menu rozwijane czcionki i wybierz czcionkę. Dodatkowe opcje stylizacji czcionki (np. grubość czcionki, rozmiar czcionki lub wielkość liter) będą zależeć od wybranej czcionki.
  6. Aby zmienić kolor czcionki, kliknij próbnik kolorów i wybierz kolor czcionki.
  7. Po zakończeniu kliknij przycisk Opublikuj motyw w prawym górnym rogu.

Przełącznik języka nagłówka

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Motyw.
  2. Kliknij Nagłówek na lewym pasku bocznym.
  3. W sekcji Nagłówek kliknij Przełącznik języka.
  4. W sekcji Language Switcher kliknij Drop downs.
  5. Kliknij, aby rozwinąć sekcję Tło.
  6. Wprowadź wartość kodu szesnastkowego lub wybierz kolor w próbniku kolorów w polach Kolor i Najechanie kursorem.
  7. Aby edytować przezroczystość, wprowadź wartość procentową w drugim polu. Na przykład przezroczystość 100% będzie nieprzezroczysta, a przezroczystość 0% nie będzie widoczna.
  8. Po zakończeniu kliknij przycisk Opublikuj motyw w prawym górnym rogu.

Menu nagłówka

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Motyw.
  2. Kliknij Nagłówek na lewym pasku bocznym.
  3. W sekcji Nagłówek kliknij Menu.
  4. Aby edytować style rozwijanych menu, kliknij opcję Rozwijane menu:
    • Kliknij, aby rozwinąć sekcję Tło i wprowadź wartość kodu szesnastkowego lub wybierz kolor w próbniku kolorów dla pól Kolor i Najechanie. Aby edytować przezroczystość, wprowadź wartość procentową w drugim polu.
    • Kliknij, aby rozwinąć sekcję Tekst. Następnie kliknij menu rozwijane czcionki i wybierz czcionkę. Dodatkowe opcje stylizacji czcionki (np. grubość czcionki, rozmiar czcionki lub wielkość liter) będą zależeć od wybranej czcionki.
    • Aby zmienić kolor czcionki, kliknij próbnik kolorów i wybierz kolor czcionki.
  5. Aby edytować styl tekstu czcionki, kliknij, aby rozwinąć sekcję Tekst:
    • Kliknij menu rozwijane czcionki i wybierz czcionkę. Dodatkowe opcje stylizacji czcionki (np. grubość czcionki, rozmiar czcionki lub wielkość liter) będą zależeć od wybranej czcionki.
    • Aby zmienić kolor czcionki, kliknij próbnik kolorów i wybierz kolor czcionki.
  6. Aby edytować kolor tła, kliknij, aby rozwinąć sekcję Tło, a następnie wprowadź wartość kodu szesnastkowego lub wybierz kolor w próbniku kolorów.
  7. Po zakończeniu kliknij przycisk Opublikuj motyw w prawym górnym rogu.

Przyciski nagłówka

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Motyw.
  2. Kliknij Nagłówek na lewym pasku bocznym.
  3. W sekcji Nagłówek kliknij przycisk.
  4. Aby edytować czcionkę, kliknij, aby rozwinąć sekcję Tekst:
    • Kliknij menu rozwijane czcionki i wybierz czcionkę. Dodatkowe opcje stylizacji czcionki (np. grubość czcionki, rozmiar czcionki lub wielkość liter) będą zależeć od wybranej czcionki.
    • Aby zmienić kolor czcionki, kliknij próbnik kolorów i wybierz kolor czcionki.
  5. Aby edytować tło, kliknij, aby rozwinąć sekcję Tło i wprowadź wartość kodu szesnastkowego lub wybierz kolor w próbniku kolorów. Aby edytować przezroczystość, wprowadź wartość procentową.
  6. Aby edytować styl obramowania, kliknij, aby rozwinąć sekcję Obramowanie, kliknij menu rozwijane Styl i wybierz styl obramowania (np. Kreskowane).
  7. Aby edytować styl narożnika, kliknij, aby rozwinąć sekcję Narożnik. Następnie wprowadź wartość w pikselach (np. 30px) w polu Promień.
  8. Aby edytować styl najechania kursorem, kliknij opcję Najechanie kursorem:
    • Kliknij, aby rozwinąć sekcję Tekst.
      • Aby zmienić kolor czcionki, kliknij próbnik kolorów i wybierz kolor czcionki.
      • Aby zastosować style tekstu czcionki, wybierz ikonę kursywy italicizeIcon lub ikonę podkreślenia underlineIcon.
    • Kliknij, aby rozwinąć sekcję Tło i wprowadź wartość kodu szesnastkowego lub wybierz kolor w próbniku kolorów. Aby edytować przezroczystość, wprowadź wartość procentową.
    • Kliknij, aby rozwinąć sekcję Obramowanie, a następnie kliknij menu rozwijane Styl, aby wybrać styl obramowania (np. Kropkowany).
  9. Po zakończeniu kliknij przycisk Opublikuj motyw w prawym górnym rogu.

Pasek wyszukiwania w nagłówku

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Motyw.
  2. Kliknij Nagłówek na lewym pasku bocznym.
  3. W sekcji Nagłówek kliknij opcję Pasek wyszukiwania.
  4. Aby edytować tło, kliknij, aby rozwinąć sekcję Tło: a następnie kliknij menu rozwijane Typ tła, aby wybrać opcję (np. Kolor, Obraz lub Gradient). W zależności od wybranego typu tła wyświetlone zostaną dodatkowe opcje stylizacji.
  5. Aby edytować style tekstu etykiety, kliknij, aby rozwinąć sekcję Tekst etykiety :
    • Kliknij menu rozwijane czcionki i wybierz czcionkę. Dodatkowe opcje stylizacji czcionki (np. grubość czcionki, rozmiar czcionki lub wielkość liter) będą zależeć od wybranej czcionki.
    • Aby zmienić kolor czcionki, kliknij próbnik kolorów i wybierz kolor czcionki.
  6. Aby edytować styl czcionki wejściowej, kliknij, aby rozwinąć sekcję Wprowadzanie, a następnie wprowadź wartość kodu szesnastkowego lub kliknij próbnik kolorów, aby wybrać kolor. Aby edytować przezroczystość, wprowadź wartość procentową.
  7. Po zakończeniu kliknij przycisk Opublikuj motyw w prawym górnym rogu.

Edytowanie stylów stopki szablonu bazy wiedzy

Możesz edytować style stopki szablonu bazy wiedzy, w tym szerokość stopki, tło, menu, tekst i ikony społecznościowe. Możesz także edytować kolory, czcionki i style najechania kursorem w tych elementach.

Szerokość i tło stopki

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Motyw.
  2. Kliknij Stopka na lewym pasku bocznym.
  3. Aby zmienić szerokość stopki, wybierz opcję Pełna szerokość lub Szerokość treści w polu Szerokość stopki.
  4. Aby zmienić kolor tła stopki, wprowadź wartość kodu szesnastkowego lub kliknij próbnik kolorów, aby wybrać kolor.

Menu stopki

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Motyw.
  2. Kliknij Stopka na lewym pasku bocznym.
  3. W sekcji Stopka kliknij, aby rozwinąć sekcję Menu .
  4. Aby edytować style czcionek menu, kliknij menu rozwijane czcionek i wybierz czcionkę. Dodatkowe opcje stylizacji czcionki (np. grubość czcionki, rozmiar czcionki lub wielkość liter) będą zależeć od wybranej czcionki.
  5. Aby zmienić kolor czcionki, kliknij próbnik kolorów i wybierz kolor czcionki.
  6. Po zakończeniu kliknij przycisk Opublikuj motyw w prawym górnym rogu.

Tekst stopki

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Motyw.
  2. Kliknij Stopka na lewym pasku bocznym.
  3. W sekcji Stopka kliknij, aby rozwinąć sekcję Tekst .
  4. Aby edytować style czcionek menu, kliknij menu rozwijane czcionek i wybierz czcionkę. Dodatkowe opcje stylizacji czcionki (np. grubość czcionki, rozmiar czcionki lub wielkość liter) będą zależeć od wybranej czcionki.
  5. Aby zmienić kolor czcionki, kliknij próbnik kolorów i wybierz kolor czcionki.
  6. Po zakończeniu kliknij przycisk Opublikuj motyw w prawym górnym rogu.

Ikony społecznościowe w stopce

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Motyw.
  2. Kliknij Stopka na lewym pasku bocznym.
  3. W sekcji Stopka kliknij, aby rozwinąć sekcję Ikony społecznościowe.
  4. Aby zmienić rozmiar ikon społecznościowych, kliknij menu rozwijane Rozmiar ikony i wybierz opcję (np. Mały, Zwykły lub Duży).
  5. Aby zmienić kształt ikon społecznościowych, kliknij menu rozwijane Kształt ikony i wybierz opcję (np. Okrąg lub Kwadrat).
  6. Aby zmienić kolor ikon społecznościowych, wprowadź wartość kodu szesnastkowego lub kliknij próbnik kolorów, aby wybrać kolor w polu Kolor ikony.
  7. Aby zmienić kolor tła ikon społecznościowych, wprowadź wartość kodu sz esnastkowego lub kliknij próbnik kolorów, aby wybrać kolor w polu Tło. Aby edytować przezroczystość, wprowadź wartość procentową.
  8. Aby zmienić wyrównanie ikon społecznościowych, kliknij przycisk blockAlignmentLeftIcon Wyrównaj do lewej, blockAlignmentCenterIcon Wyrównaj do środka lub blockAlignmentRightIcon Wyrównajdo prawej w polu Wyrównanie.
  9. Po zakończeniu kliknij przycisk Opublikuj motyw w prawym górnym rogu.

Edytowanie zawartości motywu bazy wiedzy

Zawartość nagłówka i stopki bazy wiedzy można edytować. Opublikowane zmiany będą widoczne na wszystkich stronach bazy wiedzy.

Zawartość nagłówka

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Nagłówek.
  2. W globalnym edytorze treści kliknij ikonę siteTree content na lewym pasku bocznym.
  3. Na lewym pasku bocznym kliknij moduł nagłówka witryny.
  4. Aby edytować zawartość logo nagłówka, kliknij, aby rozwinąć sekcję Logo:
    • Aby zastąpić domyślne logo, włącz przełącznik Zastąp domyślne logo lub kliknij Edytuj domyślne logo w tej domenie, aby zaktualizować domyślne logo.
    • Jeśli wybrano opcję zastąpienia domyślnego logo, można kliknąć przycisk Prześlij lub Przeglądaj obrazy, aby dodać nowe logo.
    • Aby wyświetlić nazwę firmy, gdy logo nie jest ustawione, włącz przełącznik Pokaż nazwę firmy, gdy logo nie jest ustawione.
    • Aby dodać link URL do logo, wprowadź adres URL w polu Link.
    • Kliknij Zastosuj opcje, aby zobaczyć wprowadzone zmiany.
  5. Aby edytować zawartość menu nagłówka, kliknij, aby rozwinąć sekcję Menu:
    • Aby wyświetlić menu nagłówka, kliknij menu rozwijane Menu i wybierz menu.
    • Aby edytować istniejące menu nagłówka, kliknij Edytuj.
    • Aby utworzyć nowe menu nagłówka, kliknij przycisk Utwórz nowe.
    • Aby edytować liczbę elementów podrzędnych drzewa menu, które mogą być wyświetlane w menu nagłówka, użyj ikon zwiększania upIcon i zmniejszania downIcon w polu Max levels.
    • Kliknij przycisk Zastosuj opcje, aby zobaczyć wprowadzone zmiany.
  6. Aby edytować zawartość przycisku nagłówka, kliknij przycisk:
    • Aby dodać przycisk do nagłówka, zaznacz pole wyboru Dodaj przycisk.
    • Aby edytować tekst przycisku w nagłówku, wprowadź tekst w polu Tekst przycisku.
    • Aby edytować link URL przycisku, kliknij menu rozwijane Link do i wybierz opcję (np. Zewnętrzny). W zależności od wybranej opcji wyświetlone zostaną dodatkowe pola.
    • Aby łącze URL przycisku otwierało się w nowym oknie, włącz przełącznik Otwórz łącze w nowym oknie.
    • Aby edytować typ łącza przycisku, zaznacz pole wyboru obok opcji Nie śledź.
    • Aby dodać ikonę do przycisku, zaznacz pole wyboru Dodaj ikonę:
      • Kliknij przycisk Zamień, aby zmienić ikonę przycisku.
      • Kliknij menu rozwijane Pozycja i wybierz pozycję ikony przycisku.
    • Kliknij przycisk Zastosuj opcje, aby zobaczyć wprowadzone zmiany.
  7. Aby edytować zawartość przełącznika języka, kliknij, aby rozwinąć sekcję Przełącznik języka:
    • Aby dodać przełącznik języka do nagłówka, zaznacz pole wyboru Dodaj przełącznik języka .
    • Aby edytować tryb wyświetlania przełącznika języka, kliknij menu rozwijane Tryb wyświetlania i wybierz opcję (np. Zlokalizowany, PageLang, Hybrydowy).
    • Kliknij przycisk Zastosuj opcje, aby zobaczyć wprowadzone zmiany.
  8. Aby edytować zawartość dodatkowych opcji wsparcia, kliknij, aby rozwinąć sekcję Dodatkowe opcje wsparcia:
    • Aby wyświetlić łącze portalu klienta, włącz przełącznik Pokaż łącze portalu klienta. W polu Customer portal link text wprowadź tekst, który będzie wyświetlany odwiedzającym.
    • Aby wyświetlić logowanie do ograniczonej zawartości, włącz przełącznik Pokaż logowanie do ograniczonej zawartości. W polach Sign-in link text i Sign-out link text wprowadź tekst, który będzie wyświetlany odwiedzającym.
    • Aby wyświetlić formularz pomocy technicznej, włącz przełącznik Formularz pomocy technicznej, a następnie wybierz formularz z menu rozwijanego Formularz. W polach Support form text link i Support form title wprowadź tekst, który będzie wyświetlany odwiedzającym.
    • Kliknij opcję Zastosuj, aby zobaczyć wprowadzone zmiany.
  9. Po zakończeniu kliknij przycisk Opublikuj w zasobach [#] w prawym górnym rogu.

Zawartość stopki

  1. W prawym górnym rogu kliknij menu rozwijane Konfiguruj i wybierz Stopka.
  2. W globalnym edytorze treści kliknij ikonę zawartości siteTree na lewym pasku bocznym.
  3. Aby wyświetlić menu stopki, kliknij moduł Menu stopki:
    • Kliknij menu rozwijane Menu i wybierz menu.
    • Aby edytować istniejące menu stopki, kliknij Edytuj.
    • Aby utworzyć nowe menu stopki, kliknij przycisk Utwórz nowe.
    • Aby edytować liczbę elementów podrzędnych drzewa menu, które mogą być wyświetlane w menu stopki, użyj ikon zwiększania upIcon i zmniejszania downIcon w polu Głębokość wyświetlania menu .
    • Aby wyświetlić menu stopki, zaznacz pole wyboru Pokaż menu.
    • Kliknij przycisk Zastosuj opcje, aby zobaczyć wprowadzone zmiany.
  4. Aby edytować zawartość logo stopki, kliknij moduł Logo:
    • Aby zastąpić domyślne logo, włącz przełącznik Zastąp domyślne logo lub kliknij Edytuj domyślne logo w tej domenie, aby zaktualizować domyślne logo.
    • Jeśli wybrano opcję zastąpienia domyślnego logo, można kliknąć przycisk Prześlij lub Przeglądaj obrazy, aby dodać nowe logo.
    • Aby dostosować sposób ładowania logo stopki, kliknij menu rozwijane Ładowanie obrazu i wybierz opcję Domyślne w przeglądarce, Leniwe lub Chętne.
    • Aby dodać link URL do logo stopki, wprowadź tekst adresu URL w polu Link URL.
    • Kliknij przycisk Zastosuj opcje, aby zobaczyć wprowadzone zmiany.
  5. Aby edytować zawartość adresu stopki, kliknij moduł Adres stopki:
    • Kliknij Edytuj w widoku rozszerzonym.
    • W globalnym edytorze treści wprowadź tekst adresu stopki.
    • Kliknij przycisk Zamknij widok rozszerzony na lewym pasku bocznym.
  6. Aby edytować zawartość stopki dla obserwujących w mediach społecznościowych, kliknij moduł Obserwujący w mediach społecznościowych:
    • W sekcji Linki społecznościowe kliknij ikonę editIcon edytuj lub deleteIcon usuń, aby edytować lub usunąć istniejący link społecznościowy. Aby dodać łącze społecznościowe, kliknij przycisk + Dodaj .
    • Aby wyświetlić ikony obserwujących, zaznacz pole wyboru Pokaż ikony.
  7. Aby edytować treść praw autorskich w stopce, kliknij moduł praw autorskich w stopce:
    • Kliknij Edytuj w widoku rozszerzonym.
    • W globalnym edytorze treści wprowadź tekst praw autorskich stopki.
    • Kliknij przycisk Zamknij widok rozszerzony na lewym pasku bocznym.
  8. Po zakończeniu kliknij przycisk Opublikuj do [#] zasobów w prawym górnym rogu.