De nieuwste updates voor de 2014-versie van Dreamweaver CC bieden integratie met Extract zodat u rechtstreeks in Dreamweaver sites voor mobiele apparaten en computers kunt maken op basis van een PSD-compositie. Met de nieuwe livehulplijnen kunt u HTML-elementen nauwkeurig plaatsen en opnieuw ordenen en met de verbeterde bewerkingsopties in Live View kunt u in realtime wijzigingen aanbrengen.

In dit artikel komen deze nieuwe functies en allerlei andere verbeteringen aan de orde en zijn koppelingen naar bronnen opgenomen voor meer hulp en informatie.

Adobe Dreamweaver CC 2014.1.1 (februari 2015)

Nieuw welkomstscherm

Bent u een nieuwe Dreamweaver-gebruiker? Hebt u Dreamweaver al eerder gebruikt en wilt u uw kennis bijspijkeren? Wilt u weten wat er in de huidige versie is gewijzigd vergeleken met vorige versie? Of u nu een beginnende of een ervaren gebruiker bent of de nieuwe versie van Dreamweaver wilt evalueren, u kunt nu alle essentiële informatiebronnen direct vanuit het welkomstscherm gebruiken.

Het welkomstscherm in de nieuwste update van de Dreamweaver CC 2014-versie van Dreamweaver biedt snel toegang tot video's (onder andere voor nieuwe functies), praktische zelfstudies, tips en technieken en meer.

Welkomstscherm
Welkomstscherm

Opmerking:

Dit nieuwe welkomstscherm is alleen beschikbaar voor gebruikers in Engelstalige regio's. Voor gebruikers in andere regio's worden het welkomstscherm en de rondleiding Nieuwe functies van Dreamweaver CC 2014.1 weergegeven.

Verbeteringen in het deelvenster Extract

Livehulplijnen en het pictogram van Snelle elementweergave worden nu weergegeven in Live View wanneer u afbeeldingen sleept vanuit het deelvenster Extract. Deze visuele hulpmiddelen kunt u gebruiken om de afbeelding snel en nauwkeurig op de gewenste positie te plaatsen.

Deelvenster Extract
Deelvenster Extract

Verbeteringen in Bewerken met Live View

Elementen slepen en neerzetten

U kunt nu elementen in Live View verplaatsen door de gekoppelde tagnaam te slepen. Wanneer u de muisaanwijzer op een tagnaam plaatst, verschijnt het handje dat aangeeft dat u het element kunt slepen. U kunt Livehulplijnen gebruiken om een element dat u sleept, neer te zetten. Deze hulplijnen geven aan wat de positie van het element wordt nadat u het hebt neergezet.

Selectiekader

Tekst, afbeeldingen of andere elementen in een tag kunt u nu selecteren door te klikken en te slepen in een tag (selectiekader). Met het selectiekader kunt u eenvoudig meerdere elementen binnen een tag selecteren.

Opmerking:

het selectiekader in Live View kunt u alleen gebruiken voor de bewerkingen die worden ondersteund door de browser.

Verbeteringen in de elementweergave

In Elementweergave verschijnt nu de tiptekst 'Klasse/id' om aan te geven dat een klasse of id kan worden opgegeven.

Ook worden wijzigingen in Elementweergave opgeslagen wanneer u op “+” klikt. U kunt ook op Enter of Return drukken om wijzigingen op te slaan, net als in eerdere versies van Dreamweaver. 

Nieuwe thema's voor codeweergave

Er zijn tien nieuwe kleurenthema's toegevoegd aan de codeweergave:

  • RecognEyes
  • Havenjark
  • Solarized Dark
  • Solarized Light
  • Wombat
  • Monaki
  • Schuss
  • Tango
  • Cool Light
  • Roboticket

Zie Het kleurenthema voor de codeweergave instellen voor meer informatie over thema's voor de codeweergave.

Verbeteringen in CSS ontwerpen

Deze update bevat een aantal wijzigingen voor de gebruikersinterface van CSS ontwerpen en een wijziging voor de standaardinstelling van het selectievakje Set tonen.

Tijdens het starten wordt het selectievakje Set tonen standaard ingeschakeld. Wijzigingen voor deze optie worden permanent toegepast op alle Dreamweaver-sessies. Als u deze optie bijvoorbeeld uitschakelt, blijft de instelling behouden tijdens de volgende Dreamweaver-sessie en wordt de optie als niet-ingeschakeld weergegeven.

