Tip:
Highlight text to annotate it
X
In this video, we will cover some of the toolbars used in Dreamweaver CS6 with the classic workspace.
With Dreamweaver open, I am going to go ahead and open a new HTML file
and we can see a few more of the toolbars show up.
So at the very top we have the application toolbar.
You can find all of the commands you can use in Dreamweaver from these menus.
"View" will allow you to change viewing options. "Window" will allow you to open and close panels.
"Commands" are various site commands.
For the most part, we will use 'View', 'Window' and 'Site'.
Just below that, in the classic workspace we have the insert panel, which shows up much more like a toolbar.
There are a bunch of different options
And even a "Favorites" option if you want to customize your own toolbar by right-clicking, then clicking "Customize Favorites"
You can choose from the tabs that are already assigned in the insert toolbar
take a link or various button you want to add, click the arrows and there it is.
Once I click Okay, you will see that button show up in the "Favorites" toolbar.
Use the trash can to delete the buttons off the favorites.
Below that, when you have a document open you will see the document toolbar
These three buttons here, probably the most important, you have your three different view options.
So you can look at just the HTML code or CSS code.
You can look at a "Split" view of the HTML code next to the code in the screen that will show up on the webpage
If I created a heading for example, you will see that the H1 shows up in the code.
And over here this is what it will look like, so that is what Design view is. Design view is just what the page will look like.
Code is the actual code, and Split is a combination of both.
If you do not like the split side by side, you can go to "View" and click the "Split Vertically" so it is unchecked
And you can show a horizontal split
These buttons over here are various buttons for doing different screen sizes.
For previewing the files in a web browser and then various other tools that we will not get into.
For the most part, we will be using the "Design" view as well as the "Split" view.
The other button next to design is "Live" which will show the webpage as it exists in a browser
and you will notice that the browser bar changes, and we have an actual brower-style address bar
as well as some other options to inspect code elements and refresh the page.