Podręcznik użytkownika Anuluj

Praca z programami Fireworks i Dreamweaver

  1. Podręcznik użytkownika programu Dreamweaver
  2. Wprowadzenie
    1. Podstawy projektowania serwisów WWW o elastycznym układzie
    2. Dreamweaver — co nowego
    3. Programowanie zawartości WWW za pomocą programu Dreamweaver — przegląd
    4. Dreamweaver / Popularne pytania
    5. Skróty klawiszowe
    6. Wymagania systemowe programu Dreamweaver
    7. Podsumowanie funkcji
  3. Program Dreamweaver a platforma Creative Cloud
    1. Synchronizowanie ustawień programu Dreamweaver z chmurą Creative Cloud
    2. Biblioteki Creative Cloud w programie Dreamweaver
    3. Używanie plików programu Photoshop w programie Dreamweaver
    4. Praca z programami Adobe Animate oraz Dreamweaver
    5. Wydzielanie przygotowanych do wyświetlania w Internecie plików SVG z bibliotek
  4. Przestrzenie robocze i widoki w programie Dreamweaver
    1. Przestrzeń robocza programu Dreamweaver
    2. Optymalizacja przestrzeni roboczej programu Dreamweaver do programowania wizualnego
    3. Wyszukiwanie plików według nazwy lub zawartości | Mac OS
  5. Konfigurowanie serwisów
    1. Informacje o serwisach programu Dreamweaver
    2. Konfigurowanie lokalnej wersji serwisu
    3. Nawiązywanie połączenia z serwerem publikacji
    4. Konfigurowanie serwera testowego
    5. Importowanie i eksportowanie ustawień serwisu programu Dreamweaver
    6. Przenoszenie istniejących serwisów z serwera zdalnego do lokalnego katalogu głównego serwisu
    7. Funkcje ułatwień dostępu w programie Dreamweaver
    8. Ustawienia zaawansowane
    9. Ustawianie preferencji serwisu dotyczących transferu plików
    10. Określanie ustawień serwera proxy w programie Dreamweaver
    11. Synchronizowanie ustawień programu Dreamweaver z chmurą Creative Cloud
    12. Korzystanie z systemu Git w programie Dreamweaver
  6. Zarządzanie plikami
    1. Tworzenie i otwieranie plików
    2. Zarządzanie plikami i folderami
    3. Odbieranie plików i wysyłanie ich na serwer
    4. Pobieranie plików do edycji i odkładanie ich na serwer
    5. Synchronizacja plików
    6. Porównywanie plików w poszukiwaniu różnic
    7. Maskowanie plików i folderów w serwisie programu Dreamweaver
    8. Włączanie funkcji Uwagi do projektu w serwisach programu Dreamweaver
    9. Zapobieganie potencjalnemu obejściu funkcji Gatekeeper
  7. Układ i projekt
    1. Korzystanie z wizualnych pomocy do układu
    2. Informacje o tworzeniu układu strony za pomocą stylów CSS
    3. Projektowanie elastycznych serwisów WWW z użyciem struktury Bootstrap
    4. Tworzenie i używanie zapytań o media w programie Dreamweaver
    5. Prezentacja zawartości za pomocą tabel
    6. Kolory
    7. Tworzenie reagujących projektów za pomocą układów elastycznej siatki
    8. Narzędzie Extract w programie Dreamweaver
  8. CSS
    1. Podstawowe informacje o stylach CSS
    2. Tworzenie układu strony za pomocą panelu Projektant CSS
    3. Korzystanie z preprocesorów CSS w programie Dreamweaver
    4. Ustawianie preferencji stylów CSS w programie Dreamweaver
    5. Przenoszenie reguł CSS w programie Dreamweaver
    6. Konwertowanie stylu CSS wewnątrz znacznika na regułę CSS w programie Dreamweaver
    7. Posługiwanie się znacznikami DIV
    8. Stosowanie gradientów na tło
    9. Tworzenie i edytowanie efektów przejść CSS3 w programie Dreamweaver
    10. Formatowanie kodu
  9. Zawartość strony i zasoby
    1. Ustawianie właściwości strony
    2. Ustawianie właściwości CSS dla nagłówków i łączy
    3. Praca z tekstem
    4. Znajdowanie i zastępowanie tekstu, znaczników i atrybutów
    5. Panel DOM
    6. Edytowanie w widoku aktywnym
    7. Kodowanie znaków dokumentu w programie Dreamweaver
    8. Zaznaczanie i wyświetlanie elementów w oknie Dokument
    9. Ustawianie właściwości tekstu na panelu Inspektor właściwości
    10. Sprawdzanie pisowni na stronie internetowej
    11. Używanie linii poziomych w programie Dreamweaver
    12. Dodawanie i modyfikowanie kombinacji czcionek w programie Dreamweaver
    13. Praca z zasobami
    14. Wstawianie i aktualizowanie dat w programie Dreamweaver
    15. Tworzenie list ulubionych zasobów w programie Dreamweaver i zarządzanie nimi
    16. Wstawianie i edytowanie obrazów w programie Dreamweaver
    17. Dodawanie obiektów multimedialnych
    18. Dodawanie zawartości wideo w programie Dreamweaver
    19. Wstawianie wideo HTML5
    20. Wstawianie plików SWF
    21. Dodawanie efektów dźwiękowych
    22. Wstawianie obiektów audio HTML5 w programie Dreamweaver
    23. Praca z elementami bibliotek
    24. Stosowanie pisma arabskiego i hebrajskiego w programie Dreamweaver
  10. Łączenie i przeglądanie
    1. Informacje o łączeniu i przeglądaniu stron
    2. Tworzenie łączy
    3. Mapy obrazu
    4. Rozwiązywanie problemów dotyczących łączy
  11. Efekty i widgety jQuery
    1. Używanie widgetów jQuery interfejsu użytkownika i elementów mobilnych w programie Dreamweaver
    2. Używanie efektów jQuery w programie Dreamweaver
  12. Tworzenie kodu serwisów WWW
    1. Informacje o tworzeniu kodu w programie Dreamweaver
    2. Środowisko programistyczne w programie Dreamweaver
    3. Ustawianie preferencji kodowania
    4. Dostosowywanie ustawień kolorowania kodu
    5. Pisanie i edytowanie kodu
    6. Podpowiedzi i uzupełnianie kodu
    7. Zwijanie i rozwijanie kodu
    8. Ponowne wykorzystywanie fragmentów kodu za pomocą funkcji Urywki
    9. Linting: oczyszczanie kodu z błędów
    10. Optymalizacja kodu
    11. Edytowanie kodu w widoku Projekt
    12. Praca z zawartością znacznika HEAD strony
    13. Wstawianie dołączeń po stronie serwera w programie Dreamweaver
    14. Korzystanie z bibliotek znaczników w programie Dreamweaver
    15. Importowanie własnych znaczników do programu Dreamweaver
    16. Używanie zachowań JavaScript (instrukcje ogólne)
    17. Stosowanie wbudowanych zachowań JavaScript
    18. Omówienie języków XML i XSLT
    19. Wykonywanie transformacji XSL po stronie serwera w programie Dreamweaver
    20. Wykonywanie przekształceń XSL po stronie klienta w programie Dreamweaver
    21. Dodawanie encji znaków w kodzie XSLT w programie Dreamweaver
    22. Formatowanie kodu
  13. Obiegi pracy związane z wieloma produktami
    1. Instalowanie i używanie rozszerzeń programu Dreamweaver
    2. Aktualizacje w aplikacji w programie Dreamweaver
    3. Wstawianie dokumentów Microsoft Office w programie Dreamweaver (tylko Windows)
    4. Praca z programami Fireworks i Dreamweaver
    5. Edycja zawartości w stronach programu Dreamweaver za pomocą aplikacji Contribute
    6. Integracja programu Dreamweaver z aplikacją Business Catalyst
    7. Tworzenie spersonalizowanych kampanii rozsyłanych pocztą elektroniczną
  14. Szablony
    1. Informacje o szablonach programu Dreamweaver
    2. Rozpoznawanie szablonów oraz dokumentów opartych na szablonach
    3. Tworzenie szablonu programu Dreamweaver
    4. Tworzenie edytowalnych regionów w szablonach
    5. Tworzenie powtarzalnych regionów i tabel w programie Dreamweaver
    6. Używanie regionów opcjonalnych w szablonach
    7. Definiowanie edytowalnych atrybutów znacznika w programie Dreamweaver
    8. Tworzenie zagnieżdżonych szablonów w programie Dreamweaver
    9. Edytowanie, aktualizowanie i usuwanie szablonów
    10. Eksportowanie i importowanie zawartości XML w programie Dreamweaver
    11. Stosowanie szablonu lub usuwanie go z istniejącego dokumentu
    12. Edycja zawartości w szablonach programu Dreamweaver
    13. Reguły składni dla znaczników szablonu w programie Dreamweaver
    14. Ustawianie preferencji podświetlenia dla regionów szablonów
    15. Korzyści wynikające z używania szablonów w programie Dreamweaver
  15. Urządzenia mobilne i obsługa wielu ekranów
    1. Tworzenie zapytań o media
    2. Zmiana orientacji strony na urządzeniach mobilnych
    3. Tworzenie aplikacji internetowych przeznaczonych na urządzenia mobilne za pomocą programu Dreamweaver
  16. Dynamiczne serwisy, strony i formularze WWW
    1. Podstawowe informacje o aplikacjach internetowych
    2. Konfigurowanie komputera do programowania aplikacji
    3. Rozwiązywanie problemów z połączeniami z bazą danych
    4. Usuwanie skryptów połączenia w programie Dreamweaver
    5. Projektowanie stron dynamicznych
    6. Omówienie źródeł zawartości dynamicznej
    7. Definiowanie źródeł zawartości dynamicznej
    8. Dodawanie dynamicznej zawartości do stron
    9. Modyfikowanie dynamicznej zawartości w programie Dreamweaver
    10. Wyświetlanie rekordów z bazy danych
    11. Udostępnianie aktywnych danych w programie Dreamweaver oraz rozwiązywanie problemów z takimi danymi
    12. Dodawanie własnych zachowań serwerowych w programie Dreamweaver
    13. Tworzenie formularzy w programie Dreamweaver
    14. Zbieranie informacji od użytkowników za pomocą formularzy
    15. Tworzenie oraz włączanie formularzy ColdFusion w programie Dreamweaver
    16. Tworzenie formularzy WWW
    17. Rozszerzona obsługa elementów formularza w języku HTML5
    18. Tworzenie formularzy za pomocą programu Dreamweaver
  17. Tworzenie aplikacji metodą graficzną
    1. Tworzenie stron wzorca i szczegółów w programie Dreamweaver
    2. Tworzenie stron wyszukiwania i wyników
    3. Tworzenie strony wstawiania rekordów
    4. Tworzenie strony uaktualniania rekordów w programie Dreamweaver
    5. Tworzenie stron usuwania rekordów w programie Dreamweaver
    6. Używanie poleceń ASP do modyfikacji bazy danych w programie Dreamweaver
    7. Tworzenie strony rejestracji
    8. Tworzenie strony logowania
    9. Tworzenie strony, do której dostęp będą mieli tylko uwierzytelnieni użytkownicy
    10. Zabezpieczanie folderów w aplikacji ColdFusion za pomocą programu Dreamweaver
    11. Korzystanie ze składników ColdFusion w programie Dreamweaver
  18. Testowanie, podgląd i publikacja serwisów WWW
    1. Podgląd stron
    2. Podgląd stron WWW programu Dreamweaver na wielu urządzeniach
    3. Testowanie serwisu programu Dreamweaver
  19. Rozwiązywanie problemów
    1. Rozwiązane problemy
    2. Znane problemy

 

 