In de gebruikersinterface zijn de volgende wijzigingen aangebracht:

  • Het deelvenster CSS ontwerpen verschuift tijdens het toevoegen van een eigenschap: Wanneer u in de sectie Eigenschappen op “+” klikt, wordt het deelvenster verschoven zodat de rij Eigenschap toevoegen bijna in het midden van het deelvenster Eigenschappen staat. Als de sectie Eigenschappen te klein is, wordt het deelvenster verschoven zodat de rij Eigenschap toevoegen onder aan de sectie wordt weergegeven.
  • Achtergrond markeren: als de focus op het tekstvak Nieuwe eigenschap toevoegen is geplaatst, wordt de rij gemarkeerd met een grijze achtergrond. 
  • Positie van de knoppen “+” en “-”: de knoppen “+” en “-” in elke sectie van het deelvenster CSS ontwerpen (Bron, Kiezers, Mediaquery en Eigenschappen) zijn verplaatst van links naar uiterst rechts om ze beter zichtbaar te maken.
  • De categorie “Aangepast” heet nu “Meer”.

Externe foutopsporing van Live View

Met de hulpprogramma's voor ontwikkelaars van Google Chrome kunt u externe foutopsporing uitvoeren voor Dreamweaver-documenten die zijn geopend in Live View. In Google Chrome kunt u poort 5471 gebruiken, die u als volgt kunt activeren:

  1. Start Dreamweaver door de volgende opdracht uit te voeren:

    • Windows: <installatiepad> -enableRemoteDebugging
    • Mac: open <installatiepad> --args -enableRemoteDebugging

    Opmerking: typ voor de argumenten twee koppeltekens.

  2. Klik op OK in het dialoogvenster waarin wordt aangegeven dat poort 5471 is geactiveerd voor foutopsporing.

    Dreamweaver wordt gestart.

    Klik op OK in het dialoogvenster om Dreamweaver te starten
    Klik op OK in het dialoogvenster om Dreamweaver te starten

  3. Open de documenten waarvoor u foutopsporing wilt gebruiken in Live View.

  4. Open Google Chrome en blader naar localhost:5471 om te beginnen met het opsporen van fouten. Er wordt een lijst weergegeven met koppelingen naar alle documenten die zijn geopend in Dreamweaver. 

    Opmerking: omdat voor het nieuwe welkomstscherm en het deelvenster Extract het Chromium Embedded Framework (CEF) wordt gebruikt, ziet u ook vermeldingen voor deze functies.

    U kunt nu de hulpprogramma's voor ontwikkelaars van Google Chrome gebruiken om foutopsporing uit te voeren voor de vereiste documenten.

  5. Als u de foutopsporing wilt beëindigen en Dreamweaver wilt openen in de normale modus, sluit u Dreamweaver af en start u de toepassing opnieuw.

Andere verbeteringen

Wijzigingen in de workflow voor het opnieuw instellen van voorkeuren

Wanneer u de voorkeuren opnieuw instelt via de sneltoetsen, wordt met Dreamweaver een back-up van de voorkeuren gemaakt in de map “Adobe Dreamweaver CC 2014.1 Backups”. Deze map wordt automatisch gemaakt in dezelfde map als de oorspronkelijke map met Dreamweaver-voorkeuren in Windows en Mac.

Het volledige pad van de back-upmap wordt weergegeven in het dialoogvenster voor het opnieuw instellen van de voorkeuren.

Voorkeuren en instellingen opnieuw instellen
Voorkeuren en instellingen opnieuw instellen

Wijziging voor de weergavemodus van dynamische documenten

Dynamische documenten als PHP, CFM en ASP worden niet langer standaard geopend in de codeweergave. De bestanden worden geopend in dezelfde modus (code/Live/gesplitste) als het laatst gesloten document of het laatste document met de focus.

Adobe Dreamweaver CC 2014.1 (oktober 2014)

Extract in Dreamweaver

Dankzij de integratie van Extract met Dreamweaver kunnen webontwerpers en -ontwikkelaars ontwerpinformatie toepassen en webmiddelen rechtstreeks extraheren in de coderingsomgeving. Extract biedt een volledige, zelfstandige oplossing voor het extraheren van stijlgegevens en middelen uit PSD-composities, zodat u niet steeds tussen Photoshop en Dreamweaver hoeft te schakelen.

In het deelvenster Extract in Dreamweaver kunt u CSS, afbeeldingen, lettertypen, kleuren, verlopen en afmetingen rechtstreeks naar uw webpagina extraheren. Naast deze primaire functies van Extract biedt Dreamweaver ook de volgende unieke functies:

  • Rechtstreeks toegang tot uw PSD-bestanden op Creative Cloud en tot de PSD-bestanden die anderen met u delen in een gezamenlijke map
  • Contextafhankelijke coderingstips om eenvoudig lettertypen, kleuren en verlopen in uw CSS te definiëren
  • Ondersteuning voor slepen en neerzetten om afbeeldingstags van PSD-lagen te maken
  • Stijlen rechtstreeks in Live View plakken (bijvoorbeeld CSS ontwerpen en Elementweergave)

