Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
I want to talk about the various methods for previewing web pages. And also show you something that can occur depending upon how you set up your testing server piece. So this is going to correct an issue that our testing server and installing the course files movie led us to. And this can happen to you on your own so I just want to show it to you so you know how to deal with it. Now the easiest way to preview files in the browser, and I just opened up our home page named Index, is to use this globe, and whatever browsers were installed on your system when DreamWeaver was installed, they will be pulled in to this area.
You can see the shortcuts are here. It's very handy to get used to using the shortcuts to get into your browser. Now within this area, I will preview in Firefox, and I get this message. Now I thought we set up a testing server when we set up our course files. So I'll say would you like to specify one now, I will click yes. And here is what's going on. This site has been set up. You can see there's a green arrow. And this is 1 of the newer features in Dreamweaver.
So, you may not have this in your version. But notice how servers has this Red icon. And if I hover over it, it says incomplete. I defined a testing Server as the name but I did not define a Testing Server in the important area, which is over here at the other end. What Dreamweaver is saying is you don't have a Testing Server, you don't have a way to view PHP pages from within Dreamweaver.
What we want to do is we don't have a remote Server. What we have is a testing server. So I'll just click testing, uncheck remote. If we had a web server out on the Internet that we wanted to be able to upload to from Dreamweaver, we use remote. But if want a local development environment, we just choose testing. Now, if I save, you can see I can immediately preview a page. So we'll go back. I'll show you that same piece.
Now we preview in Firefox, open it up and there's our website. So you must check that check box for testing when you set up your site in Dreamweaver, if you want to be able to use it as a testing environment. In our dynamic slide we went through the need for an application type server, and our server installed PHP and My Sequel at the same time, so that's what Dreamweaver needs to know about. Whereas the PHP located for processing this page, because our header and our footer are being pulled in...
By using something called includes. In other words PHP has to be operating in order for that to work. So we have fixed that piece now let's view some other ways to preview our pages. Another method is this live view button and this live view button, as of CS5 has become a very active button. If you click Live view, I can preview my page right from within the Dreamweaver interface. What it does, is turn on a browser right within this area, now this is not going to be how it looks in every browser. However, it is a full fledged browser, within the Dream Weaver interface as of now.
If I click that button, though. Notice our insert bar is completely greyed out. You cannot edit in this live view. Just like you cannot edit your webpage in a browser. So in order to edit once again, you click that button 1 more time. Moves you out of browser view. And most of you into the ability to edit once again in Dreamweaver. And it's very easy to accidentally bump this button, not realized you've clicked it and you're having trouble editing in the inter phase, and that's all it is. So that is how you can preview pages.
Now you have two short cuts for your main two browsers if you wish to add more browsers Then these two. Which ever two you want on your system. You select browser list. And it takes you out to the preferences area. Where you can add more browsers. So you can put more then two on, but only two of them have the ability to be default shortcuts. So that is editing your browser list. The other piece you can do in here is device central, is a location where you can preview your web pages within mobile devices.
So that's device central. The other piece browser Lem is a service you can pay for on a monthly basis from Adobe. And it allows you to preview in different operating systems and different browsers without having to maintain Those systems yourself. You can kind of borrow Adobe's so to speak. And it's a monthly service. Comes in handy so you're not going to have every computer available. Browser Lab gives you the opportunity to do that. So once you come here, you have to sign into your Browser Lab account, and then you have access to viewing your pages.
So those are the various methods, for previewing your pages from within Dreamweaver, and being able to go out and see what they will look like in the browsers themselves.
Get unlimited access to all courses for just $25/month.Become a member
61 Video lessons · 104910 Viewers
56 Video lessons · 116753 Viewers
71 Video lessons · 85980 Viewers
131 Video lessons · 41120 Viewers
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.