2017-utgåvan av Dreamweaver CC

Obs!

Nu finns Dreamweaver CC Oktober 2017 (18.0)-utgåvan! Se Sammanfattning av nya funktioner.

dreamweaver_facebook_profile

2017-utgåvorna av Dreamweaver CC innehåller flera nya funktioner och förbättringar, till exempel stöd för Git, en helt ny kodredigerare och ett mer intuitivt användargränssnitt med ett valbart mörkt tema. De innehåller även ett antal förbättringar, bland annat en förbättrad startupplevelse. 

Läs vidare så får du veta mer om de nya funktionerna och förbättringarna.

En sammanfattning av funktioner som introducerades i tidigare versioner av Dreamweaver CC finns i Sammanfattning av funktioner | Dreamweaver CC 2015-versioner.


Adobe Dreamweaver CC 2017.5-utgåvan

I Dreamweaver CC 2017.5 finns stöd för följande nya funktioner och förbättringar:

Läs vidare för att lära dig mer om de här funktionerna och förbättringarna.

Stöd för Git i Dreamweaver

I Dreamweaver CC 2017.5 finns stöd för Git, som är ett versionshanteringssystem som bygger på öppen källkod. Det nya stödet för Git gör det enkelt att hantera dina filer, inklusive källkod, direkt i Dreamweaver.

Nu har du möjlighet att utföra vanliga Git-åtgärder direkt i Dreamweaver utan att behöva använda några tredjepartsverktyg. Den nya Git panelen (Fönster > Git) gör det möjligt att utföra olika Git-åtgärder, till exempel implementera, push, pull och hämta.

Du kan även använda Git som ett samarbetsverktyg genom att skapa och sammanfoga grenar och fjärrdatabaser. Du kan även se skillnaderna mellan två versioner av en fil, och visa fil- och databashistorik. 

Panelen Filer i Dreamweaver har nu även stöd för en ny Git-vy. I den här vyn kan du hantera ospårade, ändrade, mellanlagrade och implementerade filer som är kopplade till din plats. 

Mer information om hur du använder Git för versionskontroll och samarbete finns i Använda Git i Dreamweaver.

Använda Git i Dreamweaver
Använda Git i Dreamweaver

Nya kodteman

I Dreamweaver CC 2017.5 finns nu stöd för två nya kodteman: Monaki och Classic. Du kan välja och använda dessa kodteman och få kodfärger som liknar färgerna i Dreamweaver CC 2015. 

Välj Dreamweaver > Inställningar (macOS) eller Redigera > Inställningar > Gränssnitt (Windows) för att prova nya kodteman som ger förbättrad läsbarhet och är visuellt tilltalande.

Nya kodteman i Dreamweaver 2017.5 – Monaki och Classic
Nya kodteman i Dreamweaver 2017.5 – Monaki och Classic

Förbättrad startupplevelse

När du startar Dreamweaver CC 2017.5 för första gången ger välkomstskärmen en förbättrad startupplevelse. Den nya startupplevelsen visar någon av följande två videosjälvstudiekurser beroende på vilken arbetsyta du väljer:

  • En kort självstudiekurs om arbetsytan för utvecklare
  • En kort självstudiekurs om standardarbetsytan
Förbättrad startupplevelse i Dreamweaver
Förbättrad startupplevelse i Dreamweaver 2017.5

Du kan även visa de två videosjälvstudiekurserna via Hjälp-menyn. Klicka på Hjälp > Snabbsjälvstudiekurs för att visa självstudiekurserna.

Åtkomst till de nya startvideofilmerna från Hjälp-menyn i Dreamweaver
Åtkomst till de nya startvideofilmerna från Hjälp-menyn

Övriga förbättringar

Dreamweaver CC 2017.5 är nu integrerat med en ny version av CEF. I och med den nya CEF-versionen visar Live-vyn i Dreamweaver anpassade HTML-element, anpassade egenskaper för CSS med mera.

Adobe Dreamweaver CC 2017.1-utgåvan

Följande funktioner ger Dreamweaver CC 2017.1 ytterligare stöd för kodning:

Läs vidare för att få en snabb introduktion till dessa förbättringar.

Stöd för PHP 7.1

I tidigare versioner av Dreamweaver fanns kodtips och parserkontroller för PHP 5.6. Dreamweaver 17.1 är konfigurerad för PHP-versionerna 5.6 och 7.1.

Du kan välja att kompilera din webbplats PHP-filer med 5.6 eller 7.1 på dialogrutan Platskonfiguration, eller genom att välja Redigera > Inställningar.

Mer information om stödet för PHP 7.1 finns i följande artiklar:

Förbättrade funktioner för att söka och ersätta

Den här versionen innehåller viktiga förbättringar i funktionerna för att söka och ersätta. 

Du kan nu använda dialogrutan Sök och ersätt för att söka efter taggar och attribut (Sök > Sök och ersätt i filer). Du kan använda den här dialogrutan även om inga filer är öppna i Dreamweaver (för sökning i en mapp, till exempel).

Snabbpanelen Sök och ersätt (Sök > Sök och ersätt) har nu flyttats till nederkanten av arbetsytan i Dreamweaver. Använd den här panelen för att snabbt söka efter och ersätta text och attribut i det aktuella dokumentet.

Mer information om sök- och ersättfunktioner finns i Sök och ersätt text, taggar och attribut. Information om kända fel i sök- och ersättfunktioner i Dreamweaver 17.1 finns i Kända fel och korrigerade defekter i Dreamweaver CC 2017-utgåvor.

Nya kortkommandon för Sök och ersätt:

  • Sök i aktuellt dokument: Ctrl+F (i Windows), och Cmd+F (på Mac) 
  • Sök och ersätt i filer: Ctrl + Skift + F (i Windows), och Cmd + Skift + F (på Mac) 
  • Ersätt i aktuellt dokument: Ctrl + H (på Windows), och Cmd + Alt + F (på Mac)

En fullständig lista med kortkommandon för sök och ersätt finns i Kortkommandon för Sök och ersätt.

Uppdatering till Dreamweaver CC 2017 (17.0.2)

Skapa e-postkampanjer i Dreamweaver med Campaign

Använd Campaign-tillägget i Dreamweaver för att skapa egna anpassade e-postkampanjer. 

Eget anpassat innehåll är viktigt för att komma i direktkontakt med läsaren och ger större möjlighet till framgång med e-postkampanjer. 

Om du redan skapar e-postkampanjer i Dreamweaver kan du nu gå vidare och lägga till anpassat innehåll (t.ex. läsarens namn eller en anpassad uppmaning) med data från Adobe Campaign.

Börja med att ladda ned Campaign-tillägget genom att klicka på Fönster > Tillägg > Bläddra bland tillägg. Skapa sedan ett nytt e-postnyhetsbrev eller redigera ett befintligt. När du är klar med designen kan du anpassa innehållet med hjälp av fälten och innehållsavsnitten i Campaign. Sedan är du redo att skicka! 

Dreamweaver synkroniserar automatiskt med Campaign så att dina innehållsändringar i Dreamweaver finns tillgängliga i Campaign. Allt du behöver göra är att ange en e-postadress och skicka ett anpassat kampanjmeddelande till mottagaren.

Mer information finns i Skapa anpassade e-postkampanjer.

Uppdatering till Dreamweaver CC 2017 (17.0.1)

Stöd för inbyggd kodfärgning

Du kan nu skapa och anpassa kodteman baserat på det ljusa eller mörka standardtemat. Du kan därefter anpassa kodfärgerna genom att ändra de högra väljarna i temafilen.

Markera det ljusa eller mörka standardkodtemat i Redigera > Inställningar > Gränssnitt. Om du vill ändra kodfärgerna sparat du temat med ett nytt namn och redigerar sedan temafilen. 

Mer information om hur du anpassar kodfärger finns i Anpassa kodfärgning.

Obs!

Den här versionen innehåller även korrigeringar av ett antal defekter. Mer information om korrigerade defekter finns i Kända fel och korrigerade defekter i Dreamweaver CC 2017-utgåvan.