In de standaardwerkruimte in Dreamweaver (met de naam Extract) wordt het deelvenster Extract links weergegeven, zodat u direct aan de slag kunt. Als u Dreamweaver de eerste keer start, wordt in het deelvenster Extract een eenvoudige zelfstudie weergegeven met informatie over workflows in Extract. U kunt op Aan de slag klikken om met Extract te beginnen.

Deelvenster Extract: standaardwerkruimte
Deelvenster Extract

Zie Integratie van Dreamweaver met Extract voor meer informatie over de Extract-workflows in Dreamweaver.

64-bits architectuur

De 64-bits versie van Dreamweaver is nu beschikbaar en ondersteunt net als de 32 bits versie alle functies. Met deze toevoeging kunt u nu de volgende builds van Dreamweaver downloaden van de Adobe Creative Cloud-toepassing:

Besturingssysteem Standaardinstallatielocatie Map Toepassingsvoorkeuren
Windows 32-bits C:\Program Files\Adobe\Adobe Dreamweaver CC 2014.1 %appdata%/Adobe/Adobe Dreamweaver CC 2014.1
Windows 64-bits C:\Program Files\Adobe\Adobe Dreamweaver CC 2014.1 %appdata%/Adobe/Adobe Dreamweaver CC 2014.1
Mac 64-bits /Applications/Adobe Dreamweaver CC 2014.1 ~/Library/Application Support/Adobe/Adobe Dreamweaver CC 2014.1

Veelgestelde vragen

  • Kan een 64-bits toepassing worden uitgevoerd op een 32-bits versie van Windows? - Nee
  • Kan ik zowel de 32-bits als de 64-bits versie op dezelfde Windows-computer installeren? - Nee
  • Hoe kan ik controleren of op mijn systeem een 32-bits of een 64-bits versie van Dreamweaver wordt uitgevoerd?
    • Windows: Start Dreamweaver. Open Taakbeheer en zoek het Dreamweaver-proces op. Als het de 64-bits versie van Dreamweaver is, is de naam van het proces "Dreamweaver.exe". Als het de 32-bits versie is, is de naam van het proces "Dreamweaver.exe *32".
    • Mac: Open de Activiteitenmonitor en ga naar Weergave > Kolommen > Soort. Zoek Dreamweaver in de Activiteitenmonitor en bekijk de kolom Soort. Als het de 64-bits versie van Dreamweaver is, wordt in de kolom Soort '64 bits' aangegeven.

De 64-bits versie van Dreamweaver installeren

  1. Zorg ervoor dat op uw computer een 64-bits versie van het besturingsprogramma wordt uitgevoerd:

    Neem de stappen die in de onderstaande artikelen worden beschreven om na te gaan of op uw computer een 64-bits versie wordt uitgevoerd:

  2. Download de 64-bits versie van Dreamweaver van Creative Cloud en installeer de versie.

Verbeteringen in Live View

Livehulplijnen

Livehulplijnen bieden visuele feedback in Live View en geven de mogelijke posities aan waar u een element kunt invoegen in de volgende scenario's:

  • Tijdens het slepen vanuit het deelvenster Invoegen
  • Tijdens het slepen vanuit het deelvenster Middelen
  • Elementen slepen (verplaatsen) in Live View.

Opmerking:

Livehulplijnen worden niet ondersteund in documenten met dynamische rasters.

Livehulplijnen worden weergegeven als u de muisaanwijzer op de verschillende elementen op de pagina plaatst voordat u een element neerzet. Ze kunnen boven of onder het element of links of rechts worden weergegeven van het element dat u aanwijst.

  • Boven en onder: wordt weergegeven als u de muisaanwijzer op alle typen elementen of tags plaatst, behalve inlinetags. Wanneer u de muisaanwijzer in eerste (bovenste) 50% van het element plaatst, worden de hulplijnen boven het aangewezen element weergegeven. Wanneer u de muisaanwijzer in de laatste (onderste) 50% van het element plaatst, worden de hulplijnen onder het aangewezen element weergegeven.
Livehulplijnen boven en onder aangewezen elementen
Livehulplijnen boven en onder aangewezen elementen

  • Links en rechts: wordt weergegeven wanneer u de muisaanwijzer op inlinetags plaatst, bijvoorbeeld op <a>, <span> of op tags waarvoor de eigenschap 'zwevend' is ingesteld.
Livehulplijnen rechts en links van aangewezen elementen
Livehulplijnen rechts en links van aangewezen elementen

Een structuurelement nauwkeurig invoegen

