- 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 dodawaniu zawartości dynamicznej
Po zdefiniowaniu źródeł zawartości dynamicznej możesz ich używać, aby wprowadzać na stronach taką zawartość. Źródło zawartości może obejmować kolumnę w zestawie rekordów, wartość wysłaną przez formularz HTML, wartość zawartą w obiekcie serwerowym albo inne dane.
W programie Dreamweaver zawartość dynamiczną można umieszczać niemalże w dowolnym miejscu na stronie internetowej lub w kodzie HTML tej strony. Zawartość dynamiczną można umieścić w punkcie wstawiania, zastąpić ciąg tekstowy albo wstawić ją jako atrybut HTML. Zawartość dynamiczna może np. definiować atrybut src obrazu albo atrybut value w polu formularza.
Aby dodać zawartość dynamiczną do strony, zaznacza się źródło zawartości w panelu Wiązania. Program Dreamweaver wstawia w kodzie strony skrypt wykonywany na serwerze, który nakazuje serwerowi przeniesienie danych ze źródła zawartości do kodu HTML strony w chwili, gdy strona ta jest wywoływana przez przeglądarkę.
Często istnieje wiele metod wprowadzenia dynamiki dla danego elementu strony. Na przykład aby obraz stał się dynamiczny, można posłużyć się panelem Wiązania, Inspektorem właściwości albo poleceniem Obraz z menu Wstaw.
Domyślnie strona HTML może wyświetlać tylko jeden rekord naraz. Aby wyświetlić inne rekordy z zestawu, można dodać łącze pozwalające przechodzić pojedynczo z rekordu do rekordu. Można także utworzyć region powtarzalny, co pozwoli wyświetlać więcej niż jeden rekord na pojedynczej stronie.
Informacje o dynamicznym tekście
Dynamiczny tekst przyjmuje wszystkie atrybuty formatowania zastosowane do istniejącego tekstu lub obowiązujące w punkcie wstawiania. Np. jeżeli dla zaznaczonego tekstu obowiązuje styl CSS, to dynamiczna zawartość zastępująca ten tekst również będzie formatowana tym stylem. Formatowanie tekstowe zawartości dynamicznej można uzupełniać i modyfikować, używając dowolnych narzędzi formatujących programu Dreamweaver.
Do tekstu dynamicznego można również stosować format danych. Np. jeżeli dane zawierają daty, to można wskazać konkretny format dat, np. 04/17/00 dla odwiedzających z USA lub 17/04/00 dla użytkowników z Europy.
Tworzenie tekstu dynamicznego
Tekstem dynamicznym można zastąpić istniejący tekst albo umieścić go w punkcie wstawiania na stronie.
Dodawanie dynamicznego tekstu
-
W widoku Projekt zaznacz tekst na stronie lub kliknij w miejscu, gdzie chcesz dodać dynamiczny tekst.
-
Otwórz panel Wiązania (Okno > Wiązania) i wybierz źródło zawartości z listy. Jeżeli wybierzesz zestaw rekordów, to musisz również wskazać pożądaną kolumnę z zestawu.
Źródło zawartości powinno zawierać zwykły tekst (tekst ASCII). Zwykły tekst to także HTML. Jeżeli na liście nie ma żadnych źródeł zawartości lub dostępne źródła nie odpowiadają twoim potrzebom, kliknij przycisk Plus (+), aby zdefiniować nowe źródło zawartości.
-
(Opcjonalnie) Wybierz format danych dla tekstu.
-
Kliknij przycisk Wstaw albo przeciągnij źródło zawartości na stronę.
Pojawi się element zastępczy zawartości dynamicznej. (Jeżeli na stronie był zaznaczony tekst, to element zastępczy zastąpi to zaznaczenie). Element zastępczy dla zawartości zestawu rekordów używa następującej składni: {NazwaZestawuRekordów.NazwaKolumny}, gdzie ZestawRekordów to nazwa zestawu rekordów, a NazwaKolumny to nazwa kolumny wybranej z tego zestawu rekordów.
Niekiedy długość elementów zastępczych dynamicznego tekstu zaburza układ strony w oknie dokumentu. Możesz rozwiązać ten problem, używając pustych klamer jako elementów zastępczych, zgodnie z opisem w następnym temacie.
Wyświetlanie elementów zastępczych tekstu dynamicznego
-
Wybierz polecenie Edycja > Preferencje > Elementy niewidoczne (Windows) lub Dreamweaver > Preferencje > Elementy niewidoczne (Macintosh).
-
Z wyskakującego menu Pokaż dynamiczny tekst jako wybierz polecenie { } i kliknij przycisk OK.
Wprowadzanie dynamiki do obrazów
Obrazy na stronach mogą zachowywać się dynamicznie. Załóżmy np. że tworzysz stronę wyświetlającą pozycje na sprzedaż na aukcji charytatywnej. Każda ze stron będzie zawierać tekst opisu oraz fotografię jednej pozycji. Ogólny układ strony pozostanie taki sam dla każdej pozycji, zmieniać się będzie jednak fotografia (i tekst opisu).
-
Po otwarciu strony w widoku Projekt (Widok > Projekt), umieść punkt wstawiania w miejscu, w którym ma się pojawiać obraz.
-
Wybierz polecenie Wstaw > Obraz.
Pojawi się okno dialogowe Wybierz źródło obrazu.
-
Kliknij opcję Źródła danych (Windows) lub przycisk Źródło danych (Macintosh).
Pojawi się lista źródeł zawartości.
-
Wybierz źródło zawartości z listy i kliknij przycisk OK.
Źródłem zawartości może być zestaw rekordów, zawierający ścieżki do plików graficznych. W zależności od struktury plików w serwisie, mogą to być ścieżki bezwzględne, względne dla dokumentu lub względne dla folderu głównego.
Uwaga:Program Dreamweaver nie obsługuje obecnie binarnych obrazów przechowywanych w bazach danych.
Jeżeli na liście nie ma żadnych zestawów rekordów lub żaden z wymienionych zestawów nie spełnia Twoich potrzeb, zdefiniuj nowy zestaw rekordów.
Tworzenie dynamicznych atrybutów HTML
Wygląd strony można dynamicznie zmieniać, wiążąc atrybuty HTML z danymi. Można np. zmieniać obraz w tle tabeli, wiążąc atrybut background tej tabeli z polem w zestawie rekordów.
Atrybuty HTML można wiązać z danymi za pomocą panelu Wiązania albo Inspektora właściwości.
Wprowadzanie dynamiki atrybutów HTML za pomocą panelu Wiązania
-
Otwórz panel Wiązania, wybierając polecenie Okno > Wiązania.
-
Sprawdź, czy w panelu Wiązania wymienione jest źródło danych, z którego chcesz korzystać.
Źródło danych powinno zawierać dane dostosowane do atrybutu HTML, z którym chcesz je związać. Jeżeli na liście nie ma żadnych źródeł zawartości lub dostępne źródła nie odpowiadają twoim potrzebom, kliknij przycisk Plus (+), aby zdefiniować nowe źródło danych.
-
Przejdź do widoku Projekt i zaznacz obiekt HTML.
Np. aby zaznaczyć tabelę HTML, kliknij wewnątrz tabeli, a potem kliknij znacznik <table> w przyborniku znaczników na dole po lewej stronie okna Dokument.
-
Otwórz panel Wiązania i wybierz źródło zawartości z listy.
-
W polu Wiąż z wybierz atrybut HTML z wyskakującego menu.
-
Kliknij przycisk Zwiąż.
Po następnym uruchomieniu strony na serwerze aplikacji do tego atrybutu HTML zostanie przypisana wartość ze źródła danych.
Tworzenie dynamicznych atrybutów HTML za pomocą Inspektora właściwości
-
Przejdź do widoku Projekt. Zaznacz obiekt HTML i otwórz Inspektora właściwości (Okno > Właściwości).
Np. aby zaznaczyć tabelę HTML, kliknij wewnątrz tabeli, a potem kliknij znacznik <table> w przyborniku znaczników na dole po lewej stronie okna Dokument.
-
Sposób wiązania źródła zawartości dynamicznej z atrybutem HTML zależy od jego położenia.
Jeśli obok atrybutu przeznaczonego do powiązania znajduje się ikona folderu w Inspektorze właściwości, kliknij ikonę folderu, aby otworzyć okno dialogowe zaznaczenia pliku; następnie kliknij opcję Źródła danych, aby wyświetlić listę źródeł danych.
Jeżeli obok atrybutu, który chcesz związać, nie ma ikony folderu, kliknij zakładkę Lista (niższą z dwóch zakładek) po lewej stronie Inspektora.
Inspektor właściwości przejdzie w widok listy.
Jeżeli atrybutu, który chcesz związać, nie ma w widoku listy, kliknij przycisk Plus (+). Potem wpisz nazwę atrybutu lub kliknij przycisk z małą strzałką i wybierz atrybut z wyskakującego menu.
-
Aby wartość atrybutu stała się dynamiczna, kliknij ten atrybut. Potem kliknij ikonę błyskawicy lub ikonę folderu na końcu wiersza atrybutu.
Jeżeli klikniesz ikonę błyskawicy, pojawi się lista źródeł danych.
Jeżeli klikniesz ikonę folderu, pojawi się okno dialogowe wyboru pliku. Wybierz opcję Źródła danych, aby wyświetlić listę źródeł zawartości.
-
Wybierz źródło zawartości z listy źródeł i kliknij przycisk OK.
Źródło zawartości powinno zawierać dane dostosowane do atrybutu HTML, z którym chcesz je związać. Jeżeli na liście nie ma żadnych źródeł zawartości lub dostępne źródła nie odpowiadają twoim potrzebom, zdefiniuj nowe źródło zawartości.
Po następnym uruchomieniu strony na serwerze aplikacji do tego atrybutu HTML zostanie przypisana wartość ze źródła danych.
Wprowadzanie dynamiki do obiektów ActiveX, Flash i innych
Parametry apletów Java i wtyczek mogą być dynamiczne, podobnie jak parametry obiektów ActiveX, Flash, Shockwave, Director i Generator.
Zanim zaczniesz pracę, sprawdź, czy pola w zestawie rekordów zawierają dane odpowiednie dla parametrów obiektu, z którymi chcesz je związać.
-
Przejdź do widoku Projekt. Zaznacz obiekt na stronie i otwórz Inspektora właściwości (Okno > Właściwości).
-
Kliknij przycisk Parametry.
-
Jeżeli parametru nie ma na liście, kliknij przycisk Plus (+) i wpisz nazwę tego parametru w kolumnie Parametry.
-
Kliknij kolumnę Wartość dla parametru. Kliknij ikonę błyskawicy, aby wskazać wartość dynamiczną.
Pojawi się lista źródeł danych.
-
Wybierz źródło danych z listy i kliknij przycisk OK.
Źródło danych powinno zawierać dane dostosowane do parametru obiektu, z którym chcesz je związać. Jeżeli na liście nie ma żadnych źródeł danych lub dostępne źródła nie odpowiadają twoim potrzebom, zdefiniuj nowe źródło danych.
Więcej zasobów tego rodzaju
- Definiowanie źródeł zawartości dynamicznej
- Tworzenie paska nawigacji dla zestawu rekordów
- Wyświetlanie wyników z wielu zestawów rekordów
- Stosowanie elementów typograficznych i elementów układu strony do danych dynamicznych
- Używanie predefiniowanych formatów danych
- Informacje o zestawach rekordów
- Definiowanie zestawu rekordów bez pisania kodu SQL