Bestanden maken, openen, bewerken, opslaan en herstellen in Dreamweaver. Sjablonen maken en bijbehorende bestanden openen.

Dreamweaver biedt een flexibele omgeving voor het werken met diverse webdocumenten. Naast HTML-documenten kunt u ook diverse tekstdocumenten maken en openen, waaronder JavaScript-documenten, PHP-documenten en CSS-stijlpagina's (Cascading Style Sheets).

Dreamweaver biedt verscheidene opties voor het maken van een nieuw document. U kunt elk van de volgende documenten maken:

  • Een nieuw, leeg document of een nieuwe, lege sjabloon.

  • Een document dat is gebaseerd op een van de vooraf ontworpen paginalay-outs die bij Dreamweaver worden geleverd, waaronder dertig op CSS gebaseerde paginalay-outs.

  • Een document dat is gebaseerd op een van uw bestaande sjablonen.

    U kunt ook documentvoorkeuren instellen. Als u bijvoorbeeld vaak werkt met een bepaald type document, kunt u dat als standaarddocumenttype instellen voor de nieuwe pagina's die u maakt.

    U kunt zowel in de ontwerpweergave als de codeweergave eenvoudig documenteigenschappen definiëren, zoals metatags, de documenttitel, achtergrondkleuren en verschillende andere pagina-eigenschappen.

Dreamweaver-bestandstypen

U kunt in Dreamweaver met allerlei verschillende bestandstypen werken. U zult het meest werken met HTML-bestanden. HTML-bestanden (Hypertext Markup Language) bevatten codetaal die verantwoordelijk is voor de weergave van een webpagina in een browser. U kunt HTML-bestanden opslaan met de extensie .html of .htm. In Dreamweaver worden bestanden standaard opgeslagen met de extensie .html.

Met Dreamweaver kunt u op HTML5 gebaseerde webpagina's maken en bewerken. Er zijn ook startlay-outs beschikbaar waarmee u helemaal zelf HTML-5 pagina's kunt samenstellen.

Hier volgen enkele andere veelvoorkomende bestandstypen die u kunt gebruiken bij het werken in Dreamweaver:

CSS

Cascading Style Sheet-bestanden hebben de extensie .CSS. Deze worden gebruikt om de HTML-inhoud op te maken en om de positie van de verschillende pagina-elementen te bepalen.

GIF

Graphics Interchange Format-bestanden hebben de extensie .GIF. De GIF-indeling is een populaire grafische webindeling voor cartoons, logo's, afbeeldingen met transparante gebieden en animaties. GIF-bestanden bevatten maximaal 256 kleuren.

JPEG

Joint Photographic Experts Group-bestanden (genoemd naar de organisatie die de indeling heeft gemaakt) hebben de extensie .JPG en zijn vaak foto's of afbeeldingen met vele kleuren. De JPEG-indeling kan het best worden gebruikt voor digitale of gescande foto's, afbeeldingen met structuren, afbeeldingen met kleurverloop en afbeeldingen waarvoor meer dan 256 kleuren nodig zijn.

XML

Extensible Markup Language-bestanden hebben de extensie .XML. Deze bestanden bevatten gegevens in onbewerkte vorm die kunnen worden opgemaakt met XSL (Extensible Stylesheet Language).

Het dialoogvenster Nieuw document

Het dialoogvenster Nieuw document weergeeft alle ondersteunende documentbestandtypes, waaronder PHP, XML en SVG.

U kunt ook vooraf gedefinieerde lay-outs, sjablonen en frameworks van dit dialoogvenster openen.

Opmerking:

Alle weergegeven startlay-outs zijn ontworpen om responsieve websites te ondersteunen en zijn compatibel met HTML-5.

Een HTML-lay-out maken met een lege pagina