U kunt naast de Livehulplijnen de Snelle elementweergave gebruiken om een HTML-element nauwkeuriger in de documentstructuur in te voegen.

Als u even pauzeert voordat u het element neerzet, verschijnt het pictogram Snelle elementweergave (</>). Wanneer u de muis op dit pictogram plaatst, wordt de Snelle elementweergave geopend en kunt u het element in de Snelle elementweergave neerzetten.

Pictogram voor Snelle elementweergave
Het pictogram Snelle elementweergave voor het nauwkeurig invoegen van elementen

Contextmenu in Live View

U kunt nu in Live View elementen knippen, kopiëren, plakken en verwijderen via het contextmenu dat u opent door met de rechtermuisknop te klikken. U kunt ook elementen dupliceren of de bovenliggende of onderliggende tag selecteren via het contextmenu in Live View.

Opmerking:

u kunt ook de corresponderende sneltoetsen in Live View gebruiken (bijvoorbeeld in Windows: Ctrl+x, Ctrl+c, Ctrl+v en Delete).

Selecteer eerst een element in Live View om de elementweergave te openen. Klik vervolgens met de rechtermuisknop in het taggebied om de bovenstaande contextmenu-opties weer te geven. De opties zijn functioneel op tagniveau. 

Wijzigingen in de elementweergave

U kunt nu niet alleen kiezers op een element toepassen, maar u kunt ook een kiezer in de gewenste CSS-bron selecteren en een mediaquery toewijzen via de elementweergave. Wanneer u een kiezer opgeeft die in geen enkele stijlpagina voorkomt en op Enter drukt, kunt u in de elementweergave een CSS-bron en mediaquery kiezen.

Opties voor CSS-bron en mediaquery in de elementweergave
Opties voor CSS-bron en mediaquery in de elementweergave

Als u geen CSS-bron of mediaquery wilt kiezen, drukt u op Esc om de opties te sluiten.

U kunt nu ook met de rechtermuisknop op een toegepaste kiezer klikken om naar de bijbehorende code te gaan (de optie Ga naar codeweergave) of om gekopieerde stijlen te plakken (de optie Stijlen plakken).

De opties Ga naar codeweergave en Stijlen plakken in de elementweergave
De opties Ga naar codeweergave en Stijlen plakken in de elementweergave

Opmerking:

Met de optie Ga naar codeweergave worden subopties weergegeven als dezelfde kiezer is toegevoegd aan meerdere mediaquery's. Met de optie Stijlen plakken worden subopties weergegeven als de gekopieerde kiezers pseudokiezers of samengestelde kiezers zijn.

Elementen in Live View verplaatsen

Dreamweaver ondersteunt nu ook het verplaatsen van elementen (tagniveau) in Live View. U kunt een element in Live View selecteren, het element slepen en het op een andere plaats neerzetten.

  1. Klik op het element dat u wilt verplaatsen. Zodra de elementweergave (blauw kader rond het element) verschijnt, sleept u het element. Wanneer u met slepen begint, verandert de muisaanwijzer om aan te geven dat het element kan worden verplaatst.

  2. De verwijzingselementen (elementen ten opzichte waarvan u het gesleepte element wilt plaatsen) worden gemarkeerd met een blauwe rand. Er worden Livehulplijnen (groen) weergegeven om de mogelijke posities aan te geven waar de elementen kunnen worden neergezet ten opzichte van het verwijzingselement.

Opmerking:

In Live View kunnen alleen statische elementen worden verplaatst. Dynamische contenttags, zoals PHP kunnen niet worden verplaatst.

Als u even pauzeert voordat u het element neerzet, verschijnt het pictogram Snelle elementweergave (</>). Wanneer u de muis op dit pictogram plaatst, wordt de Snelle elementweergave geopend en kunt u het element in de Snelle elementweergave neerzetten.

Toetsenbordnavigatie in Live View

Dreamweaver ondersteunt nu navigatie door pagina-elementen via het toetsenbord voor fervente toetsenbordgebruikers en om het proces bij het ontwerpen van websites te versnellen. U kunt de volgende toetsen gebruiken:

  • De toetsen Pijl-omhoog en Pijl-omlaag om door de pagina-elementen te navigeren. Met de toetsenbordnavigatie in Live View hebt u snel toegang tot geneste elementen en elementen die tussen tags zijn geplaatst.
  • De Tab-toets om de kiezers in de elementweergave te doorlopen

Zie Toetsenbordnavigatie in Live View voor meer informatie.

Snelle tageditor in Live View

Als u op een Windows-computer in Live View op Ctrl+T of op een Mac-computer op Cmd+T drukt, wordt er een Snelle tageditor voor het geselecteerde element weergegeven. De Snelle tageditor heeft drie statussen: Tag bewerken, Tag rondom plaatsen en HTML invoegen. U kunt tussen deze statussen schakelen met Ctrl/Cmd + T.

