2017-06-06 |  admin
GB flag PL flag

Editor (plugin)

Ten dodatek jest jednym z najważniejszych w systemie Altego. Umożliwia on edycję treści w sposób zbliżony do obsługi programu Microsoft Office Word.

Poniżej znajduję się wykaz oraz instrukcje do najważniejszych funkcji tego pluginu. Jeśli chcesz przejść do konkretnego tematu - skorzystaj z odnośników umieszczonych w spisie treści.

Za jego pomocą możesz edytować treść w następujących modułach:

  • HTML TEMPLATES (predefiniowane schematy kodu html),
  • PARTIAL (kafelki),
  • PAGE (strony,
  • Inne pola z możliwością formatowania tekstu.

Standardowo Editor dostępny jest wersji angielskiej, a jego wygląd prezentuje się w sposób zbliżony do tego na poniższym obrazie.

overal previes of plg_editor

W zależności od wersji systemu Altego - wygląd może się różnić.

Formatowanie tekstu

Podstawowe formaty dostępne są na pierwszym pasku. Możesz wybrać kolor tekstu, tła, jego grubość i pochylenie, a także położenie. Dostępne są także listy oraz wcięcia.

Całość systemu oparta jest o Framework Bootstrap 4 dlatego zaleca się używanie przygotowanych formatów z rozwijanego menu "formats", aby zachować spójność z Twoją skórką i konwencjami tego frameworka.

Wstawianie linku

Drugi pasek zadań posiada często używane komponenty. Należa do nich linki, czyli tzw. odsyłacze, które pozwalają na przejście do innej strony.

Aby dodać taki przełącznik - należy zaznaczyć tekst lub bezpośrednio kliknąć ikonę dodawania jak na obrazku:

Adding links.

Następnie pojawi się okno, gdzie należy wpisać adres url pod który ma prowadzić przełącznik, tekst który ma się wyświetlać oraz opcjonalnie treść podpowiedzi (text to display) i okno w którym ma się wyświetlić nowa strona (target).

Add new anchor.

Dla linków zewnętrznych (tj. strony z innych domen), zaleca się przekierowywanie w nowej karcie (new window).

Jeśli chcesz odesłać użytkownika do podstrony Twojego serwisu - nie musisz wpisywać całej scieżki. Wystarczy, że podasz wartość "slum" strony.

Anchor

Jest to tzw. krótki odsyłacz. Należy podać nazwę, aby oznaczyć miejsce w danej stronie. Aby umożliwić użytkownikowi "skok" do wybranej sekcji - należy wstawić link i w miejscu url wpisać wcześniej wprowadzoną nazwę, poprzedzając ją znakiem #. Możesz także po prostu wybrać "anchor" z rozwijanego menu.

Adding anchor.

Aby przetestować działanie "krótkich odsyłaczy" - kliknij tutaj.

Wstawianie obrazu

Aby wstawić obraz należy kliknąć ikonę "insert/edit image" z drugiego paska zadań.

Add image.

Pojawi się okno dialogowe z kilkoma pozycjami do uzupełnienia. Najważniejszą z nich jest ścieżka do naszego obrazka (source). Można wskazać relatywną sciężkę do naszego pliku obrazkowego lub cały adres. Przy każdym oknie edytora dostępny jest przycisk do menadżera plików, gdzie można znaleźć interesujący nas plik oraz skopiować jego scieżkę.

Dobrą praktyką jest podawanie lokalizacji plików mieszczących się na naszym serwerze, bowiem plik z zewnętrznych źródeł może zostać zmodyfikowany lub usunięty, a wtedy treść na naszej stronie nie bedzie zgodna z założeniami (przejdź do tej strony, aby zobaczyć jak wgrać pliki za pomocą modułu "file manager").

Add image - dialog window.

Pole image description, zawiera informacje istotne z punktu widzenia SEO. Zaleca się opisanie obrazka, aby Google lepiej zaindeksowało treść naszej strony.

Uzupełniając pola dimensions - można określić wymiary obrazka (możliwe jest także ręczne ustawienie rozmiaru za pomocą suwaka na kraju podglądu).

Kolejnym ważnym polem jest tzw. klasa (pole class), które umożliwia przypisanie cech dla obrazka. Wyróżniamy następujące typy:

  • RWD (zalecane) - obraz jest skalowany w zależności od urządzenia na którym przeglądana jest witryny,
  • Thumbnail (miniaturka) - dodaje obramowanie,
  • Rounded (zaokrąglenie),
  • Left - przesuń do lewej,
  • Right - przesuń do prawej.

Wstawianie filmu

Proces jest bardzo zbliżony do procesu wstawiania obrazu. Aby dodać film należy użyć ikony mieszczącej się bezpośrednio po prawej stronie od ikony dodawania obrazu. Pojawi się okno dialogowe, gdzie należy wskazać źródło pliku wideo (source).

Video description.

Możesz podać bezpośrednią sciężkę lub skorzystać z menadżera plików. Jeśli posiadasz kod np. z YouTube'a tzw. embed, możesz go wkleić w zakładce embed.

Uwaga! Tag video akceptuje tylko następujące formaty plików wideo: mp4, ogg, webM.