Dreamweaver CC 2017-utgåvan (17.0)

Dreamweaver CC 2017 har en helt ny kodredigerare, ett mer intuitivt gränssnitt med valbara mörka och ljusa teman, och flera förbättringar som t.ex. stöd för nya arbetsflöden med bland annat CSS-preprocessorer.

Läs vidare för att se en fullständig lista över vad som är nytt och ändrat i Dreamweaver CC 2017:

Omarbetad kodredigerare

Kodredigeraren i Dreamweaver har fått flera funktionsförbättringar som hjälper dig skriva kod snabbt och effektivt.

Med kodtips kan oerfarna användare lära sig HTML, CSS och andra webbstandarder. Och med visuella hjälpmedel som automatisk infogning, kodfärgning och teckensnitt som kan storleksförändras blir det enklare att läsa koden och på så sätt minska risken för fel. 

Kodtips

Funktionen för kodtips i Dreamweaver har förbättrats och ger mer användbar information om den markerade koden.

I tidigare versioner av Dreamweaver visades en lista med relevant kod när du skrev in en höger vinkelparentes.

I den här versionen ser du inte bara den relevanta koden, du får även ytterligare information som hjälper dig arbeta med HTML, CSS och annan webbteknik i Dreamweaver. 

Förbättrade kodtips
Förbättrade kodtips

Mer information finns i Kodtips och kodkomplettering.

Förbättringar i kodvisningen

Kodens utseende har förbättrats och är lättare att läsa. Kodformatering och kodfärgning har förbättrats. 

Kodformatering

När du skriver kod gör Dreamweaver automatiska indrag för att undvika felaktiga manuella indrag och förbättra läsbarheten. 

Kodfärgning

I Dreamweaver finns nu stöd för kodfärgning för fler filtyper.

Stödet för kodfärgning gäller nu för HTML, JS, CSS, PHP, XML, LESS, Sass, SCSS, SVG, Bash, C, C#, C++, clojure, CoffeeScript, Dart, Diff, EJS, Embedded Ruby, Groovy, Handlebars, Haskell, Haxe, Java, JSON, Lua, Markdown, Markdown (GitHub), Perl, Properties, Python, RDF Turtle, Ruby, Scala, SQL, Stylus, Text, VB, VBScript, XML och YAML. 

Du kan ändra syntaxmarkering för olika filtyper direkt på statusfältet i kodvyn.

Mer information om de här ändringarna finns i Kodningsmiljön i Dreamweaver.

Stöd för CSS-preprocessor

Nu har Dreamweaver stöd för vanliga CSS-preprocessorer som t.ex. Sass, Less och SCSS, med full kodfärgning och kompilering. Det gör att du sparar tid och kan skapa en mer stringent kod.

Mer information om stöd för CSS-förprocessorer i Dreamweaver finns i Använda CSS-preprocessorer i Dreamweaver.

Förhandsvisa i realtid i webbläsare

Förhandsvisa dina kodändringar i webbläsaren i realtid utan att behöva uppdatera sidan. Dreamweaver ansluter nu till webbläsaren så att ändringarna visas direkt i webbläsaren utan att sidan behöver laddas om. 

Förhandsvisa ändringar i webbläsaren i realtid
Förhandsvisa ändringar i webbläsaren i realtid

Mer information finns i Förhandsvisning i webbläsare i realtid.

Snabbredigering av relaterade kodfiler (Snabbredigering)

Om du snabbt vill ändra kod placerar du markören på särskilda kodfragment och använder snabbmenyn eller så trycker du på Ctrl-E (i Windows) eller Cmd-E (på Mac) för att öppna Snabbredigering.

Dreamweaver ger dig sammanhangsberoende kodalternativ och interna verktyg.

Mer information finns i Snabbredigering.

Redigera snabbt relaterad kod utan att behöva öppna flera filer eller flikar
Redigera snabbt relaterad kod utan att behöva öppna flera filer eller flikar

Sammanhangsberoende CSS-dokumentation (Snabbdokument)