U kunt een pagina maken die een vooraf ontworpen CSS-lay-out bevat, maar u kunt ook een volledig lege pagina maken en vervolgens zelf uw eigen lay-out maken.

  1. Selecteer Bestand > Nieuw.

  2. Selecteer in de categorie Nieuw document het type pagina dat u wilt maken uit de kolom Documenttype. Selecteer bijvoorbeeld HTML om een gewone HTML-pagina te maken.

  3. Selecteer een documenttype in het pop-upmenu Documenttype. In de meeste gevallen kunt u de standaardoptie gebruiken: HTML5.

  4. Selecteer aanvullende opties afhankelijk van het type pagina dat u wilt maken.

    • Geen: Selecteer deze optie als u een eenvoudige webpagina wilt maken zonder een framework te gebruiken.
    • Bootstrap: De Bootstrap-sjablonen zijn vooraf gedefinieerde lay-outs die het Bootstrap-framework gebruiken. Selecteer deze optie als u responsieve webpagina's wilt maken met het Bootstrap-framework.

    Opmerking:

    Selecteer het Bootstrap-framework als u van plan bent om responsieve webpagina´s te maken.

  5. Als u geen framework gebruikt:

    • Documenttitel: Voer uw documenttitel in in dit veld in en Dreamweaver voegt deze automatisch toe aan de sectie <head> van het document.
    • Documenttype: Selecteer een documenttype in het pop-upmenu Documenttype. In de meeste gevallen kunt u de standaardoptie gebruiken: HTML5.

    Als u een van de XHTML-documenttypedefinities in het menu Documenttype selecteert, wordt de pagina XHTML-compatibel. U kunt bijvoorbeeld een HTML-document maken dat voldoet aan de XHTML-standaard, door in het menu de optie XHTML 1.0 overgang of XHTML 1.0 strikt te selecteren. XHTML (Extensible Hypertext Markup Language) is een herformulering van HTML als een XML-toepassing. Gewoonlijk biedt het gebruik van XHTML u de voordelen van XML, terwijl tegelijkertijd de compatibiliteit van uw webdocumenten met oudere, hedendaagse en toekomstige browsers is gegarandeerd.

    Opmerking:

    Als u meer informatie wilt over XHTML, gaat u naar de website van het World Wide Web Consortium (W3C). Hier vindt u de specificatie voor XHTML 1.1 - op modules gebaseerde XHTML (www.w3.org/TR/xhtml11/) en XHTML 1.0 (www.w3c.org/TR/xhtml1/) en ook XHTML-validatiesites voor bestanden op het web (http://validator.w3.org/) en lokale bestanden (http://validator.w3.org/file-upload.html).

    • CSS koppelen: Koppel een bestaande CSS-lay-out aan de pagina. Klik hiertoe op het pictogram Stijlpagina koppelen naast het deelvenster CSS-bestand koppelen en selecteer een CSS-stijlpagina.
    Een nieuwe HTML-pagina maken zonder een framework te gebruiken
    Een nieuwe HTML-pagina maken zonder een framework te gebruiken

    Als u een nieuwe pagina wilt maken op basis van uw Photoshop-samenstelling, selecteert u Gebruik Extract om uw pagina te maken met Photoshop-samenstellingen. 

    Als u deze optie selecteert, wordt het deelvenster Extract geopend waar u een PSD-bestand kunt uploaden en kunt beginnen met het maken van uw uw HTML-pagina.

  6. Als u een responsieve webpagina wilt maken met het Bootstrap-framework:

    • Bootstrap CSS: Overweeg om een nieuwe Bootstrap CSS te maken of gebruik een bestaand CSS-bestand. Als u een bestaand CSS-bestand gebruikt, moet u het pad naar het bestand opgeven. Zorg ervoor dat het CSS-bestand zich binnen de hoofdmap van de site bevindt.
    • CSS koppelen: Koppel een bestaande CSS-lay-out aan de pagina. Klik hiertoe op het pictogram Stijlpagina koppelen naast het deelvenster CSS-bestand koppelen en selecteer een CSS-stijlpagina.
    • Voorgedefinieerde lay-out opnemen: Selecteer deze optie als u al een lay-out hebt. Klik op Aanpassen om het raster en waarden voor onderbrekingspunten te bewerken.
    Een nieuwe HTML-pagina maken met gebruik van het Bootstrap-framework
    Een nieuwe HTML-pagina maken met gebruik van het Bootstrap-framework

    Als u een nieuwe pagina wilt maken op basis van uw Photoshop-samenstelling, selecteert u Gebruik Extract om uw pagina te maken met Photoshop-samenstellingen. 

    Als u deze optie selecteert, wordt het deelvenster Extract geopend waar u een PSD-bestand kunt uploaden en kunt beginnen met het maken van uw uw HTML-pagina.

  7. Klik op Voorkeuren als u uw voorkeuren voor het standaarddocument wilt instellen, zoals documenttype, codering en bestandsextensie.

  8. Klik op de knop Maken.

  9. Sla het nieuwe document op (Bestand > Opslaan).

  10. Blader in het dialoogvenster dat wordt weergegeven naar de map waarin u het bestand wilt opslaan.

    Opmerking:

    U kunt uw bestand het beste opslaan op een Dreamweaver-site.

  11. Typ in het vak Bestandsnaam een naam voor het bestand.

    Gebruik geen spaties en speciale tekens in bestands- en mapnamen en laat een bestandsnaam niet beginnen met een cijfer. Gebruik vooral geen speciale tekens (zoals é, ç of ¥) of leestekens (zoals dubbele punten, schuine strepen of punten) in de namen van bestanden die u op een externe server wilt plaatsen. Door veel servers worden deze tekens tijdens het uploaden gewijzigd, waardoor koppelingen naar de bestanden niet meer werken.

Een lege sjabloon maken

U kunt het dialoogvenster Nieuw document gebruiken om Dreamweaver-sjablonen te maken. Sjablonen worden standaard opgeslagen in de map Sjablonen op uw site.

Opmerking:

U kunt geen sjabloon maken zonder eerst een site te maken. Voor informatie over sites en over hoe je een site kunt maken, zie Over Dreamweaver-sites.

  1. Selecteer Bestand > Nieuw.

  2. Selecteer in het dialoogvenster Nieuw document de categorie Sitejablonen.

  3. Selecteer een documenttype in het pop-upmenu Documenttype. In de meeste gevallen kunt u de standaardoptie die is geselecteerd, ongewijzigd laten: XHTML 1.0 Transitional.

    Als u een van de XHTML-documenttypedefinities in het menu DocType (DTD) selecteert, wordt de pagina XHTML-compatibel. U kunt bijvoorbeeld een HTML-document maken dat voldoet aan de XHTML-standaard, door in het menu de optie XHTML 1.0 overgang of XHTML 1.0 strikt te selecteren. XHTML (Extensible Hypertext Markup Language) is een herformulering van HTML als een XML-toepassing. Gewoonlijk biedt het gebruik van XHTML u de voordelen van XML, terwijl tegelijkertijd de compatibiliteit van uw webdocumenten met oudere, hedendaagse en toekomstige browsers is gegarandeerd.

    Opmerking:

    Als u meer informatie wilt over XHTML, gaat u naar de website van het World Wide Web Consortium (W3C). Hier vindt u de specificatie voor XHTML 1.1 - op modules gebaseerde XHTML (www.w3.org/TR/xhtml11/) en XHTML 1.0 (www.w3c.org/TR/xhtml1/) en ook XHTML-validatiesites voor bestanden op het web (http://validator.w3.org/) en lokale bestanden (http://validator.w3.org/file-upload.html).

  4. Selecteer Pagina bijwerken wanneer sjabloon wordt gewijzigd als u wilt dat de pagina automatisch wordt bijgewerkt als u het sjabloon bewerkt.

  5. Klik op de knop Maken.

  6. Sla het nieuwe document op (Bestand > Opslaan). Als u nog geen bewerkbare gebieden aan de sjabloon hebt toegevoegd, wordt er een dialoogvenster weergegeven waarin wordt vermeld dat er geen bewerkbare gebieden in het document aanwezig zijn. Klik op OK om het dialoogvenster te sluiten.

  7. Selecteer in het dialoogvenster Opslaan als een site waarin de sjabloon moet worden opgeslagen.
  8. Typ in het vak Bestandsnaam een naam voor de nieuwe sjabloon. U hoeft geen bestandsextensie aan de naam van de sjabloon toe te voegen. Wanneer u op Opslaan klikt, wordt de extensie .DWT aan de nieuwe sjabloon toegevoegd en wordt de sjabloon in de map Sjablonen van uw site opgeslagen.

    Gebruik geen spaties en speciale tekens in bestands- en mapnamen en laat een bestandsnaam niet beginnen met een cijfer. Gebruik vooral geen speciale tekens (zoals é, ç of ¥) of leestekens (zoals dubbele punten, schuine strepen of punten) in de namen van bestanden die u op een externe server wilt plaatsen. Door veel servers worden deze tekens tijdens het uploaden gewijzigd, waardoor koppelingen naar de bestanden niet meer werken.

Een pagina maken op basis van een sjabloon

U kunt een nieuw document selecteren, voorvertonen en maken met een van uw bestaande sjablonen of de eenvoudige sjablonen van Dreamweaver. U kunt het dialoogvenster Nieuw document gebruiken om een sjabloon te selecteren vanuit een van uw Dreamweaver-sites. U kunt ook het deelvenster Middelen gebruiken om een nieuw document te maken op basis van een bestaande sjabloon.

Een document maken op basis van een sjabloon

  1. Selecteer Bestand > Nieuw.

  2. Selecteer in het dialoogvenster Nieuw document de categorie Pagina van sjabloon.

  3. Selecteer in de kolom Site de Dreamweaver-site met de sjabloon die u wilt gebruiken. Selecteer vervolgens een sjabloon in de lijst aan de rechterkant.

  4. Schakel de optie Pagina bijwerken wanneer sjabloon wordt gewijzigd uit als u niet wilt dat deze pagina telkens wordt bijgewerkt wanneer u wijzigingen aanbrengt in de sjabloon waarop deze pagina is gebaseerd.

  5. Klik op Voorkeuren als u uw voorkeuren voor het standaarddocument wilt instellen, zoals documenttype, codering en bestandsextensie.

  6. Klik op Meer inhoud ophalen als u Dreamweaver Exchange wilt openen, waar u meer inhoud voor paginaontwerp kunt downloaden.

  7. Klik op Maken en sla het document op (Bestand > Opslaan).

Een document maken vanuit het deelvenster Middelen

  1. Open het deelvenster Middelen (Venster > Middelen), als dit nog niet geopend is.

  2. Klik in het deelvenster Middelen op het pictogram Sjablonen  aan de linkerkant om de lijst met sjablonen op de huidige site weer te geven.

    Opmerking:

    Als u zojuist de sjabloon hebt gemaakt die u wilt toepassen, moet u mogelijk op de knop Vernieuwen klikken om deze sjabloon weer te geven.

  3. Klik met de rechtermuisknop (Windows) of klik terwijl u Control ingedrukt houdt (Macintosh) op de sjabloon die u wilt toepassen, en selecteer vervolgens Nieuw van sjabloon.

    Het document wordt in het documentvenster geopend.

  4. Sla het document op.

Een pagina maken op basis van een eenvoudig Dreamweaver-sjabloon

Bij Dreamweaver worden verschillende professioneel ontworpen startbestanden voor mobiele toepassingen geleverd. U kunt deze voorbeeldbestanden gebruiken als uitgangspunt voor het ontwerpen van de pagina's van uw sites.

Wanneer u een document maakt op basis van een eenvoudig sjabloon, maakt Dreamweaver een kopie van het bestand, dus u overschrijft de startbestanden niet.

U kunt in het dialoogvenster Nieuw document een voorbeeldbestand voorvertonen en een korte beschrijving lezen van de ontwerpelementen van een document.

  1. Selecteer Bestand > Nieuw.

  2. Selecteer in het dialoogvenster Nieuw document de categorie Eenvoudige sjablonen.

    Eenvoudige sjablonen in Dreamweaver
    Eenvoudige sjablonen in Dreamweaver

    U kunt de details van de voorbeeldpagina en en visualisatie aan de rechterkant van het deelvenster zien terwijl u de verschillende opties selecteert.

  3. Klik op de knop Maken.

    Het nieuwe document en alle bijbehorende bestanden worden geopend in het Documentvenster.

  4. Sla het document op (Bestand > Opslaan).

Nieuwe codebestanden maken voor verschillende codetalen

U kunt codebestanden voor een aantal codetalen maken in Dreamweaver.

Zie voor meer informatie over codeer-ondersteuning in Dreamweaver informatie over coderen in Dreamweaver.

Volg de volgende instructies om een nieuw codebestand in Dreamweaver te maken:

  1. Selecteer Bestand > Nieuw document.

  2. Onder Documenttype selecteert u het codebestand dat u wilt maken.

  3. Selecteer het type document dat u wilt maken in de kolom Documenttype (bijvoorbeeld een PHP-bestand).

    Een nieuwe PHP-pagina maken
    Een nieuwe PHP-pagina maken

  4. Afhankelijk het bestandstype dat u selecteert zijn er extra opties beschikbaar bij het maken van een document. 

    Als u bijvoorbeeld een PHP-bestand maakt, kunt u DocType-opties en sommige CSS-opties selecteren.

  5. Klik op de knop Maken. Sla vervolgens het document op (Bestand > Opslaan).

Documenten opslaan en de vorige versie ervan herstellen

U kunt een document opslaan met de huidige naam en locatie, of een kopie van het document opslaan met een andere naam en locatie.

Opmerking:

Gebruik als u bestanden een naam geeft geen spaties en speciale tekens in bestands- en mapnamen. Gebruik vooral geen speciale tekens (zoals é, ç of ¥) of leestekens (zoals dubbele punten, schuine strepen of punten) in de namen van bestanden die u op een externe server wilt plaatsen. Door veel servers worden deze tekens tijdens het uploaden gewijzigd, waardoor koppelingen naar de bestanden niet meer werken. Begin een bestandsnaam ook niet met een cijfer.

Een document opslaan

  1. Voer een van de volgende handelingen uit:
    • Als u de huidige versie op de schijf wilt overschrijven en wijzigingen wilt opslaan die u hebt aangebracht, selecteert u Bestand > Opslaan.
    • Als u het bestand wilt opslaan in een andere map of met een andere naam, selecteert u Bestand > Opslaan als.
  2. Blader in het dialoogvenster Opslaan als dat verschijnt naar de map waarin u het bestand wilt opslaan.
  3. Typ in het tekstvak Bestandsnaam een naam voor het bestand.

  4. Klik op Opslaan om het bestand op te slaan.

Alle geopende documenten opslaan

  1. Selecteer Bestand > Alles opslaan.

  2. Als er niet-opgeslagen documenten zijn geopend, wordt het dialoogvenster Opslaan als weergegeven voor elk niet-opgeslagen document.

    Blader in het dialoogvenster dat wordt weergegeven naar de map waarin u het bestand wilt opslaan.

  3. Typ in het tekstvak Bestandsnaam een naam voor het bestand en klik op Opslaan.

Laatst opgeslagen versie van een document herstellen

  1. Selecteer Bestand > Vorige versie.

    Er wordt een dialoogvenster weergegeven waarin u wordt gevraagd of u uw wijzigingen wilt negeren en wilt terugkeren naar de vorige opgeslagen versie.

  2. Klik op Ja om terug te keren naar de vorige versie. Klik op Nee als u uw wijzigingen wilt behouden.

    Opmerking:

    Als u een document opslaat en vervolgens Dreamweaver afsluit, kunt u niet terugkeren naar de vorige versie van het document als u Dreamweaver opnieuw start.

Standaardocumenttype en -codering instellen voorkeuren

Als de meeste pagina's op uw site pagina's van een specifiek type zijn (zoals HTML, PHP of JavaScript), kunt u documentvoorkeuren instellen om automatisch nieuwe documenten van dat bestandstype aan te maken.

  1. Selecteer Bewerken > Voorkeuren (Windows) of Dreamweaver > Voorkeuren (Macintosh).

    Opmerking:

    U kunt ook op de knop Voorkeuren in het dialoogvenster Nieuw document klikken om uw voorkeuren voor nieuwe documenten in te stellen wanneer u een nieuw document maakt.

  2. Klik in de lijst met categorieën aan de linkerkant op Nieuw document.

  3. Stel de gewenste voorkeuren in of wijzig deze als dat nodig is en klik op OK om de voorkeuren op te slaan.

    Standaarddocument

    Selecteer een documenttype dat moet worden gebruikt voor de pagina's die u maakt.

    Standaardextensie

    Geef de gewenste bestandsextensie op (.htm of .html) voor de nieuwe HTML-pagina's die u maakt.

    Opmerking: Deze optie is uitgeschakeld voor andere bestandstypen.

    Standaarddocumenttype (DDT)

    Selecteer een van de XHTML-documenttypedefinities (DTD) om ervoor te zorgen dat de nieuwe pagina's voldoen aan de XHTML-standaard. U kunt bijvoorbeeld een HTML-document maken dat voldoet aan de XHTML-standaard door in het menu de optie XHTML 1.0 Transitional of XHTML 1.0 Strict te selecteren.

    Standaardcodering

    Geef de codering op die moet worden gebruikt als er een nieuwe pagina wordt gemaakt en die ook moet worden gebruikt als er een document wordt geopend waarvoor geen enkele codering is opgegeven.

    Als u Unicode (UTF-8) selecteert als documentcodering, is eenheidscodering niet nodig, omdat UTF-8 zonder problemen alle tekens kan vertegenwoordigen. Als u een andere documentcodering selecteert, hebt u mogelijk eenheidscodering nodig voor het vertegenwoordigen van bepaalde tekens. Zie www.w3.org/TR/REC-html40/sgml/entities.html voor meer informatie over tekeneenheden.

    Als u Unicode (UTF-8) selecteert als standaardcodering, kunt u een BOM (Byte Order Mark) in het document opnemen door de optie Unicode-handtekening (BOM) opnemen te selecteren.

    Een BOM bestaat uit de 2 tot 4 bytes aan het begin van een tekstbestand waarmee het bestand kan worden geïdentificeerd als een Unicode-bestand en waarmee ook de bytevolgorde van de volgende bytes wordt aangegeven. Omdat UTF-8 geen bytevolgorde heeft, is het toevoegen van een UTF-8 BOM optioneel. Voor UTF-16 en UTF-32 is het verplicht.

    Unicode-formulier

    Selecteer een van deze opties als u Unicode (UTF-8) als standaardcodering selecteert.

    Er zijn vier UNF's. De belangrijkste procedure is normalisatieprocedure C omdat deze het vaakst wordt gebruikt in het tekenmodel voor internet. Voor de volledigheid biedt Adobe de drie andere UNF's ook aan.

    Dialoogvenster Nieuw document tonen wanneer Control+N wordt ingedrukt

    Schakel deze optie uit (voor Command+N voor Macintosh) als u wilt dat er automatisch een document van het standaarddocumenttype wordt gemaakt wanneer u deze toetsencombinatie gebruikt.

    In Unicode worden tekens gebruikt die er op het oog precies eender uitzien, maar binnen het document op verschillende manieren kunnen zijn opgeslagen. De letter 'ë' (e-umlaut) kan bijvoorbeeld worden vertegenwoordigd door één teken, de e-umlaut, of door twee tekens, de normale Latijnse 'e' plus de umlaut. Een Unicode-combinatieteken is een teken dat samen met het voorgaande teken wordt gebruikt. In dit geval zou de umlaut dus worden weergegeven boven de Latijnse 'e'. Beide vormen hebben dezelfde visuele typografie als resultaat, maar voor elke vorm wordt iets anders opgeslagen in het bestand.

    Normalisatie is het proces dat ervoor zorgt dat de tekens die in verschillende vormen kunnen worden opgeslagen, allemaal in een en dezelfde vorm worden opgeslagen. In dit geval betekent dat dat alle 'ë'-tekens in een document zijn opgeslagen als één e-umlaut of als 'e' plus de umlaut en dat niet beide vormen in één document zijn opgeslagen.

    Als u meer informatie wilt over Unicode-normalisatie en de specifieke vormen die kunnen worden gebruikt, gaat u naar de Unicode-website op www.unicode.org/reports/tr15.

Bestaande documenten openen en bewerken

U kunt bestaande webpagina's of tekstdocumenten, die al dan niet in Dreamweaver zijn gemaakt, openen en in de ontwerpweergave of codeweergave bewerken.

Als het document dat u opent een Microsoft Word-bestand is dat als een HTML-document is opgeslagen, kunt u de opdracht Extra >Word-HTML opruimen gebruiken om de extra opmaakcodes die Word in HTML-bestanden invoegt, te verwijderen.

Als u HTML- of XHTML-code wilt opruimen die niet door Microsoft Word is gegenereerd, gebruikt u de opdracht Extra > HTML opruimen. Voor meer informatie, zie HTML-bestanden uit Microsoft Word opschonen.

U kunt ook tekstbestanden openen die geen HTML bevatten, zoals JavaScript-bestanden, XML-bestanden, CSS-stijlpagina's of tekstbestanden die in tekstverwerkingsprogramma's of teksteditors zijn opgeslagen.

  1. Selecteer Bestand > Openen.

    Opmerking:

    U kunt ook het deelvenster Bestanden gebruiken om bestanden te openen.

  2. Ga naar het bestand dat u wilt openen en selecteer dit bestand.

    Opmerking:

    Het is verstandig om bestanden die u wilt openen en bewerken, op een Dreamweaver-website te plaatsen, in plaats van deze te openen vanaf een andere locatie. Ga voor meer informatie over Dreamweaver-sites naar Over Dreamweaver-sites.

  3. Klik op Openen.

    Het document wordt in het documentvenster geopend. JavaScript-bestanden, tekstbestanden en CSS-stijlpagina's worden standaard in de codeweergave geopend. U kunt het document bijwerken terwijl u in Dreamweaver werkt en alle wijzigingen in het bestand opslaan.

Met Dreamweaver kunt u bestanden bekijken die aan uw hoofddocument zijn gekoppeld, zonder de focus van het hoofddocument weg te halen. Als u bijvoorbeeld CSS- en JavaScript-bestanden aan een hoofddocument hebt gekoppeld, kunt u deze verwante bestanden met Dreamweaver in het documentvenster bekijken en bewerken terwijl het hoofddocument zichtbaar blijft.

Voor meer informatie over dynamisch verwante bestanden, zie dynamisch verwante bestanden openen.

Opmerking:

Als u tijdens het werken met HTML-bestanden snel wijzigingen in verwante CSS-, JavaScript- of PHP-bestanden wilt maken zonder naar die bestanden te navigeren, kunt u Snel bewerken gebruiken. Zie Snel Bewerken voor meer informatie.

Standaard worden de namen van alle bestanden die verwant zijn aan een hoofddocument, weergegeven op een werkbalk Verwante bestanden, onder de titel van het hoofddocument. De volgorde van de knoppen op de werkbalk komt overeen met de volgorde van de koppelingen naar verwante bestanden in het hoofddocument.

Opmerking:

Als een verwant bestand ontbreekt, wordt de corresponderende knop toch weergegeven op de werkbalk Verwante bestanden. Als u echter op de knop klikt, wordt er niets in Dreamweaver weergegeven.

Dreamweaver ondersteunt de volgende typen verwante bestanden:

  • Scriptbestanden aan clientzijde
  • Includes aan serverzijde
  • Externe CSS-stijlbladen (waaronder geneste stijlbladen)

Voer een van de volgende handelingen uit:

  • Klik boven aan het document in de werkbalk Verwante bestanden op de bestandsnaam van het gerelateerde bestand dat u wilt openen.

  • Klik met de rechtermuisknop op de werkbalk Verwante bestanden op de bestandsnaam van het verwante bestand dat u wilt openen, en kies Als afzonderlijk bestand openen in het contextmenu. Wanneer u een verwant bestand op deze manier opent, blijft het hoofddocument niet zichtbaar.

  1. Plaats de invoegpositie op een regel of in een gebied waaraan een bestand is gerelateerd.

  2. Wacht tot het symbool van de codenavigator wordt weergegeven en klik vervolgens om de codenavigator te openen.

  3. Houd de muis boven de items in de codenavigator om meer informatie over de items weer te geven. Als u bijvoorbeeld een bepaalde CSS-kleureigenschap wilt wijzigen maar niet weet in welke regel deze eigenschap is opgeslagen, kunt u de eigenschap vinden door de muis boven de beschikbare regels in de codenavigator te houden.

  4. Klik op het item waarin u bent geïnteresseerd om het bijbehorende verwante bestand te openen.

Terugkeren naar de broncode van het hoofddocument

  1. Klik op de knop Broncode op de werkbalk Verwante bestanden.

Wanneer u een verwant bestand opent vanuit de Ontwerpweergave of de Code- en ontwerpweergaven (gesplitste weergave), wordt het verwante bestand weergegeven in een gesplitste weergave.

U kunt Weergave > Splitsen selecteren en kiezen uit de verschillende gesplitste-weergaveopties als u de gesplitste weergave wilt aanpassen.

Als u de verwante bestanden alleen in de codeweergave wilt weergeven, selecteert u Code boven in de werkbalk.

Opmerking:

Met de standaardcodeweergave kunt u verwante documenten niet tegelijkertijd met de broncode van het hoofddocument weergeven.

Opmerking:

De codeweergave in de weergaveoptie verwijst naar de broncode van het hoofddocument. Als u bijvoorbeeld Beeld > Codeweergave bovenop selecteert, geeft Dreamweaver de broncode van het hoofddocument weer in de bovenste helft van het documentvenster. Als u Weergave > Codeweergave links selecteert, geeft Dreamweaver de broncode van het hoofddocument links van het documentvenster weer.

Als u een HTML-bestand opent, geeft Dreamweaver standaard de verwante bestanden weer in afzonderlijke tabbladen. U kunt deze functie uitschakelen in het deelvenster Voorkeuren.

  1. Selecteer Bewerken > Voorkeuren (Windows) of Dreamweaver > Voorkeuren (Macintosh).

  2. Schakel in de categorie Algemeen de optie Verwante bestanden inschakelen uit.

De functie Dynamisch verwante bestanden is een uitbreiding van de functie Verwante bestanden waarmee de verwante bestanden van dynamische pagina's kunnen worden weergegeven op de werkbalk Verwante pagina's. Met de functie Dynamisch verwante bestanden kunt u met name de grote hoeveelheid include-bestanden weergeven die vereist zijn voor het genereren van de runtimecode voor veelgebruikte open-sourceraamwerken voor PHP-inhoudsbeheersystemen, zoals WordPress, Drupal en Joomla!

Als u de functie Dynamisch verwante bestanden wilt gebruiken, moet u toegang hebben tot een lokale of externe PHP-toepassingsserver waarop WordPress, Drupal of Joomla! wordt uitgevoerd. Een veelgebruikte methode voor het testen van pagina's is het instellen van een lokale host met een PHP-toepassingsserver waarop de pagina's lokaal worden getest.

U moet de volgende stappen uitvoeren voor u pagina's kunt testen:

  • Stel een Dreamweaver-site in en zorg dat u een waarde opgeeft in het tekstvak URL van het dialoogvenster Site-instelling.

  • Stel een PHP-toepassingsserver in.

    Opmerking: de server moet actief zijn voordat u in Dreamweaver kunt gaan werken met dynamisch verwante bestanden.

  • Installeer WordPress, Drupal of Joomla! op de toepassingsserver. Zie voor meer informatie:

  • Stel in Dreamweaver een lokale map in waarin u de bestanden voor het inhoudsbeheersysteem kunt downloaden en bewerken.

  • Geef de locatie van de geïnstalleerde WordPress-, Drupal- of Joomla-bestanden op als uw externe map en testmap.

  • Download de bestanden voor het inhoudssysteem uit de externe map (met Ophalen).

Als u een pagina opent die is gekoppeld met dynamisch verwante bestanden, kunnen de bestanden automatisch worden gedetecteerd met Dreamweaver. U kunt de bestanden ook handmatig detecteren (hiervoor klikt u op een koppeling op de balk Info boven de pagina). De standaardinstelling is handmatige detectie.

  1. Kies Bewerken > Voorkeuren (Windows) of Dreamweaver > Voorkeuren (Macintosh OS).

  2. Controleer of in de categorie Algemeen de optie Verwante bestanden inschakelen is geselecteerd.

  3. Selecteer Handmatig of Automatisch in het pop-upmenu Dynamisch verwante bestanden. U kunt de detectie ook volledig uitschakelen door Uitgeschakeld te selecteren.

  1. Open een pagina waaraan dynamisch verwante bestanden zijn gekoppeld, bijvoorbeeld de pagina index.php in de hoofdmap van een WordPress-, Drupal- of Joomla!- site.

  2. Als de detectie van dynamisch verwante bestanden is ingesteld op handmatig (standaardinstelling), klikt u op de koppeling Discover op de balk Info die wordt weergegeven boven de pagina in het documentvenster.

    Als de detectie van dynamisch verwante bestanden automatisch wordt uitgevoerd, wordt een lijst met dynamisch verwante bestanden weergegeven op de werkbalk Verwante bestanden.

Voor de verwante en dynamisch verwante bestanden op de werkbalk Verwante bestanden geldt deze volgorde:

  • Statisch verwante bestanden (verwante bestanden waarvoor geen dynamische verwerking nodig is)
  • Externe verwante bestanden (CSS- en JS-bestanden) die zijn gekoppeld aan include-bestanden op de server met een dynamisch pad
  • Include-bestanden op de server met een dynamisch pad (PHP-, INC- en MODULE-bestanden)

Omdat er vaak veel verwante en dynamisch verwante bestanden zijn, kunt u de verwante bestanden filteren in Dreamweaver zodat alleen de bestanden worden weergegeven waarmee u wilt werken.

  1. Open een pagina waaraan verwante bestanden zijn gekoppeld.

  2. Voer zo nodig detectie van dynamisch verwante bestanden uit.

  3. Klik op het pictogram Verwante bestanden filteren aan de rechterkant van de werkbalk Verwante bestanden.

  4. Selecteer de bestandstypen die u wilt weergeven op de werkbalk Verwante bestanden. Standaard worden in Dreamweaver alle verwante bestanden geselecteerd.

  5. Als u een aangepast filter wilt maken, klikt u op het pictogram Verwante bestanden filteren en kiest u Aangepast filter.

    In het dialoogvenster Aangepast filter kunt u filteren op exacte bestandsnamen (style.css) en bestandsextensies (.php) of u kunt jokertekenexpressies met sterretjes gebruiken (*menu*). Als u wilt filteren op meerdere jokertekenexpressies, moet u de expressies scheiden met een puntkomma (bijvoorbeeld style.css;*.js;*tpl.php).

Opmerking:

De filterinstellingen blijven niet behouden als u het bestand sluit.

HTML-bestanden uit Microsoft Word opschonen

U kunt documenten die in Microsoft Word (Microsoft Word 97 of later) )als HTML-bestanden zijn opgeslagen, openen en vervolgens de opdracht Extra > Word-HTML opruimen gebruiken om de externe HTML-codes die door Word zijn gegenereerd, te verwijderen.

De codes die Dreamweaver verwijdert, worden door Word voornamelijk gebruikt om de documenten in Word op te maken en weer te geven en zijn niet nodig om het HTML-bestand weer te geven.

Bewaar een kopie van het oorspronkelijke Word-bestand (.doc) als reservekopie, want mogelijk kunt u het HTML-bestand niet meer openen in Word nadat het HTML-bestand is opgeschoond.

Opmerking:

Als u HTML- of XHTML-code wilt opruimen die niet door Microsoft Word is gegenereerd, gebruikt u de opdracht Extra > HTML opruimen.

  1. Sla uw Microsoft Word-document op als een HTML-bestand.

    Opmerking:

    Als u in Windows werkt, moet u het bestand in Word sluiten om te voorkomen dat er een fout optreedt, want het bestand kan niet worden gedeeld.

  2. Open het HTML-bestand in Dreamweaver.

    Als u de HTML-code wilt zien die door Word is gegenereerd, schakelt u over naar de codeweergave (Beeld > Code).

  3. Selecteer Extra > Word-HTML opruimen.

    Opmerking:

    Als Dreamweaver niet kan vaststellen welke versie van Word is gebruikt om het bestand op te slaan, selecteert u de juiste versie in het pop-upmenu.

  4. Schakel de gewenste opties voor het opruimen in (en schakel de ongewenste opties uit). De voorkeuren die u opgeeft, worden als standaardinstellingen voor het opruimen opgeslagen.

    Dreamweaver past de opruiminstellingen toe op het HTML-document en er verschijnt een logboek met de aangebrachte wijzigingen (tenzij u die optie in het dialoogvenster hebt uitgeschakeld).

    Opties voor het opschonen van HTML-bestanden uit Microsoft Word
    Opties voor het opschonen van HTML-bestanden uit Microsoft Word

    Alle Word-specifieke opmaakcodes verwijderen

    Hiermee verwijdert u alle Microsoft Word-specifieke HTML-code, inclusief XML uit HTML-tags, aangepaste Word-metagegevens en koppelingstags in de kop van het document, XML-opmaakcodes van Word, voorwaardelijke tags en hun inhoud, en lege alinea's en marges uit stijlen. U kunt elk van deze opties afzonderlijk selecteren op het tabblad Gedetailleerd.

    CSS opruimen

    Hiermee verwijdert u alle Word-specifieke CSS-stijlen, waaronder inline CSS-stijlen als dat mogelijk is (als de bovenliggende stijl dezelfde stijleigenschappen heeft), stijlkenmerken die beginnen met 'mso', declaraties van niet-CSS-stijlen, CSS-stijlkenmerken uit tabellen en alle ongebruikte stijldefinities uit de kop. U kunt deze opties verder aanpassen op het tabblad Gedetailleerd.

    <font>-tags opruimen

    Hiermee verwijdert u HTML-tags en converteert u de standaardhoofdtekst naar HTML-tekst van grootte 2.

    Onjuist geneste tags corrigeren

    Hiermee verwijdert u opmaaktags voor lettertypen die door Word zijn ingevoegd buiten de alinea- en koptags (op blokniveau).

    Bronopmaak toepassen

    Hiermee past u de opties voor bronopmaak, die u als voorkeuren voor HTML-opmaak en in het bestand SourceFormat.txt hebt opgegeven, toe op het document.

    Logboek tonen bij voltooiing

    Toont een waarschuwingsvenster met informatie over de wijzigingen die in het document zijn aangebracht nadat de opschoonbewerking is voltooid.

  5. Klik op OK of ga naar het tabblad Gedetailleerd als u de opties voor het verwijderen van alle Word-specifieke opmaakcodes en het opruimen van CSS-stijlen verder wilt aanpassen en klik vervolgens op OK.

Dit werk is gelicentieerd onder de Creative Commons Naamsvermelding/Niet-commercieel/Gelijk delen 3.0 Unported-licentie  De voorwaarden van Creative Commons zijn niet van toepassing op Twitter™- en Facebook-berichten.

Juridische kennisgevingen   |   Online privacybeleid