Programy Fireworks i Dreamweaver zapewniają sprawny obieg pracy, obejmujący edycję, optymalizację i umieszczanie plików grafiki internetowej na stronach HTML.

Uwaga:

Ta funkcja nie jest obsługiwana w wersjach programu Adobe Dreamweaver.

Wstawianie obrazu Fireworks

Programy Dreamweaver i Fireworks stosują i rozpoznają wiele wspólnych procedur edycyjnych, takich jak łącza, mapy obrazów i plasterki tabel. Obie te aplikacje zapewniają usprawniony obieg pracy, obejmujący edycję, optymalizację i umieszczanie grafiki internetowej na stronach HTML.

W trakcie pracy można umieścić eksportowaną grafikę Fireworks bezpośrednio w dokumencie programu Dreamweaver za pomocą polecenia Wstaw obraz lub utworzyć nową grafikę programu Fireworks z elementu zastępczego obrazu w programie Dreamweaver.

  1. W dokumencie programu Dreamweaver należy umieścić kursor w miejscu wstawienia obrazu i wykonać jedną z następujących czynności:
    • Wybierz polecenie Wstaw > Obraz.

    • W kategorii Wspólne panelu Wstaw kliknij przycisk Obraz lub przeciągnij go na dokument.

  2. Znajdź wyeksportowany plik Fireworks i kliknij przycisk OK (Windows) lub Otwórz (Macintosh).
    Uwaga:

    Jeśli plik Fireworks nie znajduje się w bieżącym serwisie programu Dreamweaver, na ekranie pojawi się komunikat z pytaniem o skopiowanie danego pliku do folderu głównego. Kliknij przycisk Tak.

