Korzystanie z modułów suwaków obrazu

Moduł suwaka obrazu umożliwia wyświetlanie wielu obrazów w tym samym module. Możesz ustawić automatyczne przełączanie obrazów lub wspierać odwiedzających w ręcznym przełączaniu się między nimi.

Dodawanie i edytowanie slajdów w modułach suwaków obrazów

1. Przejdź do zawartości:

   • Strony witryny: Na swoim koncie HubSpot przejdź do Treści > Strony witryny.
   • Strony docelowe: Na swoim koncie HubSpot przejdź do Treści > Strony docelowe.
   • Blog: Na swoim koncie HubSpot przejdź do Treści > Blog.
2. Kliknij nazwę swojej zawartości.
3. W edytorze treści kliknij ikonę add Dodaj na lewym pasku bocznym.
4. Kliknij, aby rozwinąć kategorię Media , a następnie kliknij moduł Image Slider i przeciągnij go na odpowiednią pozycję.
5. Na lewym pasku bocznym najedź kursorem na slajd i kliknij ikonę edit Edytuj , aby dodać obraz do tego slajdu:
   
   • W sekcji Obraz kliknij przycisk Prześlij , aby wybrać obraz z komputera lub Przeglądaj obrazy , aby wybrać obraz z narzędzia plików. Aby wygenerować obraz, kliknij przycisk Generate with AI.
   • W polu Podpis wprowadź podpis , który pojawi się pod obrazem. Aby wyświetlić obraz bez podpisu, usuń domyślny tekst.
   
   • Aby dodać łącze do slajdu:
     • Kliknij menu rozwijane Link do i wybierz typ łącza.
     • Określ miejsce docelowe łącza w wyświetlonym polu. Dowiedz się więcej o pracy z linkami w HubSpot.
     • Aby zachować otwartą zawartość i otworzyć łącze w nowym oknie, włącz przełącznik Otwórz łącze w nowym oknie .
     • Aby zidentyfikować miejsce docelowe linku jako niebędące częścią witryny dla wyszukiwarek, zaznacz pole wyboru No follow .
   • Kliknij przycisk Zastosuj zmiany , aby zapisać zmiany na tym slajdzie.
6. W górnej części edytora paska bocznego kliknij suwak obrazu , aby powrócić do przeglądu modułu.

7. Aby dodać więcej slajdów, najedź kursorem na inny slajd i kliknij ikonę edit Edytuj .
8. Aby sfinalizować zmiany, kliknij przycisk Zastosuj zmiany.

Edycja ustawień dla modułów suwaków obrazów

1. Przejdź do zawartości:

   • Strony witryny: Na swoim koncie HubSpot przejdź do Treści > Strony witryny.
   • Strony docelowe: Na swoim koncie HubSpot przejdź do Treści > Strony docelowe.
   • Blog: Na swoim koncie HubSpot przejdź do Treści > Blog.
2. Kliknij nazwę zawartości.
3. W edytorze zawartości kliknij moduł suwaka obrazu.
4. W edytorze paska bocznego kliknij Ustawienia , aby edytować ustawienia modułu.
5. Kliknij, aby rozwinąć sekcję Slajdy w celu edycji opcji slajdów:
   • W polu Slajdy na stronę wprowadź liczbę slajdów, które będą wyświetlane jednocześnie w suwaku obrazów. Jednocześnie można wyświetlić do pięciu slajdów. Po wybraniu wielu slajdów naraz podpisy i miniatury nie będą wyświetlane.
   • W polu Rozmiar obrazu wybierz opcję współczynnika proporcji. Domyślnie obrazy będą wyświetlane w przesłanych proporcjach. Aby ustandaryzować jeden współczynnik proporcji dla wszystkich obrazów, wybierz opcję Wymuś współczynnik proporcji. Może to spowodować zniekształcenie niektórych obrazów.
   • Aby dodać lub usunąć podpisy ze slajdów, zaznacz pole wyboru Pokaż podpisy. Domyślnie pole wyboru Pokaż podpisy jest zaznaczone.
   • W menu rozwijanym Pozycja podpisu wybierz pozycję podpisów.

6. Kliknij, aby rozwinąć sekcję Ruch w celu edycji opcji przejścia slajdu:
   • Aby skonfigurować sposób przejścia slajdów, wybierz opcję przejścia (np. Zanikanie).
   • Aby slajdy były powtarzane po osiągnięciu ostatniego slajdu, zaznacz pole wyboru Pętla slajdów .
   • Aby slajdy były wyświetlane automatycznie, zaznacz pole wyboru Autoodtwarzanie . Jeśli liczba slajdów jest mniejsza niż określona w ustawieniu Slajdy na stronę , cykliczne odtwarzanie nie będzie możliwe.