Snelle tageditor in Live View
Snelle tageditor in Live View

Wijzigingen in de werkruimte van Dreamweaver

Wijzigingen in de documentwerkbalk

De documentwerkbalk is gewijzigd en gebruiksvriendelijker gemaakt.

  • De opties in de ontwerpweergave en in Live View-opties zijn samengevoegd in één besturingselement (vervolgmenu).
Opties in de ontwerpweergave en Live View in Dreamweaver CC (oktober 2014)
Opties in de ontwerpweergave en Live View in de nieuwste update - Dreamweaver CC (oktober 2014)

Knoppen op de documentwerkbalk in de ontwerpweergave en Live View in vorige versies
Knoppen op de documentwerkbalk in de ontwerpweergave en Live View in vorige versies

  • Het veld Documentnaam is verplaatst naar de eigenschappencontrole.
Documentwerkbalk in Dreamweaver CC (oktober 2014)
De documentwerkbalk in de nieuwste update - Dreamweaver CC (oktober 2014)

Het veld Documentnaam is verplaatst naar de eigenschappencontrole in Dreamweaver CC (oktober 2014)
Het veld Documentnaam is in de nieuwste update verplaatst naar de eigenschappencontrole - Dreamweaver CC (oktober 2014)

Het veld Titel in de documentwerkbalk in vorige versies
Het veld Titel in de documentwerkbalk in vorige versies

  • De knoppen Controle en Live code zijn vervangen door pictogrammen.
De pictogrammen Live code en Inspecteren in Dreamweaver CC (oktober 2014)
De pictogrammen Live code en Inspecteren in de nieuwste update - Dreamweaver CC (oktober 2014)

De knoppen in Live code en Inspecteren in vorige versies
De knoppen in Live code en Inspecteren in vorige versies

  • De opties Vorige, Volgende en Vernieuwen zijn gegroepeerd met de adresbalk en zijn in het midden van de documentwerkbalk geplaatst.
De adresbalk met de opties Vorige, Volgende en Vernieuwen in Dreamweaver CC (oktober 2014)
De adresbalk met de opties Vorige, Volgende en Vernieuwen in de nieuwste update - Dreamweaver CC (oktober 2014)

De adresbalk met de opties Vorige, Volgende en Vernieuwen in vorige versies
De adresbalk met de opties Vorige, Volgende en Vernieuwen in vorige versies

  • De pictogrammen van Voorvertonen/Fouten opsporen in browser, Live View-opties en Bestandsbeheer zijn gegroepeerd en rechts op de documentwerkbalk uitgelijnd.
De pictogrammen van de opties Voorvertonen, Fouten opsporen in browser, Live View-opties en Bestandsbeheer in Dreamweaver CC (oktober 2014)
De pictogrammen van de opties Voorvertonen, Fouten opsporen in browser, Live View-opties en Bestandsbeheer in de nieuwste update - Dreamweaver CC (oktober 2014)

De opties Voorvertonen, Fouten opsporen in browser, Live View-opties en Bestandsbeheer in vorige versies
De opties Voorvertonen, Fouten opsporen in browser, Live View-opties en Bestandsbeheer in vorige versies

Wijzigingen in de standaardwerkruimte

De kant-en-klare werkruimten die in Dreamweaver beschikbaar zijn, zijn als volgt gewijzigd:

  • Code
  • Ontwerp
  • Extract
Werkruimten
Werkruimten

De standaardwerkruimte is nu Extract. In deze werkruimte wordt het deelvenster Extract links en de webpagina rechts weergegeven. Als u Dreamweaver de eerste keer start, wordt in het deelvenster Extract een eenvoudige zelfstudie weergegeven met informatie over workflows in Extract. Klik op Aan de slag om met Extract te beginnen.

De werkruimte van Extract
De werkruimte van Extract

De standaardweergave voor HTML-documenten is nu de Gesplitste weergave, horizontaal gesplitst om Live View en de codeweergave weer te geven. Dynamische bestanden, zoals de onderstaande bestanden, worden standaard in de volledige codeweergave geopend. Wanneer u de weergave splitst, worden deze documenten in de ontwerpweergave en in de codeweergave weergegeven.

  • PHP
  • PHP-sjabloon (Example.dwt.php)
  • ASP
  • ASP-sjabloon (Example.dwt.asp)
  • JSP
  • JSP-sjabloon (Example.dwt.jsp)
  • CFM
  • CFM-sjabloon (Example.dwt.php)
De standaardweergave voor HTML-documenten met Live View en de codeweergave
De standaardweergave voor HTML-documenten met Live View en de codeweergave