Edycja obrazu lub tabeli Fireworks w programie Dreamweaver

W celu otwarcia i edycji obrazu lub plasterka obrazu będącego częścią tabeli programu Fireworks program Dreamweaver uruchomi program Fireworks. Fireworks natomiast otworzy plik PNG, z którego wyeksportowano dany obraz lub tabelę.

Uwaga:

Dzieje się tak przy założeniu, że program Fireworks ustawiono jako główny zewnętrzny edytor obrazów w formacie PNG. Ponadto program Fireworks jest często ustawiany jako domyślny edytor plików JPEG i GIF, chociaż można wybrać w tym celu także program Photoshop.

Jeśli obraz jest częścią tabeli Fireworks, to można otworzyć całą tabelę Fireworks do edycji, pod warunkiem, że w kodzie HTML istnieje komentarz <!--fw table-->. Jeśli źródłowy plik PNG wyeksportowano z programu Fireworks do serwisu Dreamweaver za pomocą ustawienia Styl HTML i obrazy, w kodzie HTML automatycznie wstawiany jest komentarz do tabeli programu Fireworks.

  1. W programie Dreamweaver otwórz okno Inspektor właściwości (Okno > Właściwości).
  2. Zaznacz kliknięciem obraz lub plasterek obrazu.

    Jeśli zaznaczysz obraz wyeksportowany z programu Fireworks, Inspektor właściwości zidentyfikuje zaznaczenie jako obraz lub tabelę Fireworks i wyświetli nazwę źródłowego pliku PNG.

  3. Aby uruchomić program Fireworks do edycji, wykonaj jedną z następujących czynności:
    • W oknie inspektora Właściwości, kliknij polecenie Edycja.

    • Wciśnij klawisz Control (Windows) lub Command (Macintosh) i dwukrotnie kliknij zaznaczony obraz.

    • Kliknij prawym przyciskiem myszy (Windows) lub kliknij z wciśniętym klawiszem Control (Mac OS) zaznaczony obraz i z menu kontekstowego wybierz polecenie Edytuj w programie Fireworks.

    Uwaga:

    Jeśli program Fireworks nie odnajdzie pliku źródłowego, wyświetlony zostanie monit o wskazanie źródłowego pliku PNG. Jeśli użytkownik korzysta ze źródłowego pliku Fireworks, zmiany są zapisywane w pliku źródłowym i eksportowanym, ponieważ w innym przypadku uaktualniany byłby tylko plik eksportowany.  

  4. W programie Fireworks przeprowadź edycję źródłowego pliku PNG i kliknij przycisk Gotowe.

    Program Fireworks zapisze zmiany w pliku PNG, wyeksportuje uaktualniony obraz (lub kod HTML i obrazy) i powróci do programu Dreamweaver. Na ekranie programu Dreamweaver pojawi się uaktualniony obraz lub tabela.

    Samouczek przedstawiający integrację programów Dreamweaver i Fireworks można obejrzeć na stronie internetowej www.adobe.com/go/vid0188_pl.