7. Kliknij, aby rozwinąć sekcję Nawigacja w celu edycji opcji nawigacji:
   • Aby wyświetlić strzałki umożliwiające odwiedzającym ręczne przełączanie się między slajdami, zaznacz pole wyboru Pokaż strzałki nawigacyjne .
   • Aby wyświetlać miniatury obrazów pod nawigacją, zaznacz pole wyboru Pokaż miniatury .
   • Aby wyświetlić kropki pod obrazami, które pokażą całkowitą liczbę slajdów i pozwolą odwiedzającym wybrać określony obraz, wybierz opcję Pokaż nawigację kropkową.
8. Po zakończeniu kliknij przycisk Zastosuj zmiany.

Edycja stylów dla modułów suwaków obrazów

Możesz edytować style modułów suwaków obrazów, w tym style slajdów, nawigacji i suwaka.

1. Przejdź do zawartości:

   • Strony witryny: Na swoim koncie HubSpot przejdź do Treści > Strony witryny.
   • Strony docelowe: Na swoim koncie HubSpot przejdź do Treści > Strony docelowe.
   • Blog: Na swoim koncie HubSpot przejdź do Treści > Blog.
2. Kliknij nazwę zawartości.
3. W edytorze treści kliknij moduł suwaka obrazu.
4. W edytorze paska bocznego kliknij kartę Style.
5. Aby kontynuować edycję stylów dla modułu suwaka obrazu, kliknij opcję Slajdy, Nawigacja lub Suwak.

Edycja stylów slajdów

Edytowanie stylów wyświetlania obrazów na slajdach:

1. Kliknij opcję Slajdy.
2. Kliknij, aby rozwinąć sekcję Obrazy .
3. Wprowadź wartości w pikselach w polu Promień narożnika . Im wyższa wartość, tym bardziej zaokrąglone będą narożniki.
4. Po zakończeniu kliknij przycisk Zastosuj zmiany.

Aby edytować style wyświetlania podpisów na slajdach:

1. Kliknij opcję Napisy.
2. Kliknij, aby rozwinąć sekcję Tło.
   • Aby dodać marginesy powyżej lub poniżej napisów, wprowadź wartości w pikselach w polach Margines powyżej i Margines poniżej .
   • Aby dodać wypełnienie do napisów, wprowadź wartość w pikselach w polu Wypełnienie . Aby dodać osobne wartości dla każdej strony, kliknij opcję Edytuj osobno, a następnie wprowadź wartości w pikselach w polach.
   • Aby dodać kolor tła do napisów, wprowadź wartość szesnastkową w pierwszym polu w sekcji Kolor lub kliknij próbnik kolorów i wybierz kolor. Kolory niestandardowe można dodawać na karcie Zaawansowane .
   • Aby ustawić przezroczystość koloru tła, wprowadź wartość procentową w drugim polu w sekcji Kolor . Przezroczystość 100% będzie nieprzezroczysta, a przezroczystość 0% nie będzie widoczna.
3. Kliknij, aby rozwinąć sekcję Tekst.
   • Aby zmienić typ czcionki, kliknij menu rozwijane Wybierz czcionkę i wybierz czcionkę.
   • Aby zmienić rozmiar czcionki, kliknij menu rozwijane Rozmiar i wybierz rozmiar czcionki.
   • Aby zmienić kolor czcionki, kliknij próbnik kolorów i wybierz kolor. Kolory niestandardowe można dodać na karcie Zaawansowane .
   • Aby zmienić grubość czcionki, kliknij ikonę grubości czcionki bold dla tekstu pogrubionego, italicIcon pochylonego lub underlineIcon podkreślonego.
4. Po zakończeniu kliknij przycisk Zastosuj zmiany.

Edytowanie stylów nawigacji

Można edytować style nawigacji, w tym strzałki suwaka, kropki i przycisk automatycznego odtwarzania oraz nawigację po miniaturach. Dostępne opcje stylizacji będą zależeć od ustawień modułu suwaka obrazu dla nawigacji.

Strzałki suwaka

