Jak posługiwać się edytorem treści

Transkrypt

1 Jak posługiwać się edytorem treści Edytor CKE jest bardzo prostym narzędziem pomagającym osobom niezaznajomionym z językiem HTML w tworzeniu interaktywnych treści stron internetowych. Razem z praktyka przychodzi umiejętność odkrywania coraz to nowych możliwości edytora, nie wszystkie jednak są potrzebne, aby zarządzać podstawową treścią strony. Ważne Przeklejanie z Word-a lub innych procesorów tekstowych innych niż notatnik jest niebezpieczne z punktu widzenia wyświetlania treści. Strona ma zunifikowany sposób wyświetlania, aby wszystko wyglądało estetycznie i spójnie. Niestety kopiowanie treści bezpośrednio z Worda może zakłócić to, ponieważ dołącza on do tak wklejonego tekstu opis swojego formatowania, zmieniając np.: krój czcionki, kolory, rozmiary. Dlatego należy przeklejać tekst najpierw do notatnika, a potem do edytora, albo przeklejać go za pomocą przycisku 'Wklej jako czysty tekst'. Przyjrzyjmy się przyciskom edytora: Zwrócę uwagę na kilka przycisków: Źródło HTML jeśli znasz się na HTML-u kliknięcie w ten przycisk umożliwi Ci bezpośrednią edycję kodu Wyczyść formatowanie przycisk przydatny jeśli chcemy usunąć wszelkie formatowanie zaznaczonej części tekstu Wstaw obraz wstawianie obrazków w treści tekstu Format na tej liście określamy czy fragment jest paragrafem czy nagłówkiem Utwórz/zmień link tworzenie i zarządzanie linkami Ogólnie edytora używamy tak jak każdego innego po wprowadzeniu zmian musimy jednak pamiętać, aby kliknąć przycisk 'zapisz' w przeciwnym przypadku zmiany nie zostaną zapisane.

2 Zamieszczanie obrazka Aby zamieścić w treści strony obrazek należy ustawić kursor we właściwym miejscu oraz kliknąć przycisk 'Obrazek' Pojawi się poniższy ekran: Na tym ekranie widzimy od razu najważniejsze dla nas opcje: Adres URL tutaj możemy ręcznie wpisać adres www obrazka do pokazania Przycisk Przeglądaj przycisk przenoszący nas do skryptu umożliwiającego przesłanie obrazka z naszego komputera na serwer Szerokość/wysokość rozmiary wyświetlanego obrazka, domyślnie automatycznie wpisują się tu oryginalne rozmiary obrazka Wyrównaj parametr określający jak tekst ma oblewać obrazek; w oknie podglądu jesteśmy w stanie zobaczyć jak będzie wyglądało wybrane oblewanie; najczęściej używane: do prawej, do lewej Przesyłanie grafiki na serwer Jeśli klikniemy na przycisk 'Przeglądaj' otworzy się okienko ze skryptem umożliwiającym przesłanie grafiki na serwer. W oknie tym znajdziemy również wszystkie pliki dotychczas wysłane. Przesyłamy plik klikająć przycisk 'wyślij'. Dany plik wybieramy klikając na niego dwukrotnie.

3 Ważne Jeśli dany obrazek ma być wyświetlany z boku i oblany tekstem należy pamiętać, aby po dodaniu go do treści kliknąć na niego ponownie i z listy 'Styl' wybrać opcję do której strony obrazek jest przesunięty. Ta informacja pomoże systemowi dodać odpowiednie marginesy aby tekst nie dochodził bezpośrednio do krawędzi obrazka. Tworzenie z obrazka linku do powiększonego obrazka Najczęściej obrazki zamieszczamy w formie miniatury, aby użytkownik po kliknięciu mógł obejrzeć powiększony obrazek. W tym celu najlepiej jest mieć przygotowane 2 wersje tego samego obrazka: miniaturkę i powiększenie. Możemy też jednak poradzić sobie z samym powiększeniem. Wstawiamy obrazek do treści jak opisane powyżej. Jeśli posługujemy się tylko powiększeniem pamiętajmy, aby wpisać ręcznie mniejszą szerokość/wysokość obrazka, aby pojawił się na stronie zmniejszony Klikamy na obrazek w edytorze a następnie na przycik 'Wstaw/edytuj hiperłącze' Pojawi nam się następujący ekran: Klikamy na przycisk 'Przeglądaj'. Ponownie uruchomi nam się skrypt do przesyłania plików na serwer.

4 Jeśli posługujemy się miniaturą, przesyłamy plik z powiększonym obrazkiem i wybieramy go poprzez dwukrotne kliknięcie. Jeśli posługujemy się tylko powiększeniem, klikamy dwukrotnie na przesłany wcześniej plik. Krok 3 jeśli chcemy, aby obraz był podpisany Na ekranie 'Hiperłącze' przechodzimy do zakładki 'Zaawansowane' W polu 'Opis obiektu docelowego' wpisujemy podpis jaki ma się pojawić pod obrazkiem. Klikamy OK, zapisujemy zmiany i możemy podejrzeć jak efekt naszej pracy wygląda na stronie. System automatycznie podpina skrypt do pokazywani obrazków bez przeładowania strony. Jeśli obrazek miał podpis, pokaże się on po kliknięciu w obrazek, albo po najechaniu na miniaturę. Tworzenie linku do pliku do ściągnięcia z serwera Jeśli do artykułu chcemy załączyć np.: dokument PDF, możemy to zrobić również za pomocą edytora. Na ekranie (którego podgląd możemy zobaczyć na poprzedniej stronie) klikamy przycisk 'Przeglądaj'. Przesyłamy na serwer plik, który chcemy udostępnić do ściągnięcia oraz klikamy go 2-krotnie Krok 3 Klikamy OK i zapisujemy zmiany Tworzenie linku do innej strony Jeśli chcemy stworzyć standardowy link, postępujemy następująco:

5 W polu adres URL wpisujemy adres www strony do której linkujemy tekst. Ważne Jeśli link wskazuje na zewnętrzną stronę należy wkleić jego pełen adres, natomiast jeśli wskazuje na podstronę naszej strony najlepiej jest wkleić tylko część adresu po nazwie naszej domeny ze znakiem / na początku. np.: zamiast adresu wklejamy tylko /p-1/aktualnosci Tworzenie linku do adresu Jeśli chcemy stworzyć link do adresu , postępujemy następująco: Z listy 'Typ hiperłącza' wybieramy opcję 'Adres ' Krok 3 W pole adres wpisujemy adres do jakiego ma prowadzić link. Opcjonalnie możemy wpisać temat i treść jakie się automatycznie wpiszą.