Optymalizacja obrazu programu Fireworks w programie Dreamweaver

Program Dreamweaver umożliwia wprowadzanie szybkich zmian w obrazach i animacjach programu Fireworks. W programie Dreamweaver można zmieniać ustawienia optymalizacji i animacji oraz rozmiar i obszar eksportowanego obrazu.

  1. Zaznacz żądany obraz w programie Dreamweaver i wykonaj jedną z następujących czynności:
    • Wybierz opcję Polecenie > Optymalizuj obraz

    • Kliknij przycisk Edytuj ustawienia obrazu na panelu Inspektor właściwości.

  2. Wprowadź pożądane zmiany w oknie Podgląd obrazu:
    • Aby zmienić ustawienia optymalizacji, kliknij kartę Opcje.

    • Aby zmienić rozmiar i obszar eksportowanego obrazu, kliknij kartę Plik.

  3. Po zakończeniu kliknij przycisk OK.

Modyfikowanie obrazów zastępczych programu Dreamweaver za pomocą programu Fireworks

Można najpierw utworzyć obraz zastępczy w dokumencie programu Dreamweaver, a potem uruchomić program Fireworks, aby zaprojektować grafikę lub tabelę Fireworks, które go zastąpią.

Aby można było utworzyć nowy obraz z elementu zastępczego, w systemie muszą być zainstalowane oba programy (Dreamweaver i Fireworks).

  1. Upewnij się, że program Fireworks został zdefiniowany jako edytor obrazów PNG.
  2. W oknie dokumentu zaznacz element zastępczy obrazu kliknięciem.
  3. Uruchom program Fireworks w trybie Edytuj z programu Dreamweaver, wykonując jedną z następujących czynności:
    • W oknie inspektora Właściwości, kliknij polecenie Utwórz.

    • Przytrzymaj klawisz Control (Windows) lub Command (Macintosh) i dwukrotnie kliknij zaznaczony element zastępczy obrazu.

    • Kliknij zaznaczony obraz prawym przyciskiem myszy (Windows) lub przytrzymując klawisz Control (Mac OS) i zaznacz opcję Utwórz obraz w programie Fireworks.

  4. Użyj opcji programu Fireworks do zaprojektowania obrazu.

    Fireworks rozpoznaje następujące ustawienia zastępczego obrazu, które mogą być określane podczas pracy w programie Dreamweaver: rozmiar obrazu (rozmiar obszaru roboczego w programie Fireworks), identyfikator obrazu (używany przez program Fireworks jako domyślna nazwa tworzonego pliku źródłowego i eksportowanego) oraz wyrównanie tekstu. Program Fireworks rozpoznaje także łącza i niektóre zachowania (np. zamiana obrazu, wyskakujące menu i ustawiony tekst) przypisane do obrazu zastępczego podczas pracy w programie Dreamweaver.

    Uwaga:

    Fireworks nie wyświetla łączy dodanych do zastępczego obrazu, ale są one tam obecne. Jeśli narysujesz punkt aktywny i dodasz łącze w programie Fireworks, program nie usunie łącza dodanego do zastępczego obrazu w programie Dreamweaver, natomiast wycięcie plasterków w nowym obrazie w programie Fireworks spowoduje, że aplikacja usunie łącze w dokumencie programu Dreamweaver po zastąpieniu elementu zastępczego.

    Program Fireworks nie rozpoznaje następujących ustawień elementu zastępczego obrazu: wyrównanie obrazu, kolor, Vspace i Hspace oraz mapy. Ustawienia te są wyłączone w inspektorze Właściwości elementu zastępczego obrazu.

  5. Po zakończeniu kliknij przycisk Gotowe, aby wyświetlić monit umożliwiający zapisanie pliku.
  6. W polu tekstowym „Zapisz w” zaznacz folder zdefiniowany jako lokalny folder serwisu programu Dreamweaver.

    Jeśli podczas umieszczania elementu zastępczego w dokumencie programu Dreamweaver nadano mu nazwę, program Fireworks wypełni odpowiednio pole Nazwa pliku. Taką nazwę można zmienić.

  7. Kliknij opcję Zapisz, aby zapisać plik PNG.

    Na ekranie pojawi się okno Eksport. Użyj tego okna w celu wyeksportowania jako pliku GIF lub JPEG lub (w przypadku obrazów z plasterkami) w postaci pliku HTML i obrazów.

  8. W polu „Zapisz w” wybierz folder lokalnego serwisu programu Dreamweaver.

    W polu Nazwa jest automatycznie wyświetlana nazwa pliku PNG. Taką nazwę można zmienić.

  9. Z listy Zapisz jako typ wybierz typ pliku lub plików wybranych do eksportowania; na przykład „Tylko obrazy” lub „HTML i obrazy”.
  10. Kliknij przycisk Zapisz, aby zapisać eksportowany plik.

    Plik zostanie zapisany, a następnie zostanie ponownie uaktywniony program Dreamweaver. W dokumencie programu Dreamweaver eksportowany plik lub tabela programu Fireworks zastępują element zastępczy obrazu.