1. Kliknij przycisk Nawigacja.
2. Kliknij, aby rozwinąć sekcję Strzałki suwaka.
3. Wprowadź wartość szesnastkową w sekcji Kolor tła. Możesz także kliknąć próbnik kolorów i wybrać kolor. Kolory niestandardowe można dodać na karcie Zaawansowane.
4. Aby ustawić przezroczystość koloru tła, wprowadź wartość procentową w drugim polu w sekcji Kolor tła. Na przykład przezroczystość 100% będzie nieprzezroczysta, a przezroczystość 0% nie będzie widoczna.
5. Aby zastąpić ikony używane dla lewej i prawej strzałki, kliknij przycisk Zastąp nad polami Lewa ikona i Prawa ikona. W prawym panelu wybierz ikonę.
6. Aby ustawić kolor lewej i prawej ikony, wprowadź wartość szesnastkową w pierwszym polu w sekcji Kolor ikony. Możesz także kliknąć próbnik kolorów i wybrać kolor. Niestandardowe kolory można dodać na karcie Zaawansowane.
7. Aby ustawić przezroczystość koloru tła ikony, wprowadź wartość procentową w drugim polu w sekcji Kolor ikon y. Na przykład przezroczystość 100% będzie nieprzezroczysta, a przezroczystość 0% nie będzie widoczna.
8. Po zakończeniu kliknij przycisk Zastosuj zmiany.

Kropki i przycisk autoodtwarzania

1. Kliknij, aby rozwinąć sekcję Kropki i przycisk autoodtwarzania.
2. Wprowadź wartość szesnastkową w pierwszym polu w sekcji Kolor lub kliknij próbnik kolorów i wybierz kolor. Kolory niestandardowe można dodać na karcie Zaawansowane.
3. Po zakończeniu kliknij przycisk Zastosuj zmiany.

Nawigacja po miniaturach

1. Kliknij, aby rozwinąć sekcję nawigacji miniatur.
2. Aby edytować kolor tła, wprowadź wartość szesnastkową w pierwszym polu w sekcji Kolor tła strzałki lub kliknij próbnik kolorów i wybierz kolor. Kolory niestandardowe można dodawać na karcie Zaawansowane .
3. Aby edytować przezroczystość koloru tła, wprowadź wartość procentową w drugim polu w sekcji Kolor tła strzałki. Przezroczystość 100% będzie nieprzezroczysta, a przezroczystość 0% nie będzie widoczna.
4. Aby zastąpić ikony używane dla strzałek w lewo i w prawo, kliknij przycisk Zastąp nad polami Ikona strzałki w lewo i Ikona strzałki w prawo . W prawym panelu wybierz ikonę.

5. Aby edytować kolor ikon lewej i prawej strzałki, wprowadź wartość szesnastkową w pierwszym polu w sekcji Kolor wypełnienia ikony strzałki. Możesz także kliknąć próbnik kolorów i wybrać kolor. Niestandardowe kolory można dodać na karcie Zaawansowane .
6. Aby ustawić przezroczystość strzałki, wprowadź wartość procentową w drugim polu w sekcji Kolor ikony . Na przykład przezroczystość 100% będzie nieprzezroczysta, a przezroczystość 0% nie będzie widoczna.
7. Aby edytować proporcje, szerokość i zaokrąglone rogi miniatur:
   • Kliknij, aby rozwinąć sekcję Miniatury obrazów .
   • Aby ustawić współczynnik proporcji używany dla wszystkich miniatur, kliknij menu rozwijane współczynnika propor cji i wybierz współczynnik proporcji.
   • Aby ustawić szerokość używaną dla wszystkich miniatur, wprowadź wartość w pikselach w polu Szerokość .
   • Aby ustawić zaokrąglenie rogów miniatur, wprowadź wartość w pikselach w polu Promień . Im wyższa wartość, tym bardziej zaokrąglone będą rogi.
8. Po zakończeniu kliknij przycisk Zastosuj zmiany.

Edycja stylów dla suwaka

1. Kliknij Suwak.
2. Kliknij, aby rozwinąć sekcję Odstępy .
3. Aby dodać marginesy powyżej i poniżej suwaka, wprowadź wartości w pikselach w polach Margines powyżej i Margines poniżej .
4. Aby dodać wypełnienie do suwaka, wprowadź wartość w pikselach w polu Wypełnienie . Aby dodać oddzielne wartości dla każdej strony, kliknij Edytuj osobno, a następnie wprowadź wartości w pikselach w polach.
5. Po zakończeniu kliknij przycisk Zastosuj zmiany.