Karuzela – rotator / slider / baner

Właścwości elementu „Karuzela”

Element "Karuzela" wypełnia całą szerokość roboczej części strony i zwykle sytuowany jest u jej szczytu. Może pełnić formę informacyjną wraz z przekierowaniem użytkownika do docelowej strony lub z pominięciem przekierowania.

Składa się z grafiki, tekstu nagłówka, uzupełniającego tekstu pod nagłówkiem oraz linku (jeżeli slajd ma przenosić użytkownika w docelowe miejsce).

Podczas wyświetlania strony w trybie komórkowym dodatkowy tekst pod nagłowkiem jest pomijany, zatem nie zaleca się umieszczać w tym polu kluczowych informacji, których użytkownik komórkowy mógłby nie przeczytać.

Pole nagłowka posiada limit znaków. Długie tytuły zostaną automatycznie ograniczone.

Dodawanie karuzeli do strony

  1. W trybie „Strona” należy wybrać docelową stronę, na której ma zostać umieszczony rotator.
  2. Kliknąć przycisk „Treść”, w oknie wybrać kartę „Interaktywne” oraz element „Karuzela”.

Tworzenie slajdów karuzeli

Po utworzeniu elementu „Karuzela” należy wypełnić go treścią.

  1. Należy kliknąć w przycisk „+ Utwórz nowy”. Spowoduje to utworzenie nowego slajdu karuzeli.
  2. W polu „Pole identyfikacyjne (tekst niewidoczny na stronie)” wpisać roboczą nazwę pozwalającą łatwiej nawigować elementami w przypadku większej liczby slajdów (pole obowiązkowe).
  3. W polu „Nagłówek” wpisać tytuł slajdu, który będzie widoczny na stronie obok zdjęcia (pole nieobowiązkowe i slajd będzie widoczny mimo pozostawienia tego pola pustego.).
  4. W polu „Tekst” można dodać tekst typu „lead” (pole nieobowiązkowe). Podczas wyświetlania strony w trybie komórkowym dodatkowy tekst pod nagłowkiem jest pomijany, zatem nie zaleca się umieszczać w tym polu kluczowych informacji, których użytkownik komórkowy mógłby nie przeczytać.

 

5. Dodawanie grafiki

  • Należy wybrać grafikę klikając przycisk „Dodaj obraz” w sekcji „Obraz”.
    Rotator wykorzystuje poziomą grafikę w formacie 16x9 (zalecane fullHD, 1920x1080 px, kompresja nie mniej niż 80%, format JPG).
  • W dostępnych folderach należy wyszukać potrzebną grafikę i kliknąć w jej nazwę. W oknie dialogowym pojawią się nowe pola („Tytuł”, „Tekst alternatywny”) oraz miniatury wskazanej grafiki prezentujące ją na różnych typach urządzeń.
  • Niezbędne jest dodanie tekstu alternatywnego opisującego prezentowaną grafikę, jeżeli ta nie została uprzednio nadana podczas transferu grafiki na serwer. Standardy dostępności internetowej w AGH zawierają wytyczne poprawnego redagowania tekstów alternatywnych.
    Pole „Tytuł” może pozostać puste.
  • Grafika może zostać wykadrowana przy pomocy wewnętrznego edytora. Należy kliknąć w przycisk „Otwórz edytor”. Dla każdego z typów urządzeń smartphone(mobile)/tablet/desktop można ustalić inny kadr zdjęcia. Aby to zrobić należy wskazać dany typ urządzenia, a następnie przystąpić do kadrowania. Klikając w węzeł i przeciągając myszą nadaje się nowy kadr grafiki.
  • Po zakończeniu edycji ilustracji, aby zmiany weszły w życie, należy kliknąć w przycisk „Akceptuj”.

6.    Dodawanie linku do slajdu

  • Należy kliknąć w przycisk z ikoną łańcucha po prawej stronie okna dialogowego sekcji „Link”;
  • Klikając w odpowiednią kartę wybrać typ linku (Strona/Plik/Katalog/Zewnętrzny URL/Email/Telefon).
    • Dla istniejących podstron serwisu należy wybrać kartę „Strona” i wyszukać ją w strukturze serwisu widocznej po lewej stronie oka dialogowego. Przed kliknięciem w docelową stronę należy nadać tytuł linku w dedykowanym polu „Tytuł”.
    • Dla zewnętrznych linków należy wybrać kartę „Zewnętrzny URL”. W polu URL należy wlać pełen adres z typem protokołu np. https://agh.edu.pl
      Przed kliknięciem w przycisk „Ustaw odsyłacz” należy nadać tytuł linku w dedykowanym polu „Tytuł”.

Po wypełnieniu wymaganych pól formularza pojedynczego elementu karuzeli, dodaniu jego grafiki oraz linku należy kliknąć w przycisk „Zapisz” u góry strony. Pierwszy slajd karuzeli pojawi się na stronie.

Włączanie/wyłączanie oraz kolejność slajdów

Aby wyłączyć slajd karuzeli należy kliknąć przycisk z ikoną suwaka na belce przypisanej do danego slajdu. Aby włączyć widoczność slajdu należy ponownie kliknąć w ikonę suwaka.

Aby zmienić kolejność wyświetlania slajdów należy złapać kursorem przycisk z trzema poziomymi kreskami tzw „hamburger” znajdujący się po prawej stronie na końcu listy ikon belki danego slajdu i trzymając wciśnięty przycisk myszy przesunąć element w górę lub dół. Można także użyć przycisków z symbolami strzałka w górę / strzałka w dół. Kliknięcie spowoduje przestawienie slajdu o jedno miejsce w zadaną stronę.
 

 

Wróć do listy instrukcji Typo3