Omówienie menu wyskakujących w programie Adobe Fireworks

Fireworks umożliwia szybkie i łatwe tworzenie menu wyskakujących na bazie CSS.

Menu wyskakujące tworzone przy pomocy programu Fireworks można rozbudowywać, a ich pobieranie przebiega szybko. Mają one także inne zalety:

  • Elementy menu mogą być indeksowane przez wyszukiwarki.

  • Elementy menu mogą być odczytywane przez czytniki ekranowe, co poprawia dostępność stron.

  • Kod generowany przez program Fireworks jest zgodny ze standardami i może być walidowany.

    Menu wyskakujące Fireworks można edytować za pomocą programu Dreamweaver lub programu Fireworks, ale nie obu tych programów jednocześnie. Zmiany wprowadzone w programie Dreamweaver nie są widoczne w programie Fireworks.

Edycja menu wyskakujących programu Fireworks w programie Dreamweaver

Wyskakujące menu można utworzyć w programie Fireworks 8 (lub nowszej wersji), a następnie zmodyfikować za pomocą programu Dreamweaver lub Fireworks (korzystając z edycji typu roundtrip), ale nie za pomocą obu tych programów. Edycja menu w programie Dreamweaver, a potem w programie Fireworks spowoduje utratę wcześniejszych zmian z wyjątkiem zawartości tekstowej.

