Zależy Ci na nowoczesnym wyglądzie strony internetowej opartej na CMS Joomla? No pewnie, że tak! Dobrze się składa, że na rynku jest pewne rozszerzenie dla tego Systemu, które pozwoli Ci uatrakcyjnić witrynę. LayerSlider – bo o nim mowa, to kolejny popularny dodatek do Joomli, który potrafi zaoferować niesamowite efekty, każdemu potencjalnemu użytkownikowi.

Tylko jak skonfigurować Layer Slidera dla CMS Joomla?

Przedstawiamy tylko elementarne informacje oraz podstawową funkcjonalność na temat Layer Slider dla CMS Joomla! 

 

Jak dostać się do Layer Slider?

Aby wejść do Layer Slider należy zalogować się na swoją stronę, po czym należy z górnego menu wybrać KomponentyLayer Slider

 

Tworzenie pierwszego i kolejnego slajdu

Aby dodać pierwszy slajd należy kliknąć opcję Add New Slider, podać nazwę, a na końcu kliknąć przycisk na niebieskim tle Add slider

 

Wygląd Slidera – prezentacja na stronie, zmiana nazwy

Po stworzeniu pierwszego slajdu lub edytowaniu w górnej zakładce SLIDER SETTINGS LAYOUT można wybrać sposób prezentacji slidera na stronie. Są 4 opcję:

  1. Fixed size – Sztywny rozmiar slidera podany w pixelach – width – szerokość, height – wysokość
  2. Responsive – Rozmiar responsywny, zmienny w zależności do rozdzielczości wyświetlacza
  3. Full width – pełna szerokośc, slider dopasuje się do szerokości wyświetlacza
  4. Full size – slider dopasuje się do szerokości jak i wysokości wyświetlacza zajmując cały ekran

Zmiana nazwy slidera jest powyżej powyższymi opcji, podłużne pole tekstowe.

Aby zapisać dokonane zmiany należy odnaleźć niebieski przycisk z napisem Save Changes.

 

Dodawanie zdjęcia oraz tekstu do slidera

Aby dostać się do miejsca w którym można dodawać zdjęcia do slidera oraz tekst należy wejść do wcześniej stworzonego slajdera, odnaleźć SLIDES, jest to opcja w górnej części, zaraz nad zminą nazwy slidera.

Aby dodać zdjęcie należy odnaleźć opcję CLICK TO SET w zakładce Image w dolnej części ekranu.

W tym miejscu wybrać zdjęcie które jest już wgrane na serwer lub dopiero je wgrać wybierając je z komputera, klikając opcję Wybierz pliki, a następnie Rozpocznij wczytywanie. Wczytywanie zwróci odpowiedni komunikat. Po wgraniu należy je odnaleźć, zaznaczyć i wcisnąć przysik Wstaw.

Po wstawieniu zdjęcie powinno się wyświetlić na ekranie. Jeśli się wyświetli, można dowolnie przemieszczać jego ułożenie oraz dopasować rozmiar. Aby zapisać dokonane zmiany należy odnaleźć niebieski przycisk z napisem Save Changes

Aby dodać do slajdera warstwę (zdjęcie, tekst, kod HTML, czy film) należy kliknąć Add New, pojawi się nowa pozycja której od razu można zmienić nazwę klikając w pole tekstowe z jego nazwą. Można także ukryć wartstę klikając na ikonę oka. Aby wybrać czym ma być dana wartstwa trzeba dodać nową, zaznaczyć ją i wybrać tym – Image, Text, HTML...

Wybierjąc text można zadecydować jak będzie prezentowany – Paragraf, H1, H2… a poniżej tekst który ma wyświetlić się na slajdzie

Od razu po wpisaniu tekst wyświetli się na slajdzie.

Można go rozciągać, zwężać, ustawiać jego miejsce na slajdzie.

Formatowanie tekstu można ustawić w zakładce Styles

Poniżej przedstawienie jak wygląda dodanie HTML do slidera

Dla każdego poszczególnego slajdu można ustawić po jakim czasie ma się zmienić wpisując czas w ms do Time Shift. Czas w milisekundach to nic innego jak przelicznik 1000ms = 1s

Można także ustawić efekt przejścia klikając Select transitions i wybrać jeden z wielu dostępnych

Tak wygląda zarządzanie pojedynczym zdjęciem w slajdzie. Aby zmodyfikować inne zdjęcie znajdujące się slajderze lub dodać całkowicie nowe, wystarczy skorzystać z kart powyżej zdjęcia do przełączania się między slajdami.

Aby dodać nowe zdjęcia do slajdu, wystarczy kliknąć zielony plus, zaraz koło numerów slajdu, bądź zaznaczyć Duplicate slide, do skopiowania już istniejącego.