De standaardweergave voor dynamische documenten met de volledige codeweergave
De standaardweergave voor dynamische documenten met de volledige codeweergave

Tip: als u wilt overschakelen naar de ontwerpweergave, klikt u op de vervolgkeuzelijst naast 'Live' en klikt u op Ontwerp. Als u de horizontale splitsing van de weergave wilt wijzigen in een verticale splitsing, selecteert u Weergave > Verticaal splitsen. De Live View/ontwerpweergave wordt nu links weergegeven. Als u de Live View/ontwerpweergave aan de rechterkant wilt hebben, maakt u de selectie van Weergave > Live View links of Ontwerpweergave ongedaan.

Dreamweaver onthoudt nu de status van Live View die u voor een HTML-document kiest en past dezelfde weergave toe op alle HTML-documenten die u daarna opent. Stel dat HTML1 het document is dat u als eerste opent. De documentweergave wordt gesplitst in de codeweergave en in Live View. Stel dat u de weergave van dit document wijzigt in de volledige Live View. Nu wordt het volgende document dat u opent, bijvoorbeeld HTML2, weergegeven in de volledige Live View. 

Wijzigingen in documenten met dynamische rasters

Ondersteuning voor Bewerken met Live View

De nieuwe bewerkingsmogelijkheden in Live View zijn geïntroduceerd in de vorige versie van Dreamweaver CC. In deze versie zijn deze bewerkingsfuncties in Live View nu ook beschikbaar voor documenten met dynamische rasters. Met de bewerkingsmogelijkheden in Live View kunt u sneller een webpagina met dynamische rasters ontwikkelen omdat u wijzigingen kunt aanbrengen en deze wijzigingen direct kunt voorvertonen in dezelfde weergave.

Met de volgende functies kunt u documenten met dynamische rasters in Live View bewerken:

Met behulp van de snelle elementweergave kunt u nu ook de HTML DOM-structuur van een document met een dynamisch raster visualiseren. 

Opmerking: Bij snelle elementweergave in dynamische rasterlay-outs kunt u de HTML-elementen niet kopiëren, plakken, dupliceren of opnieuw rangschikken.

De gebruikersinterface voor het weergeven en bewerken van documenten met dynamische rasters is gewijzigd om plaats te maken voor de bewerkingsfuncties in Live View. Wanneer u nu een element in een document met een dynamisch raster selecteert, wordt de elementweergave samen met de andere besturingselementen weergegeven, zoals Elementen verbergen en Start op nieuwe rij.

Dynamische rasteropties in vorige versies
Dynamische rasteropties in vorige versies

Opties voor dynamische rasters samen met de Elementweergave in Dreamweaver CC (oktober 2014)
Opties voor dynamische rasters samen met de elementweergave in de nieuwste update - Dreamweaver CC (oktober 2014)

Documenten met dynamische rasters kunnen nu ook rechtstreeks in Live View worden geopend. U kunt documenten met dynamische rasters niet meer weergeven of bewerken in de ontwerpweergave.

Documentwerkbalk in Dreamweaver CC (oktober 2014)
De documentwerkbalk in de nieuwste update - Dreamweaver CC (oktober 2014)

De documentwerkbalk in een document met een dynamisch raster in vorige versies
De documentwerkbalk in een document met een dynamisch raster in vorige versies

Zie Responsief ontwerp met dynamische rasterlay-outs voor meer informatie over documenten met een dynamisch raster.

Wijzigingen in de workflow Invoegen

Het dialoogvenster Invoegen voor documenten met dynamische rasters bevat nu assistentie bij het plaatsen van elementen. Met de assistent voor het plaatsen van elementen kunt u het ingevoegde element vóór of na het element plaatsen of nesten in het element met de focus (in Live View). Zie Dynamische rasterelementen invoegen voor meer informatie over het invoegen van dynamische rasterelementen.

Wijziging in de optie Verborgen elementen beheren

De optie Verborgen elementen beheren (de knop met het oog op de documentwerkbalk) is verplaatst naar het contextmenu in een document met een dynamisch raster.


Als u verborgen elementen wilt beheren, klikt u met de rechtermuisknop op de pagina met het dynamische raster en selecteert u Verborgen elementen beheren om de verborgen elementen weer te geven. Als u deze elementen wilt verbergen, klikt u op het oogpictogram in de HUD. 

De optie Verborgen elementen beheren in het contextmenu in Dreamweaver CC (oktober 2014)
De optie Verborgen elementen beheren in het contextmenu in de nieuwste update - Dreamweaver CC (oktober 2014)

Het oogpictogram voor het beheren van verborgen elementen in vorige versies
Het oogpictogram voor het beheren van verborgen elementen in vorige versies