Jeśli użytkownik woli edytować menu za pomocą programu Dreamweaver, może użyć aplikacji Fireworks do utworzenia menu wyskakujących, a potem używać już tylko programu Dreamweaver do edycji i dostosowywania tego menu.

Jeśli użytkownik woli edytować menu w programie Fireworks, można użyć funkcji edycji roundtrip w programie Dreamweaver. Nie należy jednak edytować menu bezpośrednio w programie Dreamweaver.

  1. W programie Dreamweaver zaznacz tabelę Fireworks z menu wyskakującym i kliknij opcję Edytuj na panelu Inspektor właściwości.

    Źródłowy plik PNG zostanie otwarty w programie Fireworks.

  2. Zmodyfikuj menu w programie Fireworks, korzystając z oka Edytor menu wyskakującego. Następnie kliknij opcję Gotowe na pasku narzędziowym programu Fireworks.

    Fireworks wysyła zmodyfikowane menu z powrotem do programu Dreamweaver.

    Jeśli menu wyskakujące zostało utworzone w programie Fireworks MX 2004 lub jego starszych wersjach, można je edytować w programie Dreamweaver za pomocą okna dialogowego Pokaż menu wyskakujące, dostępnego na panelu Zachowania.

Edycja menu wyskakujących utworzonych w programie Fireworks MX 2004 lub starszych

  1. W programie Dreamweaver zaznacz punkt aktywny lub obraz wyzwalający menu wyskakujące.
  2. Na panelu Zachowania (Shift+F3), dwukrotnie kliknij opcje Pokaż menu wyskakujące, dostępną na liście Operacje.
  3. Wprowadź zmiany w oknie dialogowym Menu wyskakujące i kliknij przycisk OK.

Określanie preferencji uruchamiania i edycji dotyczących plików źródłowych Fireworks

