- Podręcznik użytkownika programu Dreamweaver
- Wprowadzenie
- Program Dreamweaver a platforma Creative Cloud
- Synchronizowanie ustawień programu Dreamweaver z chmurą Creative Cloud
- Biblioteki Creative Cloud w programie Dreamweaver
- Używanie plików programu Photoshop w programie Dreamweaver
- Praca z programami Adobe Animate oraz Dreamweaver
- Wydzielanie przygotowanych do wyświetlania w Internecie plików SVG z bibliotek
- Przestrzenie robocze i widoki w programie Dreamweaver
- Konfigurowanie serwisów
- Informacje o serwisach programu Dreamweaver
- Konfigurowanie lokalnej wersji serwisu
- Nawiązywanie połączenia z serwerem publikacji
- Konfigurowanie serwera testowego
- Importowanie i eksportowanie ustawień serwisu programu Dreamweaver
- Przenoszenie istniejących serwisów z serwera zdalnego do lokalnego katalogu głównego serwisu
- Funkcje ułatwień dostępu w programie Dreamweaver
- Ustawienia zaawansowane
- Ustawianie preferencji serwisu dotyczących transferu plików
- Określanie ustawień serwera proxy w programie Dreamweaver
- Synchronizowanie ustawień programu Dreamweaver z chmurą Creative Cloud
- Korzystanie z systemu Git w programie Dreamweaver
- Zarządzanie plikami
- Tworzenie i otwieranie plików
- Zarządzanie plikami i folderami
- Odbieranie plików i wysyłanie ich na serwer
- Pobieranie plików do edycji i odkładanie ich na serwer
- Synchronizacja plików
- Porównywanie plików w poszukiwaniu różnic
- Maskowanie plików i folderów w serwisie programu Dreamweaver
- Włączanie funkcji Uwagi do projektu w serwisach programu Dreamweaver
- Zapobieganie potencjalnemu obejściu funkcji Gatekeeper
- Układ i projekt
- Korzystanie z wizualnych pomocy do układu
- Informacje o tworzeniu układu strony za pomocą stylów CSS
- Projektowanie elastycznych serwisów WWW z użyciem struktury Bootstrap
- Tworzenie i używanie zapytań o media w programie Dreamweaver
- Prezentacja zawartości za pomocą tabel
- Kolory
- Tworzenie reagujących projektów za pomocą układów elastycznej siatki
- Narzędzie Extract w programie Dreamweaver
- CSS
- Podstawowe informacje o stylach CSS
- Tworzenie układu strony za pomocą panelu Projektant CSS
- Korzystanie z preprocesorów CSS w programie Dreamweaver
- Ustawianie preferencji stylów CSS w programie Dreamweaver
- Przenoszenie reguł CSS w programie Dreamweaver
- Konwertowanie stylu CSS wewnątrz znacznika na regułę CSS w programie Dreamweaver
- Posługiwanie się znacznikami DIV
- Stosowanie gradientów na tło
- Tworzenie i edytowanie efektów przejść CSS3 w programie Dreamweaver
- Formatowanie kodu
- Zawartość strony i zasoby
- Ustawianie właściwości strony
- Ustawianie właściwości CSS dla nagłówków i łączy
- Praca z tekstem
- Znajdowanie i zastępowanie tekstu, znaczników i atrybutów
- Panel DOM
- Edytowanie w widoku aktywnym
- Kodowanie znaków dokumentu w programie Dreamweaver
- Zaznaczanie i wyświetlanie elementów w oknie Dokument
- Ustawianie właściwości tekstu na panelu Inspektor właściwości
- Sprawdzanie pisowni na stronie internetowej
- Używanie linii poziomych w programie Dreamweaver
- Dodawanie i modyfikowanie kombinacji czcionek w programie Dreamweaver
- Praca z zasobami
- Wstawianie i aktualizowanie dat w programie Dreamweaver
- Tworzenie list ulubionych zasobów w programie Dreamweaver i zarządzanie nimi
- Wstawianie i edytowanie obrazów w programie Dreamweaver
- Dodawanie obiektów multimedialnych
- Dodawanie zawartości wideo w programie Dreamweaver
- Wstawianie wideo HTML5
- Wstawianie plików SWF
- Dodawanie efektów dźwiękowych
- Wstawianie obiektów audio HTML5 w programie Dreamweaver
- Praca z elementami bibliotek
- Stosowanie pisma arabskiego i hebrajskiego w programie Dreamweaver
- Łączenie i przeglądanie
- Efekty i widgety jQuery
- Tworzenie kodu serwisów WWW
- Informacje o tworzeniu kodu w programie Dreamweaver
- Środowisko programistyczne w programie Dreamweaver
- Ustawianie preferencji kodowania
- Dostosowywanie ustawień kolorowania kodu
- Pisanie i edytowanie kodu
- Podpowiedzi i uzupełnianie kodu
- Zwijanie i rozwijanie kodu
- Ponowne wykorzystywanie fragmentów kodu za pomocą funkcji Urywki
- Linting: oczyszczanie kodu z błędów
- Optymalizacja kodu
- Edytowanie kodu w widoku Projekt
- Praca z zawartością znacznika HEAD strony
- Wstawianie dołączeń po stronie serwera w programie Dreamweaver
- Korzystanie z bibliotek znaczników w programie Dreamweaver
- Importowanie własnych znaczników do programu Dreamweaver
- Używanie zachowań JavaScript (instrukcje ogólne)
- Stosowanie wbudowanych zachowań JavaScript
- Omówienie języków XML i XSLT
- Wykonywanie transformacji XSL po stronie serwera w programie Dreamweaver
- Wykonywanie przekształceń XSL po stronie klienta w programie Dreamweaver
- Dodawanie encji znaków w kodzie XSLT w programie Dreamweaver
- Formatowanie kodu
- Obiegi pracy związane z wieloma produktami
- Instalowanie i używanie rozszerzeń programu Dreamweaver
- Aktualizacje w aplikacji w programie Dreamweaver
- Wstawianie dokumentów Microsoft Office w programie Dreamweaver (tylko Windows)
- Praca z programami Fireworks i Dreamweaver
- Edycja zawartości w stronach programu Dreamweaver za pomocą aplikacji Contribute
- Integracja programu Dreamweaver z aplikacją Business Catalyst
- Tworzenie spersonalizowanych kampanii rozsyłanych pocztą elektroniczną
- Szablony
- Informacje o szablonach programu Dreamweaver
- Rozpoznawanie szablonów oraz dokumentów opartych na szablonach
- Tworzenie szablonu programu Dreamweaver
- Tworzenie edytowalnych regionów w szablonach
- Tworzenie powtarzalnych regionów i tabel w programie Dreamweaver
- Używanie regionów opcjonalnych w szablonach
- Definiowanie edytowalnych atrybutów znacznika w programie Dreamweaver
- Tworzenie zagnieżdżonych szablonów w programie Dreamweaver
- Edytowanie, aktualizowanie i usuwanie szablonów
- Eksportowanie i importowanie zawartości XML w programie Dreamweaver
- Stosowanie szablonu lub usuwanie go z istniejącego dokumentu
- Edycja zawartości w szablonach programu Dreamweaver
- Reguły składni dla znaczników szablonu w programie Dreamweaver
- Ustawianie preferencji podświetlenia dla regionów szablonów
- Korzyści wynikające z używania szablonów w programie Dreamweaver
- Urządzenia mobilne i obsługa wielu ekranów
- Dynamiczne serwisy, strony i formularze WWW
- Podstawowe informacje o aplikacjach internetowych
- Konfigurowanie komputera do programowania aplikacji
- Rozwiązywanie problemów z połączeniami z bazą danych
- Usuwanie skryptów połączenia w programie Dreamweaver
- Projektowanie stron dynamicznych
- Omówienie źródeł zawartości dynamicznej
- Definiowanie źródeł zawartości dynamicznej
- Dodawanie dynamicznej zawartości do stron
- Modyfikowanie dynamicznej zawartości w programie Dreamweaver
- Wyświetlanie rekordów z bazy danych
- Udostępnianie aktywnych danych w programie Dreamweaver oraz rozwiązywanie problemów z takimi danymi
- Dodawanie własnych zachowań serwerowych w programie Dreamweaver
- Tworzenie formularzy w programie Dreamweaver
- Zbieranie informacji od użytkowników za pomocą formularzy
- Tworzenie oraz włączanie formularzy ColdFusion w programie Dreamweaver
- Tworzenie formularzy WWW
- Rozszerzona obsługa elementów formularza w języku HTML5
- Tworzenie formularzy za pomocą programu Dreamweaver
- Tworzenie aplikacji metodą graficzną
- Tworzenie stron wzorca i szczegółów w programie Dreamweaver
- Tworzenie stron wyszukiwania i wyników
- Tworzenie strony wstawiania rekordów
- Tworzenie strony uaktualniania rekordów w programie Dreamweaver
- Tworzenie stron usuwania rekordów w programie Dreamweaver
- Używanie poleceń ASP do modyfikacji bazy danych w programie Dreamweaver
- Tworzenie strony rejestracji
- Tworzenie strony logowania
- Tworzenie strony, do której dostęp będą mieli tylko uwierzytelnieni użytkownicy
- Zabezpieczanie folderów w aplikacji ColdFusion za pomocą programu Dreamweaver
- Korzystanie ze składników ColdFusion w programie Dreamweaver
- Testowanie, podgląd i publikacja serwisów WWW
- Rozwiązywanie problemów
Interfejs użytkownika w programie Dreamweaver i nowszych wersjach został uproszczony. Dlatego począwszy od wersji Dreamweaver niektóre opcje opisane w tym artykule mogą nie być dostępne. Więcej informacji zawiera ten artykuł.
Informacje o własnych zachowaniach serwerowych
Program Dreamweaver zawiera zestaw wbudowanych zachowań serwerowych, które ułatwiają uzupełnianie serwisu o dynamiczne funkcje. Zakres funkcji programu Dreamweaver można rozszerzyć, tworząc zachowania serwerowe dostosowane do potrzeb użytkownika lub uzyskując takie zachowania z serwisu Dreamweaver Exchange.
Zanim utworzysz własne zachowania serwerowe, warto sprawdzić, czy w serwisie Dreamweaver Exchange nie opublikowano już zachowania oferującego funkcje, jakie chcesz dodać do swojego serwisu WWW. Niezależni programiści często tworzą i testują zachowania serwerowe, które mogą spełnić wymagania użytkowników.
Dostęp do serwisu Dreamweaver Exchange
-
W programie Dreamweaver dostęp do serwisu Dreamweaver Exchange można uzyskać na jeden z następujących sposobów:
Wybierz polecenie Pomoc > Dreamweaver Exchange.
Wybierz polecenie Okno > Zachowania serwerowe. Kliknij przycisk Plus (+) i wybierz polecenie Pobierz więcej zachowań serwerowych.
W przeglądarce zostanie otwarta strona Dreamweaver Exchange.
-
Zaloguj się do serwisu Exchange, używając swojego identyfikatora Adobe ID. Jeżeli nie masz jeszcze identyfikatora Dreamweaver Exchange, wykonaj podane instrukcje, aby utworzyć konto w serwisie Adobe.
Instalowanie zachowania serwerowego lub innego rozszerzenia w programie Dreamweaver
-
Uruchom Menedżera rozszerzeń, wybierając Polecenia > Zarządzaj rozszerzeniami.
-
W Menedżerze rozszerzeń wybierz polecenie Plik > Instaluj pakiet.
Więcej informacji znajduje się w części Korzystanie z Menedżera rozszerzeń.
Obieg pracy przy tworzeniu własnych zachowań serwerowych
Programiści biegle posługujący się technologiami ColdFusion, JavaScript, VBScript lub PHP mogą tworzyć własne zachowania serwerowe. Zachowania serwerowe tworzy się, wykonując następujące zadania:
Napisz bloki kodu, które wykonują wymagane działanie.
Określ, w którym miejscu w kodzie HTML strony należy wstawić dany blok kodu.
Jeżeli zachowanie serwerowe wymaga podania wartości dla parametru, utwórz okno dialogowe, które monituje programistę korzystającego z zachowania o podanie stosownej wartości.
Przetestuj zachowanie serwerowe zanim udostępnisz je innym.
Korzystanie z Konstruktora zachowań serwerowych
Za pomocą Konstruktora zachowań serwerowych możesz dodać bloki kodu, które będą wstawiane na stronie przez zachowanie.
-
Otwórz panel Zachowania serwerowe (Okno > Zachowania serwerowe) i kliknij przycisk Plus (+). Wybierz polecenie Nowe zachowanie serwerowe.
-
Z wyskakującego menu Typ dokumentu wybierz rodzaj dokumentu, dla którego tworzysz zachowanie serwerowe.
-
W polu Nazwa wpisz nazwę zachowania serwerowego.
-
(Opcjonalnie) Aby skopiować istniejące zachowanie serwerowe i dodać je do nowo tworzonego zachowania, wybierz opcję Kopiuj istniejące zachowanie serwerowe, a potem wybierz to zachowanie serwerowe z wyskakującego menu Zachowanie do skopiowania. Kliknij przycisk OK.
Wyświetli się okno dialogowe Konstruktor zachowań serwerowych.
-
Aby dodać nowy blok kodu, kliknij przycisk Plus (+), wpisz nazwę tego bloku kodu i kliknij przycisk OK.
Wpisana przez ciebie nazwa pojawi się w Konstruktorze zachowań serwerowych, a w polu z blokiem kodu wyświetlone zostaną odpowiednie znaczniki skryptów.
-
W polu Blok kodu wpisz kod wykonywalny, służący do wdrażania zachowania serwerowego.Uwaga:
Wpisując kod w polu Blok kodu, można wstawić tylko jeden znacznik lub blok kodu dla każdego nazwanego bloku (np. myBehavior_block1, myBehavior_block2, myBehavior_blockn itd.). Jeżeli musisz wpisać wiele znaczników lub bloków kodu, utwórz dla każdego z nich osobny blok. Możesz również kopiować i wklejać kod z innych stron.
-
Umieść punkt wstawiania w tym miejscu w bloku kodu, gdzie chcesz wstawić parametr, albo zaznacz ciąg, który ma zostać zastąpiony parametrem.
-
Kliknij przycisk Wstaw parametry w bloku kodu.
-
Wpisz nazwę parametru w polu Nazwa parametru (np. Sesja) i kliknij przycisk OK.
Parametr zostanie wstawiony w bloku kodu w tym miejscu, w którym przed jego zdefiniowaniem znajdował się punkt wstawiania. Jeżeli zaznaczony jest jakiś ciąg, to każde wystąpienie tego ciągu w bloku kodu zostanie zastąpione symbolami parametru (np. @@Sesja@@).
-
Z wyskakującego menu Wstaw kod wybierz polecenie określające, gdzie mają zostać osadzone bloki kodu.
-
(Opcjonalnie) Aby podać dodatkowe informacje o zachowaniu serwerowym, kliknij przycisk Zaawansowane.
-
Aby utworzyć kolejne bloki kodu, powtórz kroki 5–11.
-
Jeżeli zachowanie serwerowe wymaga parametrów, musisz utworzyć okno dialogowe przyjmujące parametry od osoby stosującej to zachowanie. Zobacz łącze poniżej.
-
Po wykonaniu niezbędnych kroków i utworzeniu zachowania serwerowego, kliknij przycisk OK.
Zachowanie pojawi się na liście w panelu Zachowania serwerowe.
-
Przetestuj zachowanie, aby sprawdzić, czy prawidłowo działa.
Opcje zaawansowane
Po określeniu kodu źródłowego i wskazaniu miejsca wstawiania każdego bloku kodu, zachowanie serwerowe jest gotowe. W większości przypadków nie trzeba podawać żadnych innych informacji.
Zaawansowani użytkownicy mogą ustawić także poniższe opcje:
Identyfikator
Określa, czy blok kodu ma być traktowany jak identyfikator.
Domyślnie każdy blok kodu jest identyfikatorem. Jeśli program Dreamweaver znajdzie w dokumencie blok kodu będący identyfikatorem, umieszcza dane zachowanie w panelu Zachowania serwerowe. Użyj opcji Identyfikator, aby określić, czy blok kodu ma być traktowany jako identyfikator.
Przynajmniej jeden blok kodu zachowania serwerowego musi być identyfikatorem. Blok kodu nie powinien być identyfikatorem, jeżeli zachodzi jeden z następujących warunków: inne zachowanie serwerowe korzysta z tego samego bloku kodu lub blok kodu jest tak prosty, że może w sposób naturalny wystąpić na stronie.
Tytuł zachowania serwerowego
Określa tytuł zachowania w panelu Zachowania serwerowe.
Gdy projektant strony kliknie przycisk Plus (+) w panelu Zachowania serwerowe, w wyskakującym menu pojawi się ten właśnie tytuł zachowania serwerowego. Gdy projektant zastosuje instancję zachowania serwerowego w dokumencie, to zachowanie to pojawi się na liście użytych zachowań w panelu Zachowania serwerowe. Za pomocą pola Tytuł zachowania serwerowego możesz określić zawartość wyskakującego menu Plus (+) i listy użytych zachowań.
Początkowo w polu tym znajduje się nazwa podana w oknie dialogowym Nowe zachowanie serwerowe. Po zdefiniowaniu parametrów nazwa ta jest automatycznie uaktualniana. Za nazwą zachowania serwerowego podawane są parametry ujęte w nawiasy.
Set Session Variable (@@Name@@, @@Value@@)
Jeżeli użytkownik zaakceptuje domyślną wartość, w wyskakującym menu Plus (+) będzie się pojawiać cały ciąg przed nawiasami (np. Ustaw zmienną sesji). Nazwa wraz z parametrami będzie widoczna na liście użytych zachowań, np. Ustaw zmienną sesji ("abcd", "5").
Blok kodu do zaznaczenia
Określa, który blok kodu ma zostać wybrany, gdy użytkownik zaznaczy to zachowanie w panelu Zachowania serwerowe.
Gdy stosuje się zachowanie serwerowe, jeden z bloków kodu w tym zachowaniu jest wyznaczany jako „blok kodu do zaznaczenia”. Jeśli zastosujesz zachowanie serwerowe, a potem zaznaczysz je w panelu Zachowania serwerowe, to w oknie Dokument zaznaczony zostanie ten właśnie blok. Domyślnie program Dreamweaver zaznacza pierwszy blok kodu, który nie znajduje się ponad znacznikiem html. Jeżeli wszystkie bloki kodu znajdują się przed znacznikiem html, to zaznaczany będzie pierwszy blok. Zaawansowani użytkownicy mogą określić, który blok kodu ma być zaznaczany.
Tworzenie bloków kodu
Bloki kodu tworzone w Konstruktorze zachowań serwerowych znajdują się w zachowaniu serwerowym, które pojawia się w panelu Zachowania serwerowe. Może to być dowolny kod wykonywalny dozwolony w wybranym modelu serwerowym. Np. jeżeli wybierzesz ColdFusion jako typ dokumentu dla swojego zachowania serwerowego, to wpisany kod musi być prawidłowym kodem ColdFusion, wykonywanym na serwerze aplikacji ColdFusion.
Bloki kodu możesz tworzyć bezpośrednio w Konstruktorze zachowań serwerowych albo kopiować kod z innych źródeł i wklejać. Każdy blok kodu utworzony w Konstruktorze zachowań serwerowych musi być pojedynczym blokiem znacznika lub skryptu. Jeśli musisz wstawić wiele bloków znaczników, podziel je na osobne bloki kodu.
Warunki w blokach kodu
Program Dreamweaver umożliwia programowanie bloków kodu, zawierających instrukcje sterujące, które są wykonywane warunkowo. Konstruktor zachowań serwerowych używa instrukcji if, elseif oraz else i może również zawierać parametry zachowań serwerowych. Umożliwia to wstawianie alternatywnych bloków tekstu w zależności od wartości parametrów zachowania serwerowego LUB relacji między tymi parametrami.
Poniższy przykład przedstawia wykorzystanie instrukcji if, elseif i else. Nawiasy kwadratowe ([ ]) oznaczają kod opcjonalny, a gwiazdka (*) oznacza zero lub więcej instancji. Aby wykonać część albo całość bloku kodu tylko wtedy, gdy zajdą pewne warunki, użyj następującej składni:
<@ if (expression1) @> conditional text1[<@ elseif (expression2) @> conditional text2]*[<@ else @> conditional text3]<@ endif @>
Wyrażeniami warunkowymi mogą być dowolne wyrażenia JavaScript, których wartość można ocenić za pomocą funkcji eval() języka JavaScript. Mogą zawierać parametr zachowania serwerowego, oznaczony symbolami @@. (Znaki @@ odróżniają parametry od zmiennych i słów kluczowych języka JavaScript).
Efektywne stosowanie wyrażeń warunkowych
Jeśli używa się dyrektyw if, else i elseif wewnątrz znacznika XML insertText, to zawarty w niej tekst jest wstępnie przetwarzany w celu rozwiązania dyrektyw if i sprawdzenia, który tekst ma zostać zwrócony jako wynik. Dyrektywy if i elseif przyjmują wyrażenie jako argument. Wyrażenie warunkowe jest takie samo jak w przypadku wyrażeń warunkowych języka JavaScript i może również zawierać parametry zachowań serwerowych. Takie dyrektywy umożliwiają wybór alternatywnych kodów bloku na podstawie wartości parametrów zachowania serwerowego albo relacji między tymi parametrami.
Na przykład poniższy kod JSP pochodzi z zachowania serwerowego programu Dreamweaver, które używa warunkowego bloku kodu:
@@rsName@@.close(); <@ if (@@callableName@@ != '') @> @@callableName@@.execute(); @@rsName@@ = @@callableName@@.getResultSet();<@ else @> @@rsName@@ = Statement@@rsName@@.executeQuery(); <@ endif @> @@rsName@@_hasData = @@rsName@@.next();
Warunkowy blok kodu rozpoczyna się od <@ if (@@callableName@@ != '') @> i kończy się na <@ endif @>. Zgodnie z kodem, jeśli użytkownik wpisze wartość dla parametru @@callableName@@ w oknie dialogowym zachowań serwerowych Parametr — innymi słowami, jeśli wartość parametru @@callableName@@ nie jest ustawiona na null, lub (@@callableName@@ != '') — warunkowy blok kodu jest zastępowany następującymi instrukcjami:
@@callableName@@.execute(); @@rsName@@ = @@callableName@@.getResultSet();
W innym przypadku warunkowy blok kodu jest zastępowany następującą instrukcją:
@@rsName@@ = Statement@@rsName@@.executeQuery();
Określanie położenia bloku kodu
Tworząc bloki kodu za pomocą Konstruktora zachowań serwerowych musisz określić, gdzie te bloki mają być wstawiane do kodu HTML strony.
Np. jeśli wstawisz blok kodu nad otwierającym znacznikiem <html>, to musisz potem określić położenie tego bloku kodu względem innych znaczników, skryptów i zachowań serwerowych, które występują w tej sekcji kodu HTML strony. Typowe przykłady to m. in. umieszczanie zachowania przed zapytaniami o zestawy rekordów albo po nich, które mogą występować na stronie przed otwierającym znacznikiem <html>.
Gdy wybierzesz opcję położenia z wyskakującego menu Wstaw kod, opcje dostępne w menu Pozycja względem zmieniają się w opcje stosowne dla danej części strony. Np. jeśli z wyskakującego menu Wstaw kod wybierzesz opcję Nad znacznikiem <html>, to polecenia dostępne w menu Położenie względem będą odzwierciedlać opcje położenia mające zastosowanie w tej części strony.
Poniższa tabela przedstawia opcje wstawiania bloków kodu oraz dostępne dla każdej z nich opcje położenia względnego:
Opcje wstawiania kodu |
Opcje położenia względnego |
Nad znacznikiem <html> |
|
Pod znacznikiem </html> |
|
Względem konkretnego znacznika |
Wybierz znacznik z wyskakującego menu Znacznik, a następnie wybierz jedną z opcji położenia. |
Względem zaznaczenia |
Przed zaznaczeniem Za zaznaczeniem Zastąp zaznaczenie Otocz zaznaczenie |
Aby wybrać położenie niestandardowe, musisz przypisać wagę do bloku kodu. Opcji Położenie niestandardowe używaj wtedy, gdy musisz wstawić kilka bloków kodu w określonej kolejności. Np. aby wstawić uporządkowaną serię trzech bloków kodu za blokami otwierającymi zestawy rekordów, trzeba wpisać wagę 60 dla pierwszego bloku, 65 dla drugiego i 70 dla trzeciego.
Program Dreamweaver domyślnie przypisuje wagę 50 wszystkim blokom kodu otwierającym zestawy rekordów, które znajdują się nad znacznikiem <html>. Jeśli kilka rekordów ma taką samą wagę, program Dreamweaver ustawia ich kolejność losowo.
Określanie położenia bloku kodu (instrukcje ogólne)
-
Napisz blok kodu w Konstruktorze zachowań serwerowych.
-
Z menu Wstaw kod w oknie dialogowym Konstruktor zachowań serwerowych wybierz położenie, w którym ma zostać wstawiony blok kodu.
-
W oknie dialogowym Konstruktor zachowań serwerowych wybierz położenie względne w stosunku do tego, które zostało wybrane z menu Wstaw kod.
-
Jeżeli to już koniec twojej pracy nad blokiem kodu, kliknij przycisk OK.
Zachowanie serwerowe zostanie wymienione w panelu Zachowania serwerowe (Okno > Zachowania serwerowe). Kliknij przycisk Plus (+), aby je wyświetlić.
-
Przetestuj zachowanie, aby sprawdzić, czy prawidłowo działa.
Określanie pozycji bloku kodu względem innego znacznika na stronie
-
Z wyskakującego menu Wstaw kod wybierz polecenie Względem konkretnego znacznika.
-
W polu Znacznik wpisz znacznik lub wybierz go z wyskakującego menu.
Jeśli użytkownik wprowadzi znacznik, nie należy go otaczać ostrymi nawiasami (<>).
-
Określ pozycję względem tego znacznika, wybierając jedną z opcji z wyskakującego menu Położenie względem.
Określanie pozycji bloku kodu względem znacznika wybieranego przez autora strony
-
Z wyskakującego menu Wstaw kod wybierz polecenie Względem zaznaczenia.
-
Określ pozycję względem zaznaczenia, wybierając jedną z opcji z wyskakującego menu Położenie względem.
Blok kodu można wstawiać tuż przed lub tuż za zaznaczeniem. Można także zastępować zaznaczenie blokiem kodu albo umieścić blok kodu wokół zaznaczenia.
Aby można było otoczyć zaznaczenie blokiem kodu, musi ono zawierać znacznik otwierający i zamykający oraz nic innego pomiędzy nimi:
<CFIF Day=”Monday”></CFIF>
Wstaw fragment kodu ze znacznikiem otwierającym przed znacznikiem otwierającym zaznaczenie, a fragment kodu ze znacznikiem zamykającym za znacznikiem zamykającym zaznaczenie.
Powtarzanie bloków kodu za pomocą dyrektywy loop
Aby powtórzyć fragment lub całość bloku kodu kilka razy, użyj następującej składni:
<@ loop (@@param1@@,@@param2@@) @> code block<@ endloop @>
Tworząc zachowania serwerowe, można tworzyć pętle za pomocą dyrektywy loop, aby powtórzyć blok kodu określoną liczbę razy. <@ loop (@@param1@@,@@param2@@,@@param3@@,@@param_n@@) @> blok kodu <@ endloop @>Dyrektywa loop przyjmuje jako argumenty rozdzielaną przecinkami listę tablic parametrów. W tym przypadku tablice parametrów w argumentach umożliwiają użytkownikowi podawanie wielu wartości dla jednego parametru. Powtarzalny tekst jest powielany n razy, gdzie n to długość tablicy parametrów. Jeżeli podany zostanie więcej niż jeden argument z tablicą parametrów, to wszystkie tablice muszą mieć tę samą długość. Przy i-tym przebiegu pętli, i-te elementy z tablic parametrów zastępują skojarzone z nimi instancje parametrów w bloku kodu.
Tworząc okno dialogowe dla zachowania serwerowego, możesz dodać do niego format, który umożliwi projektantowi strony tworzenie tablic parametrów. Program Dreamweaver udostępnia prosty formant tablicy, który można wykorzystać przy tworzeniu okien dialogowych. Nosi on nazwę Pole tekstowe z listą rozdzielaną przecinkami i jest dostępny w Konstruktorze zachowań serwerowych. Aby utworzyć bardziej złożone elementy interfejsu użytkownika, zapoznaj się z dokumentacją API dotyczącą tworzenia okien dialogowych z formantami pozwalającymi na wstawianie tablic (jak np. formant siatki).
W dyrektywie warunkowej można zagnieździć dowolną liczbę warunków lub pętli. Np. możesz określić, że pętla ma być wykonywana, gdy wyrażenie będzie prawdziwe.
Poniższy przykład przedstawia sposób wykorzystania powtarzalnych bloków kodu przy tworzeniu zachowań serwerowych. Jest to zachowanie ColdFusion, służące do przywoływania procedury składowanej:
<@ loop (@@param1@@,@@param2@@,@@param3@@,@@param_n@@) @> code block <@ endloop @>
<CFSTOREDPROC procedure="AddNewBook" datasource=#MM_connection_DSN# username=#MM_connection_USERNAME# password=#MM_connection_PASSWORD#> <CFPROCPARAM type="IN" dbvarname="@CategoryId" value="#Form.CategoryID#" cfsqltype="CF_SQL_INTEGER"> <CFPROCPARAM type="IN" dbvarname="@ISBN" value="#Form.ISBN#" cfsqltype="CF_SQL_VARCHAR"> </CFSTOREDPROC>
W tym przykładzie znacznik CFSTOREDPROC może zawierać 0 lub więcej znaczników CFPROCPARAM. Jednak bez dyrektywy loop tworzącej pętlę nie można byłoby umieścić tych znaczników CFPROCPARAM we wstawionym znaczniku CFSTOREDPROC. Jeżeli ktoś chciałby stworzyć takie zachowanie serwerowe bez użycia dyrektywy loop, musiałby podzielić kod z przykładu na dwie części udziałowe: główny znacznik CFSTOREDPROC oraz znacznik CFPROCPARAM, którego typ udziałowy to 'multiple' (wiele).
Natomiast korzystając z dyrektywy loop, można zapisać tę samą procedurę następująco:
<CFSTOREDPROC procedure="@@procedure@@" datasource=#MM_@@conn@@_DSN# username=#MM_@@conn@@_USERNAME# password=#MM_@@conn@@_PASSWORD#> <@ loop (@@paramName@@,@@value@@,@@type@@) @> <CFPROCPARAM type="IN" dbvarname="@@paramName@@" value="@@value@@" cfsqltype="@@type@@"> <@ endloop @> </CFSTOREDPROC>
Nowe wiersze za każdym ciągiem „@>” są ignorowane.
Jeśli użytkownik wpisałby w oknie dialogowym Konstruktor zachowań serwerowych następujące wartości parametrów:
procedure = "proc1" conn = "connection1" paramName = ["@CategoryId", "@Year", "@ISBN"] value = ["#Form.CategoryId#", "#Form.Year#", "#Form.ISBN#"] type = ["CF_SQL_INTEGER", "CF_SQL_INTEGER", "CF_SQL_VARCHAR"]
to zachowanie serwerowe wstawiłoby na stronie następujący kod wykonywalny:
<CFSTOREDPROC procedure="proc1" datasource=#MM_connection1_DSN# username=#MM_connection1_USERNAME# password=#MM_connection1_PASSWORD#> <CFPROCPARAM type="IN" dbvarname="@CategoryId" value="#Form.CategoryId#" cfsqltype="CF_SQL_INTEGER"> <CFPROCPARAM type="IN" dbvarname="@Year" value="#Form.Year#" cfsqltype="CF_SQL_INTEGER"> <CFPROCPARAM type="IN" dbvarname="@ISBN" value="#Form.ISBN#" cfsqltype="CF_SQL_VARCHAR"> </CFSTOREDPROC>
Tablic parametrów nie można używać poza pętlą. Wyjątek stanowi użycie ich w wyrażeniu związanym z dyrektywą warunkową.
Korzystanie ze zmiennych _length oraz _index w dyrektywie LOOP
Dyrektywa loop zawiera dwie wbudowane zmienne, których można używać na potrzeby osadzonych warunków if. Są to następujące zmienne: _length oraz _index. Zmienna _length bada długość tablic przetwarzanych przez dyrektywę loop, natomiast zmienna _index podaje bieżącą wartość indeksu dyrektywy loop. Aby te zmienne były rozpoznawane wyłącznie jako dyrektywy, a nie jako parametry do przekazania do pętli, nie otaczaj ich symbolami @@.
Wbudowanych zmiennych można użyć np. w odniesieniu do atrybutu import dla dyrektywy page. Atrybut import wymaga pakietów rozdzielanych przecinkami. Jeżeli dyrektywa loop obejmuje cały atrybut import, to nazwę atrybutu import= trzeba wysyłać tylko w pierwszej iteracji pętli – łącznie z zamykającym cudzysłowem (”) – i nie można wysyłać przecinka po ostatnim powtórzeniu pętli. Korzystając ze zmiennej wbudowanej, można sformułować następujące wyrażenie:
<@loop (@@Import@@)@> <@ if(_index == 0)@>import=" <@endif@>@@Import@@<@if (_index == _length-1)@>"<@else@>, <@ endif @> <@endloop@>
Żądanie parametru dla zachowania serwerowego
Zachowania serwerowe często wymagają od autora strony podania wartości parametru. Tę wartość należy podać, zanim zachowanie serwerowe zostanie wstawione do strony.
Powstaje okno dialogowe za pomocą zdefiniowania w kodzie parametrów podanych przez projektanta strony. Następnie generuje się okno dialogowe dla danego zachowania serwerowego. Okno monituje projektanta strony o wpisanie wartości parametru.
Parametr będzie dodawany do bloku kodu bez udziału użytkownika, jeżeli określisz, że kod należy wstawić względem konkretnego znacznika wybranego przez projektanta strony (tzn. wybierzesz opcję Względem konkretnego znacznika z wyskakującego menu Wstaw kod). Taki parametr doda do okna dialogowego tego zachowania serwerowego menu ze znacznikami, aby projektant strony mógł wybrać stosowny znacznik.
Definiowanie parametru w kodzie zachowania serwerowego
-
Wpisz symbol parametru w kodzie w tym miejscu, w którym chcesz wstawić podawaną wartość parametru. Parametr ma następującą składnię:
@@parameterName@@
-
Otocz ciąg formParam symbolami parametru (@@):
<% Session(“lang_pref”) = Request.Form(“@@formParam@@”); %>
Na przykład jeżeli zachowanie serwerowe zawiera następujący blok kodu:
<% Session(“lang_pref”) = Request.Form(“Form_Object_Name”); %>
Aby zażądać od autora strony wartości parametru Form_Object_Name, otocz ten ciąg symbolami parametru (@@):<% Session(“lang_pref”) = Request.Form(“@@Form_Object_Name@@”); %>
<% Session(“lang_pref”) = Request.Form(“@@Form_Object_Name@@”); %>
Możesz również zaznaczyć ten ciąg znaków i kliknąć przycisk Wstaw parametr w bloku kodu. Wpisz nazwę parametru i kliknij przycisk OK. Program Dreamweaver zastąpi każde wystąpienie zaznaczonego ciągu podaną nazwą parametru, otoczoną symbolami.
Program Dreamweaver używa ciągu, który można otoczyć symbolami parametru, do opisania formantów w generowanym oknie dialogowym (zobacz poniższą procedurę). W poprzednim przykładzie program Dreamweaver tworzy okno dialogowe z następującą etykietą:
Nazwy parametrów w kodzie zachowania serwerowego nie mogą zawierać spacji. Zatem etykiety w oknie dialogowym również nie mogą zawierać spacji. Jeśli chcesz dodać spacje w tekście etykiety, to możesz edytować wygenerowany plik HTML.
Tworzenie okna dialogowego dla zachowania serwerowego w celu uzyskania wartości parametru
-
Kliknij przycisk Dalej w Konstruktorze zachowań serwerowych.
-
Aby zmienić kolejność wyświetlania formantów w oknie dialogowym, zaznacz parametr i kliknij przycisk strzałki w górę lub w dół.
-
Aby zmienić formant związany z parametrem, zaznacz ten parametr i wybierz inny formant w kolumnie Wyświetl jako.
-
Kliknij przycisk OK.
Program Dreamweaver generuje okno dialogowe z opisanym formantem dla każdego ze zdefiniowanych parametrów podanych przez projektanta strony.
Wyświetlanie okna dialogowego
-
Kliknij przycisk Plus (+) w panelu Zachowania serwerowe (Okno > Zachowania serwerowe) i wybierz własne zachowanie serwerowe z wyskakującego menu.
Edytowanie okna dialogowego utworzonego dla zachowania serwerowego
-
Otwórz panel Zachowania serwerowe (Okno > Zachowania serwerowe) i kliknij przycisk Plus (+). Z wyskakującego menu wybierz polecenie Edytuj zachowania serwerowe.
-
Wybierz swoje zachowanie serwerowe z listy i kliknij przycisk Otwórz.
-
Kliknij przycisk Dalej.
Pojawi się okno dialogowe z listą wszystkich parametrów zdefiniowanych w kodzie zachowania, których wartości ma podawać projektant strony.
-
Aby zmienić kolejność wyświetlania formantów w oknie dialogowym, zaznacz parametr i kliknij przycisk strzałki w górę lub w dół.
-
Aby zmienić formant związany z parametrem, zaznacz ten parametr i wybierz inny formant w kolumnie Wyświetl jako.
-
Kliknij przycisk OK.
Edytowanie i modyfikowanie zachowań serwerowych
Edytować można wszystkie zachowania serwerowe utworzone za pomocą Konstruktora zachowań serwerowych, w tym również zachowania pobrane ze strony Dreamweaver Exchange i od innych programistów.
Jeśli użytkownik zastosuje zachowanie serwerowe na stronie, a potem zmodyfikuje to zachowanie w programie Dreamweaver, instancje starego zachowania znikną z panelu Zachowania serwerowe. Panel Zachowania serwerowe analizuje stronę w poszukiwaniu kodu zgodnego z kodem znanych zachowań serwerowych. Jeżeli kod zachowania serwerowego ulegnie zmianie, to panel przestanie rozpoznawać starsze wersje zachowania na tej stronie.
Zachowywanie zarówno starej, jak i nowej wersji zachowania w panelu
-
Kliknij przycisk Plus (+) w panelu Zachowania serwerowe (Okno > Zachowania serwerowe). Wybierz polecenie Nowe zachowanie serwerowe i utwórz kopię starego zachowania.
Edytowanie kodu zachowania serwerowego utworzonego za pomocą Konstruktora zachowań serwerowych
-
Otwórz panel Zachowania serwerowe (Okno > Zachowania serwerowe) i kliknij przycisk Plus (+). Z wyskakującego menu wybierz polecenie Edytuj zachowania serwerowe.
Okno dialogowe Edytuj zachowania serwerowe wyświetla wszystkie zachowania zgodne z bieżącą platformą technologiczną serwera.
-
Wybierz zachowanie serwerowe i kliknij przycisk Edytuj.
-
Zaznacz stosowny blok kodu i zmodyfikuj kod, symbole parametrów albo położenie wstawiania bloku na stronach.
-
Jeżeli zmodyfikowany kod nie zawiera żadnych parametrów, które ma podawać projektant strony, to kliknij przycisk OK.
Program Dreamweaver ponownie wygeneruje zachowanie serwerowe bez okna dialogowego. Nowe zachowanie serwerowe pojawi się w wyskakującym menu Plus (+) w panelu Zachowania serwerowe.
-
Jeżeli zmodyfikowany kod zawiera parametry, które ma podawać projektant strony, to kliknij przycisk Dalej.
Program Dreamweaver zapyta, czy chcesz utworzyć nowe okno dialogowe, nadpisując poprzednie. Wprowadź określone zmiany i kliknij przycisk OK.
Program Dreamweaver zapisuje wszystkie zmiany wprowadzone w zachowaniu serwerowym w pliku EDML.
Wytyczne dotyczące kodowania
Mówiąc ogólnie, kod zachowania serwerowego powinien być jak najkrótszy i niezawodny. Programiści aplikacji internetowych bardzo ostrożnie dobierają kod, który ma być dodany do ich stron. Przestrzegaj powszechnie przyjętych zasad programistycznych, dotyczących języka danego dokumentu (ColdFusion, JavaScript, VBScript lub PHP). Wpisując komentarze, pamiętaj, że kod będą analizować odbiorcy na różnym poziomie zaawansowania technicznego, np. zarówno graficy opracowujący elementy interaktywne na stronach, jak i programiści aplikacji internetowych. Podawaj komentarze precyzyjnie opisujące zastosowanie kodu oraz podające specjalne instrukcje umieszczania go na stronie.
Tworząc zachowania serwerowe, pamiętaj o następujących wytycznych:
Kontrola błędów
Wymagania importu. Kod zachowania serwerowego powinien płynnie obsługiwać przypadki błędów. Postaraj się przewidzieć wszystkie potencjalne problemy. Np. co się stanie, jeśli nie uda się uzyskać żądanego parametru? Co się stanie, jeśli zapytanie nie zwróci żadnych rekordów?
Niepowtarzalne nazwy
Ułatwiają jasną identyfikację kodu i pozwalają uniknąć konfliktów nazw z istniejącym kodem. Np. jeżeli strona zawiera funkcję o nazwie hideLayer() oraz zmienną globalną o nazwie ERROR_STRING, to wstawienie kodu zachowania serwerowego, który również używa takich nazw, może spowodować konflikt.
Prefiksy kodu
Umożliwiają identyfikowanie własnych funkcji wykonywalnych i zmiennych globalnych na stronie. Można np. użyć własnych inicjałów. Nigdy nie używaj prefiksu MM_, gdyż jest on zastrzeżony dla programu Dreamweaver. Program Dreamweaver poprzedza wszystkie funkcje i zmienne globalne prefiksem MM_, co zapobiega potencjalnym konfliktom z kodem użytkowników.
var MM_ERROR_STRING = "..."; function MM_hideLayer() {
Unikaj tworzenia podobnych bloków kodu
tak aby zaprogramowany kod nie przypominał zbytnio kodu z innych bloków. Jeśli blok kodu zbytnio przypomina inny kod na stronie, to panel Zachowania serwerowe może błędnie zidentyfikować pierwszy blok kodu jako instancję drugiego (albo odwrotnie). Prostym sposobem na odróżnienie bloku kodu od innych jest wstawienie komentarzy.
Testowanie zachowań serwerowych
Serwis Dreamweaver Exchange zaleca, by dla każdego utworzonego zachowania serwerowego przeprowadzone zostały następujące testy:
Zastosuj to zachowanie za pomocą panelu Zachowania serwerowe. Jeżeli zachowanie ma okno dialogowe, wpisz w każde pole poprawne dane i kliknij przycisk OK. Sprawdź, czy podczas stosowania zachowania nie występują błędy. Sprawdź, czy kod wykonywalny zachowania serwerowego pojawia się w Inspektorze kodu.
Zastosuj zachowanie serwerowe jeszcze raz, tym razem wpisując nieprawidłowe dane w każde z pól okna dialogowego. Spróbuj pozostawić puste pole, użyć bardzo dużych liczb albo liczb ujemnych, wpisać niedopuszczalne znaki (np. /, ?, :, * itd.) oraz użyć liter w polach liczbowych. Aby zapewnić obsługę nieprawidłowych danych, możesz zaprogramować procedury walidacji formularzy (wymaga to programowania ręcznego, co wykracza poza tematykę tej książki).
Po pomyślnym zastosowaniu zachowania serwerowego na stronie zweryfikuj następujące kwestie:
Sprawdź panel Zachowania serwerowe – nazwa zastosowanego zachowania powinna pojawić się na liście zachowań dodanych do strony.
Sprawdź, czy ikony skryptów serwerowych pojawiły się na stronie (o ile ma to zastosowanie). Standardowe ikony skryptów serwerowych to złote tarcze. Aby wyświetlić te ikony, włącz polecenie Elementy niewidoczne (Widok > Pomoce wizualne > Elementy niewidoczne).
Przejdź do widoku Kod (Widok > Kod) i sprawdź, czy nie został wygenerowany nieprawidłowy kod.
Ponadto, jeżeli zachowanie serwerowe wstawia do dokumentu kod nawiązujący połączenie z bazą danych, utwórz testową bazę, aby przetestować kod wstawiony do dokumentu. Sprawdź działanie połączenia, definiując zapytania dające różne zestawy danych o różnej wielkości.
Na koniec wyślij stronę na serwer i otwórz ją w przeglądarce. Wyświetl kod HTML strony i sprawdź, czy skrypty serwerowe nie wygenerowały nieprawidłowego kodu.