Kant-en-klare kleurenthema's voor de codeweergave

U kunt nu uit een van de volgende direct beschikbare kleurenthema's voor de codeweergave kiezen:

  • Classic (standaardthema; hetzelfde als in vorige versies van Dreamweaver)
  • Raven
  • Slate
  • Blanche
  • Geneva
De thema's Classic, Raven, Slate, Blanche en Geneva
De thema's Classic, Raven, Slate, Blanche en Geneva

Gebruik de voorkeuren voor codekleuren om een thema voor de codeweergave op te geven. U kunt het thema aanpassen door andere kleurenschema's voor achtergronden, voorgronden en verborgen tekens te kiezen.

Voor elk type document dat wordt vermeld, kunt u de kleuren voor verschillende categorieën tags en code-elementen, zoals formuliertags of JavaScript-id's aanpassen. Als bijvoorbeeld het thema Raven op alle typen documenten is toegepast, kunt u ervoor kiezen om alleen in HTML-documenten formuliertags blauw weer te geven.

Alle aangepaste instellingen in een thema worden opgeslagen wanneer u op Toepassen klikt. Het aangepaste thema is nu beschikbaar in alle volgende Dreamweaver-sessies.

Opmerking:

U kunt de aangepaste codethema's synchroniseren tussen uw Dreamweaver-exemplaren met behulp van de optie Instellingen synchroniseren in Voorkeuren. Zie Dreamweaver-instellingen synchroniseren met Creative Cloud voor meer informatie.

Synchronisatie van codeweergave naar Live View

Met de synchronisatie van de codeweergave naar Live View kunt u direct een voorvertoning weergeven van de wijzigingen die u in Live View in de code aanbrengt. In tegenstelling tot vorige versies van Dreamweaver, hoeft u niet op Vernieuwen te klikken om een voorvertoning van de wijzigingen in Live View weer te geven.