Użycie programu Fireworks do edycji obrazów powoduje, że obrazy na stronach internetowej są w zwykły sposób eksportowane przez program Fireworks z pliku źródłowego PNG. Po otwarciu pliku obrazu do edycji w programie Dreamweaver program Fireworks automatycznie otwiera plik źródłowy PNG. Jeśli nie może znaleźć takiego pliku, prosi użytkownika o odszukanie go. Jeśli wolisz, możesz określić preferencje w programie Fireworks w taki sposób, by program Dreamweaver otwierał wstawiany obraz. Inną możliwością jest umożliwienie wyboru pomiędzy zastosowaniem wstawionego pliku obrazu albo pliku źródłowego Fireworks przy otwieraniu obrazu w programie Dreamweaver.

Uwaga:

Program Dreamweaver rozpoznaje preferencje uruchamiania i edytowania programu Fireworks tylko w określonych przypadkach. Oznacza to, że otwierany i optymalizowany obraz nie może być częścią tabeli Fireworks i musi zawierać poprawną ścieżkę funkcji Uwagi do projektu prowadzącą do pliku źródłowego PNG.

  1. W programie Fireworks wybierz polecenie Edycja > Preferencje (Windows) lub Fireworks > Preferencje (Macintosh) i kliknij zakładkę Uruchom i edytuj tabelę (Windows) lub wybierz polecenie Uruchom i edytuj (Macintosh).
  2. Określanie opcji preferencji do zastosowania przy edycji lub optymalizacji obrazów Fireworks umieszczanych w aplikacji zewnętrznej:

    Zawsze używaj źródłowego PNG

    Automatycznie otwiera plik Fireworks PNG, zdefiniowany w funkcji Uwagi do projektu jako źródło umieszczonego obrazu. Zmiany obejmują źródłowy plik PNG i odpowiedni obraz umieszczony.

    Nigdy nie używaj źródłowego PNG

    Automatycznie otwiera umieszczony Fireworks, bez względu na to, czy istnieje źródłowy plik PNG. Zmiany dotyczą tylko do obrazu umieszczonego.

    Pytaj przy uruchamianiu

    Wyświetla komunikat przed otwieraniem pliku źródłowego PNG. W tym oknie można określić też ogólne preferencje uruchamiania i edycji.

Wstawianie kodu Fireworks HTML w dokumencie Dreamweaver

W programie Fireworks można użyć polecenia Eksportuj, aby wyeksportować i zapisać zoptymalizowane obrazy i pliki HTML w folderze serwisu programu Dreamweaver. Plik taki można później wstawić do programu Dreamweaver. Program Dreamweaver umożliwia wstawienie do dokumentu kodu HTML wygenerowanego w programie Fireworks wraz z odpowiednimi obrazami, plasterkami i skryptami JavaScript.

  1. W dokumencie programu Dreamweaver należy umieścić punkt wstawiania tam, gdzie ma być umieszczony kod HTML programu Fireworks.
  2. Wykonaj jedną z następujących czynności:
    • Wybierz polecenie Wstaw > Obiekty obrazów > Fireworks HTML.

    • W kategorii Wspólne panelu Wstaw kliknij przycisk Obrazy i wybierz z wyskakującego menu opcję Wstaw HTML z programu Fireworks.

  3. Kliknij opcję Przeglądaj i zaznacz plik HTML z programu Fireworks.
  4. Jeśli plik nie będzie później potrzebny, zaznacz opcję Usuń plik po wstawieniu. Zaznaczenie tej opcji nie wpływa na plik źródłowy PNG związany z danych plikiem HTML.
    Uwaga:

    Jeśli plik HTML znajduje się na dysku sieciowym, to zostanie trwale usunięty, a nie przeniesiony do Kosza lub folderu Trash.

  5. Kliknij przycisk OK, aby wstawić kod HTML wraz z dołączonymi obrazami, plasterkami i skryptami JavaScript do dokumentu programu Dreamweaver.

Wklejanie kodu HTML z programu Fireworks do programu Dreamweaver

Szybkim sposobem na umieszczenie obrazów i tabel wygenerowanych przez program Fireworks do programu Dreamweaver jest skopiowanie i wklejenie kodu HTML programu Fireworks bezpośrednio do dokumentu programu Dreamweaver.

