Custom Code Coloring in Dreamweaver for Designers & Developers

Works with CS6 / CS5.5 / CS5 / CS4 / CS3 on both PC & Mac

Instructions for both Windows & Mac

  1. Close Dreamweaver
  2. Browse to: C:\Documents and Settings\%username%\Application Data\Adobe\Dreamweaver 9\Configuration\CodeColoring (on WinXP) or C:\Users\%username%\Application Data\Adobe\Dreamweaver 9\Configuration\CodeColoring (on Vista) or C:\Users\%username%\AppData\Roaming\Adobe\Dreamweaver CS4\en_US\Configuration\CodeColoring (on Windows 7) or username/Library/Application Support/Adobe/Dreamweaver CSx/en_US/Configuration/ CodeColoring/Colors.xml (on Mac)
  3. Rename the Colors.xml file to something else – say Colors_old.xml (This will be the file you go back to if you don’t like the new color scheme)
  4. Download and extract the above zip file to the location you opened at step 2.
  5. Open Dreamweaver, press CTRL + U or go to Edit/Preferences/Code coloring and change the default background color to #252A32

That’s pretty much it. Open a file and switch to code to view the new theme. Combine this with a good programming font (Droid Sans Mono) and you can thank me.

I don’t like it! Put it back!

Changed your mind? No problem. Just close Dreamweaver, delete the Colors.xml file and then rename Colors_old.xml back to Colors.xml. Oh and don’t forget to change the default background color to #FFFFFF in the preferences (ala point 5).

credit goes to splinterteal.co.uk – Freelance Web Designer

Dreamweaver CC & CS6 Shortcuts

Below you can find Dreamweaver CC shortcuts (work with CS6 & CS5 too). Industry-leading web design software.

Insert

Non-Breaking Space ( )Ctrl-Shift-Space
Line Break Shift-Return
ImageCtrl-Alt-I
TableCtrl-Alt-T

Modify

Quick Tag EditorCtrl-T
Show Code NavigatorCtrl-Alt-Click

Working with tables

Select individual (or multiple, discontinuous) table cellsCtrl-click cell(s)
Select Table (with cursor inside the table)Ctrl-A (may need to do twice)
Insert RowCtrl-M
Insert ColumnCtrl-Shift-A
Delete RowCtrl-Shift-M
Delete ColumnCtrl-Shift-hyphen(-)
Merge Selected CellsCtrl-Alt-M
Split Cell…Ctrl-Alt-S
Increase Column SpanCtrl-Shift-]
Decrease Column SpanCtrl-Shift-[
Add new row at bottom of tablewith cursor in bottom right table cell, hit Tab

Working with frames

Add a new frame to framesetIn the Frames panel select the frame, then in the document window Alt-drag frame border
Pull out solid frame (creates Nested Frameset)Ctrl-drag frame border
Select a frameAlt-click in frame
Select next frame or framesetAlt-Right arrow
Select previous frame or framesetAlt-Left arrow
Select parent framesetAlt-Up arrow
Select first child frame or framesetAlt-Down arrow

Working with images

Replace image with a different oneDouble-click image
Edit image in external editorCtrl-Double-click image

Working with DIVs

Select a div (without having to click its grab tag)Ctrl-Shift-click

Working with links

Make Link…Ctrl-L
Remove LinkCtrl-Shift-L
Open the link-to document in DreamweaverCtrl-Double-click link
Drag & drop to create linkSelect the text, then Shift-drag it to file in Site panel

Formatting text

NoneCtrl-0
Heading 1Ctrl-1
Heading 2Ctrl-2
Heading 3Ctrl-3
Heading 4Ctrl-4
Heading 5Ctrl-5
Heading 6Ctrl-6
ParagraphCtrl-Shift-P
Left …Ctrl-Alt-Shift-L
CenterCtrl-Alt-Shift-C
RightCtrl-Alt-Shift-R
JustifyCtrl-Alt-Shift-J
Text IndentCtrl-Alt+]
Text OutdentCtrl-Alt+[

Document editing

Go to Next WordCtrl-Right arrow
Go to Previous WordCtrl-Left arrow
Go to Previous ParagraphCtrl-Up arrow
Go to Next ParagraphCtrl-Down arrow
Select Until Next WordCtrl-Shift-Right arrow
Select From Previous WordCtrl-Shift-Left arrow
Select From Previous ParagraphCtrl-Shift-Up arrow
Select Until Next ParagraphCtrl-Shift-Down arrow
Edit TagShift-F5
Exit ParagraphCtrl-Enter

Code editing

Show Code HintsCtrl-Space
Quick Tag EditorCtrl-T
Select Parent TagCtrl-[
Select ChildCtrl-]
Balance BracesCtrl-‘
Find Next (Find Again)F3
Select line up/downShift-Up/Down arrow
Character select left/rightShift-Left/Right arrow
Select to page up/downShift-Page Up/Page Down
Move to word on left/rightCtrl-Left/Right arrow
Select to word on left/rightCtrl-Shift-Left/Right arrow
Move to start/end of lineHome/ End
Select to start/end of lineShift-Home/End
Move to top/end of fileCtrl-Home/End
Select to start/end of fileCtrl-Shift-Home/End
Go to LineCtrl-G
Indent CodeCtrl-Shift->
Outdent CodeCtrl-Shift-<

View

Switch between Code and Design ViewsCtrl-` (that’s the ~ key)
Switch All Windows to a Specific ViewCtrl-Click Code or Design View Button
Switch between Documents (Tabs)Ctrl-Tab
Refresh Design ViewF5
Live ViewAlt-F11

Working with documents & panels

Show/Hide PanelsF4
Switch to Next Document (Tab)Ctrl-Tab
Switch to Previous Document (Tab)Ctrl-Shift-Tab
BehaviorsShift-F4
BindingsCtrl-F10
Code InspectorF10
ComponentsCtrl-F7
CSS StylesShift-F11
DatabasesCtrl-Shift-F10
Files.F8
FramesShift-F2
HistoryShift-F10
AP ElementsF2
PropertiesCtrl-F3
ReferenceShift-F1
ResultsF7
Server BehaviorsCtrl-F9
SnippetsShift-F9
Tag InspectorF9

Misc

Check SpellingShift-F7
Get File from ServerCtrl-Shift-D
Put File on ServerCtrl-Shift-U

Contents

Print Friendly, PDF & Email