Dreamweaver visar sammanhangsanpassad dokumentation för CSS-egenskaper direkt i kodvyn.

Nu behöver du inte navigera till en webbsida utanför Dreamweaver för att få veta mer om CSS-egenskaper. Tryck på Ctrl + K (i Windows) eller Cmd + K (på Mac) så öppnas CSS-hjälpen.

Hjälp via snabbdokument för CSS i Dreamweavers kodvy
Hjälp via snabbdokument för CSS i Dreamweavers kodvy

Flera markörer för att skriva och redigera kod

Skriv flera rader kod samtidigt med flera markörer. 

Den här funktionen höjer produktiviteten enormt eftersom du inte behöver skriva samma kodrad flera gånger.

Så här aktiverar du flera markörer:

  • Om du vill lägga till markörer på flera sammanhängande rader håller du ned Alt och drar vertikalt. 
  • Om du vill lägga till markörer på flera osammanhängande textrader trycker du på Ctrl-tangenten och klickar på de olika rader där du vill placera markören.
  • Tryck på Alt-tangenten och dra diagonalt om du vill markera sammanhängande textrader.
  • Om du vill markera osammanhängande textrader markerar du en del text och trycker sedan på Ctrl (Windows) eller Cmd (Mac) och fortsätter att göra fler markeringar. 
Multicursor-GIF3

Modernt användargränssnitt

Dreamweaver har fått ett mer intuitivt och anpassningsbart gränssnitt med fler menyer och paneler, och ett kontextanpassat och anpassningsbart verktygsfält som bara visar de verktyg du behöver.

Det nya gränssnittet erbjuder även fyra kontrastnivåer från ljust till mörkt, så att det blir enklare att läsa och redigera kodraderna.

Här är några före- och efter-bilder av det nya användargränssnittet.

Modern user interface_2
Användargränssnitt - Dreamweaver 2015-versionerna

newUI
Nytt användargränssnitt – Dreamweaver CC 2017


Menyer, verktygsfält och arbetsytor har fått en ny utformning i den här versionen av Dreamweaver. Läs vidare för att få mer information om dessa ändringar.

Ändringar i arbetsytan

Dreamweaver-gränssnittet är optimerat för att inkludera följande standardarbetsytor:

  • Arbetsyta för utvecklare

Den här arbetsytan är minimal och innehåller som standard bara de paneler som är viktigast för utvecklare som kodar webbplatser, till exempel filpanelen och panelen Kodfragment.

  • Standardarbetsyta 

Den här arbetsytan innehåller allt du behöver när du arbetar med både kod och design, till exempel panelerna Filer, CC Libraries, CSS Designer, Infoga, DOM, Resurser och Kodfragment.

Obs!

När du har valt en arbetsyta kan du anpassa den genom att lägga till eller ta bort paneler. Mer information om hur du anpassar arbetsytor finns i Skapa anpassade arbetsytor.

Här är en sammanfattning av hur arbetsytorna i Dreamweaver CC 2015 och Dreamweaver CC 2017 skiljer sig åt.

Dreamweaver CC 2015

  • Nybörjare
  • Kod
  • Standard
  • Design
  • Extract

Dreamweaver CC 2017

  • Utvecklare
  • Standard

Mer information om ändringarna i arbetsytan finns i Arbetsytan i Dreamweaver.

Ändringar av menyer

Programmenyn har gjorts om för att minska antalet sällan använda menyobjekt, och flytta andra till mer logiska platser i programmet.

En detaljerad beskrivning av ändringarna av programmenyn i Dreamweaver finns i Omarbetade menyer.

Ändringar av verktygsfält

Nu ser verktygsfältet likadant ut i alla vyer. Verktygsfältet visar bara de verktyg du behöver för att arbeta i den vy du har valt.

Men du kan anpassa verktygsfältet så att du har din egen verktygsuppsättning på det. 

Mer information finns i Översikt av verktygsfält.

Ändringar i statusfältet

I statusfältet visas nu praktisk information när du arbetar i kodvyn. 