Kopiowanie i wklejanie kodu HTML z programu Fireworks do aplikacji Dreamweaver

  1. W programie Fireworks wybierz polecenie Edycja > Kopiuj kod HTML.
  2. Wykonaj kolejno polecenia kreatora dotyczące ustawień eksportu kodu HTML i obrazów. Gdy pojawi się odpowiedni komunikat, podaj nazwę folderu serwisu programu Dreamweaver jako miejsca docelowego eksportowanych obrazów.

    Kreator eksportuje obrazy w określone miejsce i kopiuje kod HTML do Schowka.

  3. W dokumencie programu Dreamweaver należy umieścić punkt wstawiania tam, gdzie ma być wklejony kod HTML i wybrać polecenie Edycja > Wklej kod HTML z programu Fireworks.

    Wszystkie kody HTML i JavaScript związane z eksportowanymi plikami Fireworks są kopiowane do dokumentu programu Dreamweaver, a wszystkie łącza do obrazów są uaktualniane.

Eksportowanie i wklejanie kodu HTML z programu Fireworks do aplikacji Dreamweaver

  1. W programie Fireworks wybierz polecenie Plik > Eksportuj.
  2. Podaj nazwę folderu serwisu Dreamweaver jako miejsca docelowego eksportowanych obrazów.
  3. W menu Eksportuj zaznacz opcję HTML i obrazy.
  4. Wybierz opcję Kopiuj do Schowka z menu HTML, a następnie kliknij opcję Eksportuj.
  5. W dokumencie programu Dreamweaver należy umieścić punkt wstawiania tam, gdzie ma być wklejony wyeksportowany kod HTML i wybrać polecenie Edycja > Wklej HTML z Fireworks.

    Wszystkie kody HTML i JavaScript związane z eksportowanymi plikami Fireworks są kopiowane do dokumentu programu Dreamweaver, a wszystkie łącza do obrazów są uaktualniane.

Uaktualnianie kodu HTML z programu Fireworks umieszczonego w aplikacji Dreamweaver

W programie Fireworks dostępne jest polecenie Plik > Uaktualnij HTML, które umożliwia zastosowanie techniki uaktualniania plików Fireworks umieszczanych w programie Dreamweaver, alternatywnej do techniki uruchamiania i edycji. Opcja Uaktualnij HTML umożliwia edycję źródłowego obrazu PNG w programie Fireworks i automatyczne uaktualnianie eksportowanego kodu HTML i plików obrazów umieszczanych w dokumencie programu Dreamweaver. Polecenie umożliwia uaktualnienie plików programu Dreamweaver, nawet jeśli program nie jest uruchomiony.

  1. W Fireworks, otwórz źródłowy plik PNG i wprowadź określone zmiany.
  2. Wybierz polecenie Plik > Zapisz.
  3. W programie Fireworks wybierz polecenie Plik > Uaktualnij HTML.
  4. Przejdź do pliku programu Dreamweaver, który zawiera kod HTML do uaktualnienia, i kliknij opcję Otwórz.
  5. Wyszukaj folder docelowy wybrany do umieszczenia uaktualnionych plików obrazów i kliknij opcję Zaznacz (Windows) lub Wybierz (Macintosh).

    Fireworks uaktualnia kod HTML i JavaScript w dokumencie programu Dreamweaver. Program Fireworks wyeksportuje także uaktualnione obrazy związane z kodem HTML i umieści te obrazy w określonym folderze docelowym.

    Jeśli program Fireworks nie może odnaleźć odpowiedniego kodu HTML do uaktualnienia, udostępni opcję umieszczenia nowego kodu HTML w dokumencie programu Dreamweaver. Program Fireworks umieszcza sekcję JavaScript nowego kodu na początku dokumentu, a tabelę HTML lub łączy do obrazu — na końcu.

Tworzenie internetowego albumu fotograficznego

W programie Dreamweaver CS5 funkcja „Utwórz internetowy album fotografii” nie jest już używana.

Adobe

Pomoc dostępna szybciej i łatwiej

Nowy użytkownik?