Podręcznik użytkownika Anuluj

Tworzenie i otwieranie plików

Szukaj

Ostatnia aktualizacja 3 lut 2022

Tworzenie, otwieranie, edytowanie, zapisywanie i przywracanie plików w programie Dreamweaver. Tworzenie szablonów i otwieranie plików powiązanych.

Program Dreamweaver udostępnia elastyczne środowisko do pracy z wieloma różnymi dokumentami WWW. Oprócz dokumentów HTML można tworzyć i otwierać wiele dokumentów tekstowych, m.in. JavaScript, PHP i CSS (Cascading Style Sheets).

Program Dreamweaver oferuje kilka opcji tworzenia nowego dokumentu. Możesz utworzyć:

Nowy, pusty dokument lub szablon
Dokument oparty na jednym z gotowych układów strony dołączonych do programu Dreamweaver, np. jednym z ponad 30 układów wykorzystujących style CSS
Dokument oparty na jednym z istniejących szablonów
Można również ustawiać odpowiednio preferencje dokumentu. Na przykład jeżeli na ogół posługujesz się jednym rodzajem dokumentów, możesz ustawić ten rodzaj jako domyślny typ dokumentu w przypadku nowych stron.
W widoku Projekt albo w widoku Kod można łatwo definiować właściwości dokumentu, np. znaczniki META, tytuł dokumentu, kolor tła i kilka innych cech strony.

Typy plików w programie Dreamweaver

W programie Dreamweaver można pracować nad różnymi typami plików. Podstawowym typem jest plik HTML. Pliki HTML (Hypertext Markup Language) zawierają język znacznikowy, który umożliwia wyświetlanie strony WWW w przeglądarce. Takie pliki można zapisywać z rozszerzeniem .html lub .htm. Domyślnie program Dreamweaver zapisuje pliki z rozszerzeniem .html.

Program Dreamweaver umożliwia tworzenie i edytowanie stron internetowych w języku HTML5. Dostępne są również układy startowe, umożliwiające tworzenie stron HTML5 od zera.

Poniżej wymieniono inne typy plików często używane w programie Dreamweaver:

CSS

Pliki z arkuszami stylów kaskadowych mają rozszerzenie .css. Służą do formatowania zawartości HTML i sterowania położeniem różnych elementów strony.

GIF

Pliki formacie GIF (Graphics Interchange Format) mają rozszerzenie .gif. Jest to popularny format grafiki internetowej, używany do wyświetlania komiksów, znaków logo, grafiki z przezroczystością oraz animacji. Pliki GIF mogą zawierać tylko 256 kolorów.

JPEG

Pliki w formacie JPEG (Joint Photographic Experts Group — jest to nazwa organizacji, która opracowała ten format) mają rozszerzenie .jpg i zawierają zazwyczaj fotografie lub obrazy w pełnych kolorach. Format JPEG najlepiej nadaje się do wyświetlania fotografii cyfrowych albo skanowanych, obrazów zawierających tekstury, obrazów ze stopniowymi przejściami kolorów oraz wszystkich tych obrazów, które składają się z ponad 256 kolorów.

XML

Pliki XML (Extensible Markup Language) mają rozszerzenie .xml. Zawiera dane w postaci nieprzetworzonej, które można formatować za pomocą języka XSL (Extensible Stylesheet Language).

Okno dialogowe Nowy dokument

Okno dialogowe Nowy dokument wyświetla wszystkie obsługiwane typy dokumentów, w tym PHP, XML oraz SVG.

Za pomocą tego okna dialogowego można również uzyskać dostęp do gotowych układów, szablonów i struktur.

Uwaga:

Wszystkie wyszczególnione w nim układy startowe są przygotowane do obsługi serwisów reagujących i zgodne ze standardem HTML5.

Tworzenie układu HTML od pustej strony

Tworząc stronę, można wykorzystać gotowy układ CSS. Można również utworzyć zupełnie pustą stronę i zbudować na niej własny układ.

Wybierz polecenie Plik > Nowy.
W kategorii Nowy dokument wybierz odpowiedni typ strony z kolumny Typ dokumentu. Na przykład aby utworzyć zwykłą stronę HTML, wybierz opcję HTML.
Wybierz typ dokumentu z wyskakującego menu DocType. W większości przypadków można użyć domyślnej opcji, czyli HTML5.
Wybierz dodatkowe opcje w zależności od typu strony, którą chcesz utworzyć.
- Brak: Wybierz tę opcję, jeśli chcesz utworzyć prostą stronę internetową bez użycia struktury.
- Bootstrap: Szablony Bootstrap to gotowe układy utworzone z użyciem struktury Bootstrap. Wybierz tę opcję, jeśli chcesz tworzyć reagujące serwisy WWW, korzystając ze struktury Bootstrap. Domyślnie tworzony jest dokument Bootstrap 4.0.0.
Uwaga:

Wybierz tę opcję, jeśli zamierzasz tworzyć reagujące serwisy WWW z użyciem struktury Bootstrap.
Jeśli nie używasz struktury:
- Tytuł dokumentu: W tym polu należy wpisać tytuł dokumentu, który program Dreamweaver automatycznie doda do jego sekcji <head>.
- DocType: Wybierz typ dokumentu z wyskakującego menu DocType. W większości przypadków można użyć domyślnej opcji, czyli HTML5.
Wybór jednej z definicji typu dokumentu XHTML z menu DocType spowoduje, że strona będzie zgodna ze standardem XHTML. Np. aby zapewnić zgodność dokumentu HTML ze standardem XHTML, należy wybrać z wyskakującego menu opcję XHTML 1.0 Transitional albo XHTML 1.0 Strict. XHTML (Extensible Hypertext Markup Language) to nowa specyfikacja języka HTML jako jednego z zastosowań standardu XML. Mówiąc ogólnie, użycie języka XHTML udostępnia wszystkie zalety standardu XML, gwarantując jednocześnie zgodność wsteczną i przyszłą dokumentów WWW.
Uwaga:

Więcej informacji o języku XHTML można znaleźć w serwisie internetowym organizacji World Wide Web Consortium (W3C), który zawiera specyfikację XHTML 1.1 — XHTML modułowy (www.w3.org/TR/xhtml11/) oraz XHTML 1.0 (www.w3c.org/TR/xhtml1/), a także w serwisach walidatorów kodu XHTML w plikach opublikowanych w sieci WWW (http://validator.w3.org/) i plikach lokalnych (http://validator.w3.org/file-upload.html).
- Dołącz CSS: Do strony można dołączyć istniejący układ CSS. Aby to zrobić, kliknij ikonę Dołącz arkusz stylów , znajdującą się nad panelem Dołącz plik CSS, i wybierz arkusz stylów CSS.
Tworzenie nowej strony HTML bez użycia struktury

Jeśli chcesz utworzyć nową stronę na podstawie kompozycji programu Photoshop, wybierz opcję „Skorzystaj z narzędzia Extract, aby zbudować stronę na podstawie kompozycji układu z programu Photoshop”.

Wybranie tej opcji powoduje otwarcie panelu Extract, na którym można przesłać plik PSD rozpocząć tworzenie strony HTML.
Jeśli chcesz utworzyć reagującą stronę WWW, korzystając ze struktury Bootstrap:
- CSS Bootstrap: Można utworzyć nowy arkusz stylów CSS struktury Bootstrap albo użyć istniejącego. Jeśli korzystasz z istniejącego pliku CSS, podaj ścieżkę do niego. Upewnij się, że ten plik CSS znajduje się w katalogu głównym serwisu.
- Dołącz CSS: Do strony można dołączyć istniejący układ CSS. Aby to zrobić, kliknij ikonę Dołącz arkusz stylów , znajdującą się nad panelem Dołącz plik CSS, i wybierz arkusz stylów CSS.
- Dołącz prefabrykowany układ: Wybierz tę opcję, jeśli masz już gotowy układ. Kliknij opcję Dostosuj, aby edytować siatkę i wartości punktów przerwań.
Tworzenie nowej strony HTML z użyciem struktury Bootstrap

Jeśli chcesz utworzyć nową stronę na podstawie kompozycji programu Photoshop, wybierz opcję „Skorzystaj z narzędzia Extract, aby zbudować stronę na podstawie kompozycji układu z programu Photoshop”.

Wybranie tej opcji powoduje otwarcie panelu Extract, na którym można przesłać plik PSD rozpocząć tworzenie strony HTML.
Kliknij opcję Preferencje, jeżeli chcesz ustawić domyślne preferencje dokumentu, takie jak typ dokumentu, kodowanie i rozszerzenie pliku.
Kliknij przycisk Utwórz.
Zapisz nowy dokument (Plik > Zapisz).
Zostanie wyświetlone okno dialogowe umożliwiające przejście do folderu, w którym chcesz zapisać plik.

Uwaga:

Warto zapisać go w serwisie programu Dreamweaver.
Wpisz nazwę pliku w polu Nazwa pliku.

W nazwach plików i folderów nie należy używać spacji ani znaków specjalnych. Nazwa pliku nie może zaczynać się od cyfry. W nazwach plików umieszczanych na serwerze zdalnym nie należy używać zwłaszcza znaków specjalnych (takich jak é, ç czy ¥) ani znaków interpunkcyjnych (np. średników, ukośników czy kropek). Wiele serwerów zmienia takie znaki podczas wysyłania, co spowoduje zerwanie wszystkich łączy do tych plików.

Tworzenie pustego szablonu

Za pomocą okna dialogowego Nowy dokument można tworzyć szablony programu Dreamweaver. Szablony są domyślnie zapisywane w folderze Szablony w strukturze serwisu.

Uwaga:

Szablon można utworzyć tylko wtedy, jeśli wcześniej został utworzony serwis. Więcej informacji o serwisach i ich tworzeniu podano w sekcji Informacje o serwisach programu Dreamweaver.

Wybierz polecenie Plik > Nowy.
W oknie dialogowym Nowy dokument wybierz kategorię Szablony serwisu.
Wybierz typ dokumentu z wyskakującego menu DocType. Najczęściej pole to trzeba pozostawić w ustawieniu domyślnym, czyli XHTML 1.0 Transitional.

Wybór jednej z definicji typu dokumentu XHTML z menu DocType (DTD) spowoduje, że strona będzie zgodna ze standardem XHTML. Np. aby zapewnić zgodność dokumentu HTML ze standardem XHTML, należy wybrać z wyskakującego menu opcję XHTML 1.0 Transitional albo XHTML 1.0 Strict. XHTML (Extensible Hypertext Markup Language) to nowa specyfikacja języka HTML jako jednego z zastosowań standardu XML. Mówiąc ogólnie, użycie języka XHTML udostępnia wszystkie zalety standardu XML, gwarantując jednocześnie zgodność wsteczną i przyszłą dokumentów WWW.

Uwaga:

Więcej informacji o języku XHTML można znaleźć w serwisie internetowym organizacji World Wide Web Consortium (W3C), który zawiera specyfikację XHTML 1.1 — XHTML modułowy (www.w3.org/TR/xhtml11/) oraz XHTML 1.0 (www.w3c.org/TR/xhtml1/), a także w serwisach walidatorów kodu XHTML w plikach opublikowanych w sieci WWW (http://validator.w3.org/) i plikach lokalnych (http://validator.w3.org/file-upload.html).
Zaznacz opcję „Uaktualnij stronę po zmianie szablonu”, jeśli strona ma być automatycznie uaktualniana w przypadku modyfikacji szablonu.
Kliknij przycisk Utwórz.
Zapisz nowy dokument (Plik > Zapisz). Jeżeli do szablonu nie dodano jeszcze regionów edytowalnych, to pojawi się okno dialogowe informujące, że w dokumencie nie istnieją żadne regiony edytowalne. Kliknij przycisk OK, aby zamknąć okno dialogowe.
W oknie dialogowym Zapisz jako wybierz serwis, w którym ma zostać zapisany szablon.
W polu tekstowym Nazwa pliku wpisz nazwę nowego szablonu. Nie musisz dodawać rozszerzenia pliku do nazwy szablonu. Gdy klikniesz przycisk Zapisz, do nazwy nowego szablonu zostanie dołączone rozszerzenie .dwt, a szablon zostanie zapisany w folderze Szablony w strukturze serwisu.

W nazwach plików i folderów nie należy używać spacji ani znaków specjalnych. Nazwa pliku nie może zaczynać się od cyfry. Nie używaj znaków specjalnych (takich jak é, ç czy ¥) ani znaków interpunkcyjnych (np. średników, ukośników czy kropek) w nazwach plików, które zamierzasz umieścić na serwerze zdalnym. Wiele serwerów zmienia takie znaki podczas wysyłania, co spowoduje zerwanie wszystkich łączy do tych plików.

Tworzenie strony opartej na szablonie

Dokumenty można tworzyć na podstawie własnych szablonów albo gotowych szablonów początkowych programu Dreamweaver. Po wybraniu szablonu można wyświetlić jego podgląd. W oknie dialogowym Nowy dokument można wybrać szablon z każdego z serwisów zdefiniowanych w programie Dreamweaver. Można również użyć panelu Zasoby, aby utworzyć nowy dokument z istniejącego szablonu.

Tworzenie dokumentu na podstawie szablonu

Wybierz polecenie Plik > Nowy.
W oknie dialogowym Nowy dokument wybierz kategorię Strona z szablonu.
W kolumnie Serwis wybierz serwis programu Dreamweaver zawierający szablon, którego chcesz użyć. Potem wybierz szablon z listy po prawej stronie.
Jeśli nie chcesz, aby strona była uaktualniana po każdej zmianie szablonu, na której ją oparto, wyłącz opcję Uaktualnij stronę po zmianie szablonu.
Kliknij opcję Preferencje, jeżeli chcesz ustawić domyślne preferencje dokumentu, takie jak typ dokumentu, kodowanie i rozszerzenie pliku.
Kliknij opcję Pobierz więcej zawartości, jeżeli chcesz się połączyć z serwisem Dreamweaver Exchange, z którego można pobierać dodatkową zawartość do projektowania stron.
Kliknij przycisk Utwórz i zapisz dokument (Plik > Zapisz).

Tworzenie dokumentu z szablonu wybranego na panelu Zasoby

Jeżeli panel Zasoby (Okno > Zasoby) nie jest jeszcze otwarty, otwórz go.
Kliknij ikonę Szablony umieszczoną po lewej stronie panelu Zasoby, aby wyświetlić listę szablonów w bieżącym serwisie.

Uwaga:

Jeżeli szablon, którego chcesz użyć, został utworzony niedawno, to konieczne może być kliknięcie przycisku Odśwież.
Kliknij szablon, który chcesz zastosować, prawym przyciskiem myszy (Windows) lub przytrzymując klawisz Control (Mac OS). Wybierz polecenie Nowy z szablonu.

Dokument otworzy się w oknie Dokument.
Zapisz dokument.

Tworzenie strony na podstawie szablonu początkowego programu Dreamweaver

Do programu Dreamweaver dołączono kilka profesjonalnych plików startowych do tworzenia aplikacji na urządzenia mobilne. Można wykorzystać te przykładowe pliki jako punkt wyjścia przy projektowaniu stron do własnych serwisów.

Gdy tworzy się dokument oparty na szablonie początkowym, program Dreamweaver wykonuje jego kopię, co pozwala uniknąć nadpisania plików szablonu.

W oknie dialogowym Nowy dokument można wyświetlić podgląd przykładowego pliku i przeczytać krótki opis elementów graficznych dokumentu.

Wybierz polecenie Plik > Nowy.
W oknie dialogowym Nowy dokument wybierz kategorię Szablony początkowe.

Szablony początkowe w programie Dreamweaver

Po wybraniu poszczególnych opcji po prawej stronie panelu są wyświetlane szczegółowe informacje o przykładowej stronie oraz jej wizualizacja.
Kliknij przycisk Utwórz.

Nowy dokument i wszystkie jego pliki dynamicznie powiązane zostaną otwarte w oknie Dokument.
Zapisz dokument (Plik > Zapisz).

Tworzenie nowych plików kodu w różnych językach programowania

W programie Dreamweaver można tworzyć pliki kodu w kilku różnych językach programowania.

Więcej informacji: Informacje o kodowaniu w programie Dreamweaver.

Wykonaj następujące instrukcje, aby utworzyć nowy plik kodu w programie Dreamweaver:

Wybierz polecenie Plik > Nowy Dokument.
Z menu Typ dokumentu wybierz rodzaj pliku programistycznego, który chcesz utworzyć.
W kolumnie Typ dokumentu wybierz rodzaj dokumentu, który chcesz utworzyć (na przykład PHP).

Tworzenie nowej strony PHP
W zależności od wybranego typu pliku podczas tworzenia dokumentu będą dostępne dodatkowe opcje.

Na przykład w przypadku plików PHP można wybrać opcje DocType oraz niektóre opcje CSS.
Kliknij przycisk Utwórz. Następnie zapisz dokument (Plik > Zapisz).

Zapisywanie i przywracanie dokumentów

Dokument możesz zapisać pod jego obecną nazwą i w tym samym miejscu, a także zapisać jego kopię pod inną nazwą i w innym miejscu.

Uwaga:

Nadając plikom nazwy, unikaj spacji i znaków specjalnych w nazwach plików i folderów. Przede wszystkim, nie używaj znaków specjalnych (takich jak é, ç czy ¥) ani znaków interpunkcyjnych (np. średników, ukośników czy kropek) w nazwach plików, które zamierzasz umieścić na serwerze zdalnym. Wiele serwerów zmienia takie znaki podczas wysyłania, co spowoduje zerwanie wszystkich łączy do tych plików. Ponadto nie zaczynaj nazwy pliku od liczby.

Zapisywanie dokumentu

Wykonaj jedną z następujących czynności:
- Aby nadpisać bieżącą wersję na dysku i zapisać wszystkie wprowadzone zmiany, wybierz polecenie Plik > Zapisz.
- Aby zapisać plik w innym folderze lub pod inną nazwą, wybierz polecenie Plik > Zapisz jako.
Zostanie wyświetlone okno dialogowe Zapisz jako. Przejdź do folderu, w którym chcesz zapisać plik.
W polu tekstowym Nazwa pliku wpisz nazwę pliku.
Kliknij opcję Zapisz, aby zapisać plik.

Zapisywanie wszystkich otwartych dokumentów

Wybierz polecenie Plik > Zapisz wszystko.
Jeżeli otwarte są niezapisane jeszcze dokumenty, to program wyświetli okno dialogowe Zapisz jako dla każdego takiego dokumentu.

Zostanie wyświetlone okno dialogowe umożliwiające przejście do folderu, w którym chcesz zapisać plik.
W polu tekstowym Nazwa pliku wpisz nazwę pliku i kliknij przycisk Zapisz.

Przywracanie ostatnio zapisanej wersji dokumentu

Wybierz polecenie Plik > Przywróć.

Pojawi się okno dialogowe z pytaniem, czy odrzucić zmiany i przywrócić poprzednio zapisaną wersję.
Kliknij przycisk Tak, aby wrócić do poprzedniej wersji. Kliknij przycisk Nie, jeśli chcesz zachować zmiany.

Uwaga:

Jeżeli zapiszesz dokument i zamkniesz program Dreamweaver, to po kolejnym uruchomieniu programu nie będzie można przywrócić poprzednio zapisanej wersji.

Ustawianie domyślnego typu dokumentu i kodowania — preferencje

Jeśli większość stron w serwisie ma konkretny typ (np. są to dokumenty HTML, PHP lub JavaScript), preferencje dokumentu można ustawić w taki sposób, aby automatycznie tworzyć nowe dokumenty tego typu.

Wybierz polecenie Edycja > Preferencje (Windows) lub Dreamweaver > Preferencje (Macintosh).

Uwaga:

Tworząc nowy dokument można również kliknąć przycisk Preferencje w oknie dialogowym Nowy dokument, aby określić preferencje nowych dokumentów.
Z listy Kategoria po lewej stronie wybierz opcję Nowy dokument.
Ustaw lub zmień preferencje stosownie do potrzeb i kliknij przycisk OK, aby je zapisać.

Domyślny dokument

Wybierz typ dokumentu, który będzie używany w przypadku nowo tworzonych stron.

Domyślne rozszerzenie

Określa preferowane rozszerzenie pliku (.htm lub .html) nowych stron HTML.

Uwaga: Ta opcja nie jest dostępna w przypadku innych typów plików.

Domyślny typ dokumentu (DTD)

Wybierz jedną z definicji typu dokumentu (DTD) w standardzie XHTML, aby nowe strony były zgodne z tym standardem. Np. aby zapewnić zgodność dokumentu HTML ze standardem XHTML, należy wybrać z wyskakującego menu opcję XHTML 1.0 Transitional albo XHTML 1.0 Strict.

Domyślne kodowanie

Określa kodowanie używane przy tworzeniu nowej strony oraz otwieraniu dokumentu, w którym nie określono żadnego kodowania.

Jeżeli wybierzesz kodowanie dokumentu w standardzie Unicode (UTF-8), kodowanie encji znakowych jest niepotrzebne, ponieważ UTF-8 umożliwia bezpieczne przedstawienie wszystkich znaków. Jeżeli wybierzesz inne kodowanie dokumentu, do wyświetlenia niektórych znaków konieczne może być kodowanie encji znakowych. Więcej informacji na temat encji znakowych zawiera strona www.w3.org/TR/REC-html40/sgml/entities.html.

Jeżeli ustawisz kodowanie Unicode (UTF-8) jako domyślne kodowanie, to możesz dodać do dokumentu znacznik kolejności bajtów BOM. Aby to zrobić, zaznacz opcję Dołącz sygnaturę Unicode (BOM).

Znacznik BOM to pierwsze 2-4 bajty na początku pliku tekstowego, które określają, czy jest to plik Unicode, a jeśli tak, to definiują kolejność bajtów w reszcie pliku. Ponieważ w standardzie UTF-8 nie ma kolejności bajtów, znacznik BOM dla UTF-8 jest opcjonalny. Natomiast dla standardów UTF-16 i UTF-32 jest obowiązkowy.

Formuła normalizacji Unicode

Jeżeli jako domyślne kodowanie ustawisz standard Unicode (UTF-8), to wybierz jedną z następujących opcji.

Istnieją cztery formuły normalizacji Unicode. Najważniejsza jest Formuła C, ponieważ jest to formuła najczęściej używana w modelu znakowym sieci WWW. Adobe udostępnia pozostałe trzy formuły normalizacji Unicode dla zapewnienia pełnego wyboru.

Pokaż okno dialogowe Nowy dokument po naciśnięciu Control+N

Jeśli chcesz, aby po naciśnięciu tej kombinacji klawiszy (na komputerach Macintosh — „Command+N”) automatycznie tworzony był dokument o domyślnym typie, wyłącz tę opcję.

W standardzie Unicode niektóre znaki są do siebie wizualnie podobne, ale mogą być w różny sposób przechowywane w dokumencie. Np. znak „ë” (e‑umlaut) może być reprezentowany przez pojedynczy znak, „e‑umlaut”, albo przez dwa znaki, „zwykłe e łacińskie” + „połączenie z umlautem”. Znak połączeniowy w Unicode to taki znak, który jest używany razem z poprzedzającym go znakiem. Zatem znak umlautu pojawi się nad „łacińskim e”. Obie formuły dają ten sam wygląd typograficzny, jednak różni się sposób ich zapisu w pliku.

Normalizacja to proces polegający na zapewnianiu, by wszystkie znaki, które można zapisać na różne sposoby, zostały zapisane za pomocą tej samej formuły. Zatem wszystkie znaki „ë” w dokumencie zostaną zapisane jako pojedynczy znak „e‑umlaut”, albo jako znaki „e” + „połączeniowy umlaut”. W jednym dokumencie nie wystąpią dwie różne formuły.

Więcej informacji na temat normalizacji Unicode i specyficznych formuł, których można używać, zawiera strona www.unicode.org/reports/tr15.

Otwieranie i edytowanie istniejących dokumentów

W programie Dreamweaver można otwierać istniejące strony WWW i dokumenty tekstowe, nawet jeżeli zostały utworzone w innych programach, i edytować je w widoku Projekt lub w widoku Kod.

Jeżeli otwierany dokument jest plikiem z programu Microsoft Word zapisanym jako dokument HTML, to można użyć polecenia Narzędzia > Oczyść kod HTML utworzony przez program Word, aby usunąć niepotrzebne znaczniki wstawiane przez program Word do plików HTML.

Aby oczyścić plik HTML lub XHTML, który nie został wygenerowany przez program Microsoft Word, użyj polecenia Narzędzia > Oczyść HTML. Więcej informacji: Oczyszczanie kodu HTML utworzonego przez program Microsoft Word.

Możesz również otwierać pliki tekstowe inne niż HTML, np. pliki JavaScript i XML, arkusze stylów CSS oraz pliki zapisane przez edytory tekstu.

Wybierz polecenie Plik > Otwórz.

Uwaga:

Pliki możesz otwierać również za pomocą panelu Pliki.
Przejdź do wybranego pliku i zaznacz go.

Uwaga:

Jeżeli pliki, które chcesz otwierać i edytować, nie są jeszcze zorganizowane w serwis programu Dreamweaver, warto zrobić to teraz, zamiast otwierać je z różnych miejsc. Więcej informacji: Informacje o serwisach programu Dreamweaver.
Kliknij przycisk Otwórz.

Dokument otworzy się w oknie dokumentu. Pliki JavaScript, pliki tekstowe i arkusze stylów CSS otwierają się domyślnie w widoku Kod. Pracując w programie Dreamweaver, możesz uaktualniać dokument i zapisywać zmiany w pliku.

Otwieranie plików powiązanych

Program Dreamweaver pozwala przeglądać pliki powiązane z głównym dokumentem bezpośrednio w oknie dokumentu. Na przykład jeśli z pewnym dokumentem głównym są powiązane pliki CSS i JavaScript, to można wyświetlać je i edytować w oknie dokument programu Dreamweaver, bez konieczności zamykania czy ukrywania głównego dokumentu.

Więcej informacji: Otwieranie plików dynamicznie powiązanych.

Uwaga:

Podczas pracy nad plikiem HTML można szybko wprowadzić zmiany w powiązanych z nim plikach CSS, JavaScript lub PHP bez potrzeby przełączania się na te pliki. Służy do tego funkcja Szybka edycja. Więcej informacji: Szybka edycja.

Wszystkie nazwy plików powiązanych z głównym dokumentem są wyświetlane domyślnie na pasku narzędziowym Pliki powiązane programu Dreamweaver, pod tytułem głównego dokumentu. Kolejność przycisków na pasku narzędziowym odpowiada kolejności łączy do plików powiązanych w głównym dokumencie.

Uwaga:

Jeśli pewien plik powiązany zostanie utracony, program Dreamweaver nadal będzie wyświetlał odpowiadający mu przycisk na pasku narzędziowym Pliki powiązane. Kliknięcie tego przycisku nie spowoduje jednak żadnej reakcji programu Dreamweaver.

Program Dreamweaver obsługuje pliki powiązane następującego typu:

Pliki skryptów po stronie klienta
Dołączenia po stronie serwera
Zewnętrzne arkusze stylów CSS (w tym zagnieżdżone arkusze stylów)

Otwieranie pliku powiązanego za pomocą paska narzędziowego Pliki powiązane

Wykonaj jedną z następujących czynności:

Na pasku narzędziowym Pliki powiązane, który znajduje się u góry okna dokumentu, kliknij nazwę wybranego pliku powiązanego.
Na pasku narzędziowym Pliki powiązane kliknij nazwę wybranego pliku powiązanego prawym przyciskiem myszy, a następnie wybierz z menu kontekstowego polecenie Otwórz jako oddzielny plik. Jeśli plik powiązany zostanie otwarty tą metodą, przestanie być widoczny główny dokument.

Otwieranie pliku powiązanego za pomocą Nawigatora kodu

Umieść punkt wstawiania w wierszu lub w obszarze, który jest zależny od pliku powiązanego.
Poczekaj, aż pojawi się wskaźnik Nawigatora kodu, a następnie kliknij go, aby otworzyć okno Nawigatora.
Aby wyświetlić informacje o pewnych elementach widocznych w oknie Nawigatora kodu, ustaw i zatrzymaj nad nimi kursor myszy. Na przykład jeśli chcesz zmienić właściwość konkretnego koloru CSS, ale nie znasz reguły dotyczącej tej właściwości, możesz zidentyfikować ją, zatrzymując kursor nad kolejnymi regułami, które są widoczne w oknie Nawigatora kodu.
Kliknij interesujący Cię element, aby otworzyć odpowiadający mu plik powiązany.

Powrót do kodu źródłowego głównego dokumentu

Kliknij przycisk Kod źródłowy na pasku narzędziowym Pliki powiązane.

Zmiana sposobu wyświetlania plików powiązanych

Jeśli plik powiązany zostanie otwarty w widoku Projekt albo w widoku Kod i Projekt (widok podzielony), to będzie on wyświetlany w widoku podzielonym nad widokiem projektu głównego dokumentu.

Wybierając polecenie Widok > Podziel, można ustawić różne opcje podziału, aby dostosować ten widok.

Jeśli chcesz wyświetlać powiązane pliki tylko w widoku Kod, wybierz opcję Kod w górnej części paska.

Uwaga:

Standardowy widok Kod nie pozwala na jednoczesne wyświetlanie plików powiązanych z dokumentem i kodu źródłowego tego dokumentu.

Uwaga:

Fraza „widok Kod” w nazwie opcji wyświetlania odnosi się do kodu źródłowego głównego dokumentu. Na przykład jeśli zostanie zaznaczona opcja Widok > Widok Kod na wierzchu, to kod źródłowy głównego dokumentu będzie wyświetlany w górnej połowie okna dokumentu. Jeśli natomiast zostanie zaznaczona opcja Widok > Widok Kod po lewej, program Dreamweaver wyświetli kod źródłowy głównego dokumentu w lewej części okna Dokument.

Wyłączanie plików powiązanych

Po otwarciu pliku HTML program Dreamweaver domyślnie wyświetla jego pliki powiązane na osobnych kartach. To domyślne zachowanie można wyłączyć w oknie Preferencje.

Wybierz polecenie Edycja > Preferencje (Windows) lub Dreamweaver > Preferencje (Macintosh).
W kategorii Ogólne odznacz opcję Włącz pliki powiązane.

Otwieranie plików dynamicznie powiązanych

Funkcja Pliki dynamicznie powiązane rozszerza możliwości funkcji Pliki powiązane, umożliwiając wyświetlanie plików powiązanych na stronach dynamicznych na pasku narzędziowym Pliki powiązane. Funkcja Pliki dynamicznie powiązane pozwala na wyświetlanie licznych elementów dołączanych dynamicznie, które są niezbędne do wygenerowania kodu wykonawczego popularnych systemów CMS z otwartym kodem źródłowym PHP, takich jak WordPress, Joomla! i Drupal.

Aby można było korzystać z funkcji plików dynamicznie powiązanych, niezbędny jest dostęp do lokalnego lub zdalnego serwera aplikacji PHP, na którym uruchomiono platformę WordPress, Drupal lub Joomla! Często stosuje się podejście polegające na skonfigurowaniu serwera aplikacji PHP na komputerze lokalnym z użyciem adresu localhost. Umożliwia to lokalne testowanie stron.

Przed przystąpieniem do testowania stron należy wykonać następujące kroki:

Skonfiguruj serwis programu Dreamweaver, pamiętając o wypełnieniu pola Adres WWW w oknie dialogowym Konfiguracja serwisu.
Skonfiguruj serwer PHP.

Uwaga: serwer ten musi zostać uruchomiony przed rozpoczęciem korzystania z funkcji plików dynamicznie powiązanych w programie Dreamweaver.
Zainstaluj platformę WordPress, Joomla! lub Drupal na serwerze aplikacji. Więcej informacji:
W programie Dreamweaver zdefiniuj folder lokalny, do którego będą pobierane pliki z systemu CMS i w którym będziesz je edytować.
Definiuje lokalizację, w której zainstalowano pliki WordPress, Drupal lub Joomla, jako folder zdalny i testowy.
Pobierz pliki z systemu CMS w folderze zdalnym.

Ustawianie preferencji plików dynamicznie powiązanych

Po otwarciu strony skojarzonej z plikami dynamicznie powiązanymi program Dreamweaver może wykryć te pliki automatycznie albo pozostawić je do ręcznego wykrycia przez użytkownika. Aby ręcznie wykryć pliki dynamicznie powiązane, kliknij łącze na pasku informacji nad stroną. Ustawienie domyślne to wykrywanie ręczne.

Wybierz polecenie Edycja > Preferencje (Windows) lub Dreamweaver > Preferencje (Macintosh).
Przejdź do kategorii Ogólne i upewnij się, że zaznaczona jest opcja Włącz pliki powiązane.
Z wyskakującego menu Pliki dynamicznie powiązane wybierz opcję Ręcznie lub Automatycznie. Można również całkowicie wyłączyć wykrywanie, wybierając opcję Wyłączone.

Wykryj pliki dynamicznie powiązane

Otwórz stronę, z którą są skojarzone pliki dynamicznie powiązane. Może to być np. strona index.php serwisu WordPress, Drupal lub Joomla!, znajdująca się w katalogu głównym tego serwisu.
Jeśli ustawione jest ręczne wykrywanie plików dynamicznie powiązanych (jest to wartość domyślna), kliknij łącze Wykryj na pasku informacji, który znajduje się nad stroną w oknie dokumentu.

Jeśli włączone jest automatyczne wykrywanie plików dynamicznie powiązanych, to na pasku Pliki powiązane pojawi się lista plików powiązanych dynamicznie.

Kolejność plików powiązanych i dynamicznie powiązanych na pasku narzędziowym Pliki powiązane jest następująca:

Statyczne pliki powiązane (czyli pliki powiązane, które nie wymagają dynamicznego przetwarzania);
Zewnętrzne pliki powiązane (pliki .css i .js), które są załączone do plików dołączanych dyrektywą INCLUDE z dynamicznej ścieżki na serwerze;
pliki dołączane dyrektywą INCLUDE z dynamicznej ścieżki na serwerze (pliki .php, .inc oraz .module).

Filtrowanie plików powiązanych

Liczba plików powiązanych i dynamicznie powiązanych jest często duża, dlatego program Dreamweaver udostępnia opcję filtrowania tych plików. Pozwala to na precyzyjne odszukanie potrzebnego pliku.

Otwórz stronę, z którą są skojarzone pliki powiązane.
Wykryj pliki dynamicznie powiązane, jeśli to konieczne.
Kliknij ikonę Filtruj pliki powiązane, która znajduje się po prawej stronie paska narzędziowego Pliki powiązane.
Wybierz typy plików, które mają być wyświetlane na pasku narzędziowym Pliki powiązane. Domyślnie program Dreamweaver wyświetla wszystkie pliki powiązane.
Aby utworzyć własny filtr, kliknij ikonę Filtruj pliki powiązane i wybierz opcję Filtr spersonalizowany.

Okno dialogowe Filtr spersonalizowany umożliwia filtrowanie tylko dokładnie podanych nazw plików (np. style.css), rozszerzeń plików (np. .php) oraz wyrażeń wieloznacznych, zawierających gwiazdki (np. *menu*). W filtrze można wykorzystać wiele wyrażeń wieloznacznych, rozdzielając poszczególne wyrażenia średnikiem (np. style.css;*.js;*tpl.php).

Uwaga:

Po zamknięciu pliku ustawienia filtra nie są zapamiętywane.

Oczyszczanie kodu HTML utworzonego przez program Microsoft Word

Pliki zapisane w formacie HTML za pomocą programu Microsoft Word (w wersji Microsoft Word 97 i nowszych) można otworzyć w programie Dreamweaver, a następnie usunąć nadmiarowy kod HTML generowany przez program Word za pomocą polecenia Oczyść kod HTML utworzony przez program Word.

Kod usuwany przez program Dreamweaver to przede wszystkim znaczniki, których Word używa do formatowania i wyświetlania dokumentów, a które nie są potrzebne do wyświetlania pliku HTML.

Zachowaj kopię zapasową oryginalnego pliku programu Word (.doc), bo może się okazać, że po oczyszczeniu kodu HTML nie można już otworzyć takiego pliku w programie Word.

Uwaga:

Aby oczyścić plik HTML lub XHTML, który nie został wygenerowany przez program Microsoft Word, użyj polecenia Narzędzia > Oczyść HTML.

Zapisz dokument Microsoft Word jako plik HTML.

Uwaga:

Pracując w systemie Windows, zamknij ten plik w Wordzie, aby uniknąć naruszenia zasad współużytkowania.
Otwórz plik HTML w programie Dreamweaver.

Aby obejrzeć kod HTML generowany przez program Word, przejdź do widoku Kod (Widok > Kod).
Wybierz polecenie Narzędzia > Oczyść kod HTML utworzony przez program Word.

Uwaga:

Jeżeli program Dreamweaver nie może wykryć, w której wersji Worda zapisano plik, wybierz odpowiednią wersję z wysuwanego menu.
Zaznacz lub wyłącz opcje oczyszczania. Wprowadzone preferencje zostaną zapisane jako domyślne ustawienia oczyszczania.

Program Dreamweaver zastosuje ustawienia oczyszczania do dokumentu HTML i wyświetli rejestr dokonanych zmian (o ile opcja rejestrowania nie została wcześniej wyłączona).

Opcje oczyszczania kodu HTML utworzonego przez program Microsoft Word

Usuń wszystkie oznaczenia programu Word

Usuwa wszystkie znaczniki HTML dotyczące programu Microsoft Word, w tym kod XML w znacznikach HTML, niestandardowe metadane programu Word i znaczniki łączy stosowane w nagłówku dokumentu, znaczniki XML programu Word, znaczniki warunkowe wraz z zawartością oraz puste akapity i marginesy, pochodzące ze stylów. Każdą z tych opcji z osobna można wybierać za pomocą karty Szczegóły.

Oczyść CSS

Usuwa wszystkie style CSS dotyczące programu Word, w tym wewnątrz-znacznikowe style CSS, o ile to możliwe (tam, gdzie styl nadrzędny ma takie same właściwości), atrybuty stylu rozpoczynające się od „mso”, deklaracje stylów inne niż CSS, atrybuty stylów z tabel, a także wszystkie nieużywane definicje stylów z sekcji HEAD. Opcję tę można modyfikować za pomocą karty Szczegóły.

Oczyść znaczniki <font>

Usuwa znacznik HTML, konwertując domyślny tekst treści na tekst HTML w rozmiarze 2.

Napraw błędnie zagnieżdżone znaczniki

Usuwa znaczniki FONT wstawiane przez Worda na zewnątrz znaczników akapitów i nagłówków (znaczników blokowych).

Zastosuj formatowanie źródła

Stosuje do dokumentu opcje formatowania kodu źródłowego, określone w preferencjach formatu HTML i pliku SourceFormat.txt.

Po zakończeniu pokaż dziennik

Natychmiast po zakończeniu czyszczenia wyświetlane jest okno ostrzeżenia ze szczegółami zmian wprowadzonych w dokumencie.
Kliknij przycisk OK lub — jeśli chcesz dalej dostosowywać opcje „Usuń wszystkie oznaczenia programu Word” oraz „Oczyść CSS” — kliknij zakładkę Szczegóły, a potem kliknij przycisk OK.

Więcej podobnych

Pomoc dostępna szybciej i łatwiej

Nowy użytkownik?

Tworzenie i otwieranie plików

Typy plików w programie Dreamweaver

Okno dialogowe Nowy dokument

Tworzenie układu HTML od pustej strony

Tworzenie pustego szablonu

Tworzenie strony opartej na szablonie

Tworzenie dokumentu na podstawie szablonu

Tworzenie dokumentu z szablonu wybranego na panelu Zasoby

Tworzenie strony na podstawie szablonu początkowego programu Dreamweaver

Tworzenie nowych plików kodu w różnych językach programowania

Zapisywanie i przywracanie dokumentów

Zapisywanie dokumentu

Zapisywanie wszystkich otwartych dokumentów

Przywracanie ostatnio zapisanej wersji dokumentu

Ustawianie domyślnego typu dokumentu i kodowania — preferencje

Otwieranie i edytowanie istniejących dokumentów

Otwieranie plików powiązanych

Otwieranie pliku powiązanego za pomocą paska narzędziowego Pliki powiązane

Otwieranie pliku powiązanego za pomocą Nawigatora kodu

Powrót do kodu źródłowego głównego dokumentu

Zmiana sposobu wyświetlania plików powiązanych

Wyłączanie plików powiązanych

Otwieranie plików dynamicznie powiązanych

Ustawianie preferencji plików dynamicznie powiązanych

Wykryj pliki dynamicznie powiązane

Filtrowanie plików powiązanych

Oczyszczanie kodu HTML utworzonego przez program Microsoft Word

Więcej podobnych

Pomoc dostępna szybciej i łatwiej

Zapytaj społeczność

Skontaktuj się z nami