W dokumencie programu Dreamweaver należy umieścić kursor w miejscu wstawienia obrazu i wykonać jedną z następujących czynności:
Ostatnia aktualizacja
25 kwi 2024
Programy Fireworks i Dreamweaver zapewniają sprawny obieg pracy, obejmujący edycję, optymalizację i umieszczanie plików grafiki internetowej na stronach HTML.
Spostrzeżenie
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.
Wybierz polecenie Wstaw > Obraz.
W kategorii Wspólne panelu Wstaw kliknij przycisk Obraz lub przeciągnij go na dokument.
Znajdź wyeksportowany plik Fireworks i kliknij przycisk OK (Windows) lub Otwórz (Macintosh).
Spostrzeżenie
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ę.
Spostrzeżenie
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.
Gdy obraz jest częścią tabeli Fireworks, można otworzyć całą tabelę Fireworks do edycji, o ile komentarz <!--fw table--> istnieje w kodzie HTML.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.
W programie Dreamweaver otwórz okno Inspektor właściwości (Okno > Właściwości).
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.
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.
Spostrzeżenie
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.
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.
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.
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.
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).
Upewnij się, że program Fireworks został zdefiniowany jako edytor obrazów PNG.
W oknie dokumentu zaznacz element zastępczy obrazu kliknięciem.
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.
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.
Spostrzeżenie
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.
Po zakończeniu kliknij przycisk Gotowe, aby wyświetlić monit umożliwiający zapisanie pliku.
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ć.
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.
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ć.
Z listy Zapisz jako typ wybierz typ pliku lub plików wybranych do eksportowania; na przykład „Tylko obrazy” lub „HTML i obrazy”.
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.
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.
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
W programie Dreamweaver zaznacz punkt aktywny lub obraz wyzwalający menu wyskakujące.
Na panelu Zachowania (Shift+F3), dwukrotnie kliknij opcje Pokaż menu wyskakujące, dostępną na liście Operacje.
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.
Spostrzeżenie
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.
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).
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.
W dokumencie programu Dreamweaver należy umieścić punkt wstawiania tam, gdzie ma być umieszczony kod HTML programu Fireworks.
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.
Kliknij opcję Przeglądaj i zaznacz plik HTML z programu Fireworks.
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.
Spostrzeżenie
Jeśli plik HTML znajduje się na dysku sieciowym, to zostanie trwale usunięty, a nie przeniesiony do Kosza lub folderu Trash.
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
W programie Fireworks wybierz polecenie Edycja > Kopiuj kod HTML.
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.
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
W programie Fireworks wybierz polecenie Plik > Eksportuj.
Podaj nazwę folderu serwisu Dreamweaver jako miejsca docelowego eksportowanych obrazów.
W menu Eksportuj zaznacz opcję HTML i obrazy.
Wybierz opcję Kopiuj do Schowka z menu HTML, a następnie kliknij opcję Eksportuj.
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.
W Fireworks, otwórz źródłowy plik PNG i wprowadź określone zmiany.
Wybierz polecenie Plik > Zapisz.
W programie Fireworks wybierz polecenie Plik > Uaktualnij HTML.
Przejdź do pliku programu Dreamweaver, który zawiera kod HTML do uaktualnienia, i kliknij opcję Otwórz.
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.
Tworzenie estetycznych serwisów internetowych w programie Dreamweaver
Projektowanie, pisanie kodu i zarządzanie dynamicznymi serwisami internetowymi za pomocą jednego, kompleksowego narzędzia.
