Sign In | Subscribe
Start learning today, and be successful in your academic & professional career. Start Today!
Loading video...
This is a quick preview of the lesson. For full access, please Log In or Sign up.
For more information, please see full course syllabus of Adobe Dreamweaver CS6
  • Discussion

  • Study Guides

  • Download Lecture Slides

  • Table of Contents

  • Transcription

  • Related Books

Bookmark and Share

Start Learning Now

Our free lessons will get you started (Adobe Flash® required).
Get immediate access to our entire library.

Sign up for

Membership Overview

  • Unlimited access to our entire library of courses.
  • Search and jump to exactly what you want to learn.
  • *Ask questions and get answers from the community and our teachers!
  • Practice questions with step-by-step solutions.
  • Download lesson files for programming and software training practice.
  • Track your course viewing progress.
  • Download lecture slides for taking notes.
  • Learn at your own pace... anytime, anywhere!

Inserting Flash Files

  • We are going to take a look at how easy it is to insert a Flash file into a web page using Dreamweaver
  • We have a snazzy new flash slideshow for our homepage instead of the static graphic that is showing now
  • This flash file was created using a free program called Flash Slideshow Maker
  • This is an interesting program that offers many themes to use for your slide show
  • When working in Flash you work in a .fla file, but the file that gets inserted into your web pages is a .swf file
    • To insert a Flash file, choose Insert->Media->SWF
    • Choose slideshow.swf from the SWF area within the Assets panel
    • Once you have inserted the Flash file and save the page, you will get a prompt about additional files that Dreamweaver called Scripts that will be inserted into the root folder
    • These files are needed on the web server in order for the Flash file to work in the browser
    • You can view the Flash file in Design view by clicking the Play button in the Properties panel
  • Preview the file in the browser & you should see the Flash file playing provided you have the Flash plugin installed

Inserting Flash Files

Lecture Slides are screen-captured images of important points in the lecture. Students can download and print out these lecture slide images to do practice problems as well as take notes while watching the lecture.

  • Intro 0:00
  • Create New HTML Page 0:10
  • Inserting SWF File 0:37
    • Preview SWF File
    • Add SWF File
    • Autoplay and Loop Options
  • SWF File Flash Player Error Message 6:12
  • Copy Dependent Files 6:52
  • Summary 8:22

Transcription: Inserting Flash Files

We're now going to take a look at how to insert a Flash file, specifically an SWF (or "swif") file, into your web pages.0000

So, I'm going to create a new page in order to do this.0011

I'll create a new HTML page; I already have the Flash file available, and I am going to save this page as Slideshow.0014

What this is, is a little slideshow of images that were taken on travel trips, that we want to put onto our website.0028

But I'll show you how to insert a .swf, for now, onto this web page.0037

The first thing is: I'm going to say "Slideshow of travels with Wanderlust Travel."0042

And "Here is a preview of some images from our visits"; there we go.0055

So, just a little bit of text before we add it: I'm going to make the top line a Header 1, and I'll place my cursor exactly where I want the image.0069

Now, it isn't quite as important, if it's a regular Flash file, to do that; but I am going to go back to the Assets panel (which is the panel next to the Files panel--and, in case, you can't find it, it is located here in the Window menu).0080

Now, within the Assets panel, there is an area that will allow you to view your SWF files within your website.0098

So, I'll open this up just a little bit more, because that is what we are going to do.0107

I'll go down to the red square that says SWF when you hover over it; and that is the format for a Flash file that you will insert into your website.0111

I'll go ahead and click on that; and it doesn't look like we have any Flash files right now in our website, but one thing about the Assets panel is: it does not auto-refresh like the Files panel does.0124

You always have to keep that in mind: if you add anything to your website files, you will need to come here...and way down at the bottom is this circular blue icon, and it's the very first icon at the bottom right.0139

If you click that, you should see slideshow.swf as a file.0156

Now, Flash is a vector graphic, so it requires math to be done in order to display.0163

So, usually, it will display as this little square of whatever size the Flash file is, and it will have this curved F in the middle of it.0170

But up in the upper-right corner in this SWF area, there is a Play button; and what that does is turns on the Flash player; and the Flash player does the math for us.0181

So, if you click that green Play button, you should start to see some content being pulled in within this area.0193

And you can see, it kind of has a built-in rotating feature; so I'll go ahead and turn it off--we know we have the Flash file available in our files.0202

Now, how do I add a Flash file?0212

What I do is literally just like an image: I click on it and drag it onto the page.0217

And when you do that, a title attribute pops up; and you can think of this title as being similar to the alternate on an image.0224

So, this is going to be a Slideshow of Travels.0235

I'll go ahead and click OK, and there is my Flash file.0241

Let's go ahead and click Live View; I'll click the Live button, and take a look at our slideshow.0247

You can see, there it is; and it is rotating just fine; what this is set up with is a series of random slides in and out of the images, so each one is a little bit different.0256

I'll turn off Live View, and we can take a look at it in the Dreamweaver interface.0274

Let me slide this back over where it belongs; it's taking up a lot of space.0281

The other thing I want to show you is: I'm going to open the Properties area.0285

Now, when I select this Flash file, the Properties will show me the items specifically for this Flash file; and it tells me where it's located and a few other features.0290

But one thing that is available to you in the bottom left-hand corner is what is known as Autoplay and Loop.0305

Now, Autoplay means "start playing the Flash file as soon as the page is loaded."0314

The looping is supposed to loop the content--in other words, "keep this Flash file playing."0321

But depending upon the Flash file you are using, this Loop--checking and unchecking it may or may not work.0328

And that is nothing to do with Dreamweaver; that has to do with the Flash file itself, because the Flash file, the .swf file, stores whether or not it can restart.0337

And, if there is a built-in stopping mechanism in the Flash file, this loop will not do anything.0349

Now notice, there is also a Play button down here; so I'll click Play; there is my slideshow; I click Stop; it stops.0357

There is my slideshow, added as a .swf file.0367

What I can do up in this upper blue tab is: if I click the eyeball, this is what my page is going to look like to somebody who might not have the Flash Player.0372

And you can customize this; Adobe drops this in, basically, via Dreamweaver--fully editable: you can add some additional messages or whatever you want.0385

You click on the eyeball again, and you can see your Flash file.0398

That is how you can add a Flash file to your web page; I'll go ahead and save this.0402

Now, this is the other thing that occurs when you go to insert Flash on your website.0412

In order for this Flash file to play once it gets on a Web server, there are a couple of additional files that need to be installed on your Web server; and this little message here is Dreamweaver reminding you about that.0418

What Dreamweaver is going to do is add a Javascript file, and also another install file; and those files are located in a Scripts folder within my website.0434

So, you need to make sure, if you want your Flash file to play correctly, that that Scripts folder gets placed in your files on the Web server, along with this page.0448

I'll click OK; now, if I go back to my Files panel and do a refresh, this is the folder Dreamweaver was talking about.0461

If I hit the + sign, you will see that there are those two files that it was referencing, inside this folder.0471

As long as I upload my entire website to the Web server when I decide to take this website live, and include this, my Flash should be fine--provided whatever browser is viewing it has the Flash Player installed.0479

In case they don't, there is that Flash button to install it.0496

That is how you can add a .swf file, which is a basic Flash published file, to your website, and let Dreamweaver add the additional files to make sure that it works correctly, and also add the default text showing the browser how to locate the Flash Player.0502

Therefore, the user can determine if they want to install that or not.0526

That is installing a Flash file to your web page within Dreamweaver.0531