Nu kan du:

  • Växla mellan infogningsläge (INF) och överskrivningsläge (OVR)
  • Se rad- och kolumnnummer längst ned på skärmen. Dessa nummer visar vilken rad och kolumn som muspekaren är placerad i.
  • Välja önskad kodfärgning för olika typer av kodfiler.

Mer information finns i Översikt av statusfältet.

Ändringar av panelen Kodfragment

Panelen Kodfragment har nu ett nytt, renare utseende och har ändrats så att det blir enklare att infoga kodfragment.

Följande bild visar de största förändringarna av panelen Kodfragment:

Ändringar i panelen Kodfragments användargränssnitt
Ändringar i panelen Kodfragments användargränssnitt

I tidigare versioner av Dreamweaver behövde du infoga kodfragment genom att använda kortkommandon.

Det var opraktiskt att infoga kodfragment med kortkommandon av följande orsaker:

  • Behovet av att komma ihåg kortkommandon som inte var intuitiva
  • Möjliga konflikter med kortkommandon för andra produkter

I den här versionen av Dreamweaver kan du använda utlösare för att infoga kodfragment.

Utlösare är användarvänliga textsträngar som tilldelats kodfragment. Om det till exempel finns ett kodfragment som skapar en mailto-länk, kan du skriva ”mailto” och göra det till en utlösare.

När du tilldelat en utlösare placerar du markören i dokumentet, skriver ”mailto” och trycker på Tabb. Då infogar Dreamweaver det kopplade kodfragmentet i ditt dokument.

Mer information om panelen Kodfragment finns i Återanvända kod med fragment.

Ändringar av filpanelen

Den nya filpanelen är förenklad och mer intuitiv.

I sin enklaste form visar filpanelen en lista över de lokala filerna på din dator. Ju mer du arbetar med filpanelen (konfigurerar en plats, skapar anslutningar till fjärrservrar, aktiverar in- och utcheckning), desto fler alternativ visas i panelen.

Mer information om ändringarna av filpanelen finns i Den omarbetade filpanelen.

Ändringar av välkomstskärmen och startupplevelsen

När du startar Dreamweaver, eller när du stänger alla Dreamweaver-dokument, visas en ny Start-arbetsyta. Du har enkelt åtkomst till de senast använda filerna, bibliotek och startmallar på Start-arbetsytan.

Om du föredrar de tidigare dialogrutorna kan du mata in Ctrl/Cmd + O för att visa dialogrutan Öppna, eller Ctrl/Cmd + N för att öppna dialogrutan Nytt dokument.  

För att hjälpa dig komma igång med den nya arbetsytan i Dreamweaver CC 2017 finns en komma igång-guide. Du kan stega igenom anpassningsfunktionerna och få en arbetsyta och ett tema som passar dina behov. 

Mer information finns i Arbetsytan i Dreamweaver.

Markera direkt i sök och ersätt

Det nya diskreta verktygsfältet Sök och ersätt är placerat högst upp i fönstret och döljer inget av skärmen.

Sök och ersätt är nu snabbare och mer effektivt jämfört med tidigare versioner av Dreamweaver. Dreamweaver söker efter söksträngar medan du skriver på sökpanelen och markerar alla förekomster av strängen i det aktuella dokumentet. 

Mer information finns i Söka och ersätta text.

Förbättringar i Creative Cloud Libraries

Arkivera, återställ, lägg till kommentarer och se versionshistorik för allt material som ligger i Creative Cloud, inklusive filer i Creative Cloud Libraries, material som skapats med produkter i CC samt mobilprojekt.

Automatisk återställning av filer efter en krasch

Om Dreamweaver avslutas oväntat på grund av systemfel, strömavbrott eller andra problem, kan du återställa ändringar i de filer du redigerade och som inte sparats.

Mer information finns i Automatisk återställning av filer.

Denna produkt är licensierad enligt en Creative Commons Erkännande-Ickekommersiell-Dela Lika 3.0 Unported-licens  Twitter™- och Facebook-inlägg omfattas inte av villkoren i Creative Commons-licensen.

Juridiska meddelanden   |   Onlinesekretesspolicy