U kunt de synchronisatie van de codeweergave naar Live View in actie zien in de volgende workflows (wanneer de codeweergave de focus heeft):

  • Bewerken van tekst, zoals knippen, kopiëren, plakken, verwijderen, ongedaan maken/opnieuw.
  • Verplaatsen van elementen in de Snelle elementweergave wanneer de codeweergave de focus heeft.
  • Typen in de codeweergave
  • Verwijderen, dupliceren, kopiëren en plakken in de Snelle elementweergave (opties in het contextmenu).
  • Bewerkingen in de eigenschappencontrole, zoals het wijzigen van tekstopmaak (vet, cursief, wijzigen van klasse, id, indeling, pagina-eigenschappen en toepassen van lettertypen.
  • Toevoegen en verwijderen van klassen of id's met coderingstips in de codeweergave.
  • Elementen, zoals Div, afbeelding, hyperlink, en structuurelementen invoegen vanuit het deelvenster Invoegen in de codeweergave.
  • Toevoegen of bewerken van CSS-stijlen in de tag <style>. 
  • Code bewerken in CSS-bestanden.

Opmerking:

Voor alle wijzigingen in JavaScript-code moet de pagina volledig worden vernieuwd of opnieuw worden geladen om de wijzigingen in Live View te kunnen zien. 

Deelvenster Middelen in Live View

Het deelvenster Middelen (Windows > Middelen) is nu ook beschikbaar in Live View. In het deelvenster Middelen kunt u de volgende taken eenvoudig beheren:

  • Sleep middelen (afbeeldingen, URL's, kleuren of media) of voeg ze in vanuit het voorvertoningsvenster of de lijstweergave van het deelvenster Middelen.

Opmerking: u kunt middelen van het voorvertoningsvenster alleen slepen op de Mac.

  • Kopieer de kleurwaarde en plak de waarde in een willekeurig tekstveld in Dreamweaver, zoals eigenschappen van CSS ontwerpen, codeweergave, kleurkiezer of zelfs in andere toepassingen, zoals Kladblok.

Opmerking:

 

  • Aangezien de categorieën Scripts, Sjabloon en Bibliotheek relevanter zijn in de codeweergave, zijn ze verborgen in het deelvenster Middelen van Live View.
  • In deze versie van Dreamweaver CC zijn de categorieën Flash en Films gecombineerd tot één categorie met de naam 'Media'.
         

Deelvenster Middelen in Live View
Deelvenster Middelen in Live View

Deelvenster Middelen in de ontwerpweergave en codeweergave
Deelvenster Middelen in de ontwerpweergave en codeweergave

Zie Werken met middelen voor gedetailleerde instructies over het gebruik van het deelvenster Middelen.

Nieuwe, eenvoudige sjablonen

Dreamweaver beschikt nu over nieuwe, eenvoudige, responsieve sjablonen, zodat u sneller aan de slag kunt met uw responsieve websites. U kunt een van de volgende sjablonen kiezen in het dialoogvenster Nieuw document (Bestand > Nieuw > Eenvoudige sjablonen):

  • Over pagina
  • Blogbericht
  • eCommerce
  • E-mail
  • Portfolio
Nieuwe, eenvoudige, responsieve sjablonen
Nieuwe, eenvoudige responsieve sjablonen

Wanneer u een sjabloon kiest en op Maken klikt in het dialoogvenster Nieuw document, vraagt Dreamweaver u het nieuwe document op te slaan. Door het document op te slaan, maakt u een kopie van de sjabloon die u later aan uw behoeften kunt aanpassen.

Voorkeuren opnieuw instellen bij het starten

Voor het oplossen van problemen met Dreamweaver moet u soms de map met voorkeuren met alle aangepaste instellingen verwijderen. Vóór deze versie moest u handmatig naar de map met voorkeuren op uw computer gaan en de map verwijderen. In deze versie kunt u met één muisklik uw voorkeuren verwijderen via een dialoogvenster:

Voorkeuren opnieuw instellen
Voorkeuren opnieuw instellen

U kunt het dialoogvenster Voorkeuren opnieuw instellen openen door bij het starten van Dreamweaver de volgende sneltoetsen ingedrukt te houden:

  • (Win) Windows-toets + Ctrl + Shift
  • (Mac) Cmd + Option + Shift

Opmerking:

Denk goed na voordat u de optie voor het opnieuw instellen van de voorkeuren gebruikt. Wanneer u de voorkeuren en instellingen opnieuw instelt, gaan alle aangepaste instellingen voor de werkruimte, sneltoetsen, extensies en toepassingsvoorkeuren verloren.

Houd bij het starten van Dreamweaver op een Mac-computer Cmd + Option + Shift ingedrukt (door op het Dreamweaver-pictogram in het dok te klikken).

Neem op een Windows-computer de volgende stappen:

  1. Ga naar de installatiemap, zoek het bestand Dreamweaver.exe op en klik op het bestand.

  2. Houd de Windows-toets + Ctrl + Shift ingedrukt en dubbelklik op Dreamweaver.exe.

Zorg ervoor dat u de hierboven genoemde sneltoetsen zelfs ingedrukt houdt wanneer het dialoogvenster User Account Control (UAC) wordt weergegeven. 

Andere verbeteringen

Wijzigingen in synchronisatie-instellingen

U kunt nu via het dialoogvenster Voorkeuren instellingen van uw vorige Dreamweaver-versie importeren die op Creative Cloud zijn opgeslagen. Alle instellingen worden overschreven door de instellingen die van de cloud worden geïmporteerd en worden de volgende keer dat u Dreamweaver start, toegepast.

Instellingen importeren uit vorige versies van Dreamweaver
Instellingen importeren uit vorige versies van Dreamweaver

Ook kunnen vanaf deze versie, naast de instellingen die werden gesynchroniseerd in eerdere versies, de volgende instellingen ook worden gesynchroniseerd met Creative Cloud:

  • Nieuwe toegevoegde codekleurenthema's
  • Voor de Mac instellingen voor toepassingsbalk en toepassingsframe

Wijzigingen in CSS ontwerpen

Deze versie van Dreamweaver bevat veel gebruiksvriendelijke verbeteringen voor het werken in CSS ontwerpen. Het deelvenster CSS ontwerpen bevat ook een introductie, zodat u snel aan de slag kunt met de workflows.

Wijzigingen in het welkomstscherm

De optie Sitesjablonen in het welkomstscherm is nu vervangen door Eenvoudige sjablonen. U hebt toegang tot de Sitesjablonen via het dialoogvenster Nieuw document (Bestand > Nieuw).

jQuery-versie-updates

Dreamweaver bevat nu de bijgewerkte jQuery-bibliotheken:

  • jQuery - 1.8.3 naar jQuery - 1.11.1
  • jQuery-gebruikersinterface - 1.9.2 naar jQuery-gebruikersinterface - 1.10.4

jQuery-startpagina's zijn verwijderd. 

PhoneGap-update

De rechtstreekse integratie van Dreamweaver met PhoneGap Build voor het verpakken van toepassingen wordt niet ondersteund in de nieuwste update voor de 2014-versie van Dreamweaver CC (oktober 2014) en hoger.

U hebt echter rechtstreeks toegang tot de online PhoneGap Build-service en u kunt gebruikmaken van de meest recente functie-updates om uw webtoepassingen te verpakken als systeemeigen mobiele toepassingen. Zie PhoneGap Build gebruiken met de nieuwste update naar de 2014-versie van Dreamweaver CC voor meer informatie.

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