flash templates

Swapping Flash template images

The war template is probably the most difficult template to change. However, the steps involved to customize the war template cover just about everything you would need to know to change any of the three templates we have provided, so this tutorial will show instructions on how to change the war template.

Carefully study the structure of the war template in action:

Download the War template with four story sections (.fla)

The process of customizing this template requires several steps.

  1. Prepare all of your images to replace the images in this template
  2. Swap out all of the images in this template with your own.
  3. Change title text on the front page
  4. Change title text on inside pages
  5. Change story text on inside pages
  6. Edit inside media content (video or soundslides)

Preparing all images and content for this template

To use this template exactly how it is currently displayed, but with different images, you have to first prepare ALL your own content to replace the media that is in this template. Flash cannot not resize images efficiently (resizing bitmaps introduces blur and pixelation), so it is important that you prepare all of your images and size them exactly to the specifications below using a program such as photoshop.

The war template contains: (all measurements are Width x Height and are in pixels)

  • Four front vertical navigational images that are 107 x 193
  • Four inside square navigational images that are 107 x 107
  • One background image for the opening of the project that is 900 x 550
  • Three inside "mini-slideshow" images that are about 240 x 180 (each one is different)

Front navigational buttons
The four front navigational buttons are 107x193. You will have to FIRST resize your own images to this size before swapping them out on this template.

Inside navigational buttons
The four inside navigational buttons are all 107 x 107. The border is done in Flash, so you don't have to add that to your images in photoshop.

Three-photo inside slideshow
The three photo slideshow has three photos that all vary in size. Many times people elect to remove the slideshow altogther (which is really easy to do). Just delete the layer that the slideshow is on, and it will remove it from all sections of your project. If you wish to use the slideshow with your own photos, here are the exact dimensions of these three photos:

  • Slideshow-top: 230 x 161
  • Slideshow-middle: 207x163
  • Slideshow-bottom: 246x133

Swapping out all of the images in this template with your own

Flash makes it incredibly easy to swap out images. The only caveat is that the image you are replacing it with must be the same exact size. After opening the war template in Flash, take a look at the "library" panel. (if the library panel is not visible, you can open it using the Window menu at the top of the screen and selecting Library.)

Inside the library, you will see all of the media that comprises this project. Swapping out media is simply a double-click away.

Flash library panel

This process is easiest when you organize the media by type. You can do this by clicking on the "type" heading. These are all of the images and symbols that exist in the war template. Remember, symbols are simply containers. So if you change an image (bitmap), every instance of that image (even the ones inside the symbols) get swapped out as well.

There are 12 photographic images that are a part of this project. Here they are listed:

  • bgphoto.jpg - The background image for the opening section of the project (size 900 x 550)
  • front-nav1.jpg (2.jpg, 3.jpg, etc...) - The front navigational button images (size 107 x 193)
  • insidenav1.jpg (2.jpg, 3.jpg, etc...) - The inside navigational button images (size 107 x 107)
  • slideshow-bottom (middle, top) - The three mini-slideshow photos that play when navigating inside a project (240 x 180)

To swap out an image, double-click on the tree icon of that image in the library. A menu will come up explaining the properties of that image. Click on "import" to import a new photo in its place.

Flash bitmap import replacement

After clicking import, a browser menu will allow you to navigate to the new image that will replace this one. Click the "update" button then click OK. Your image will have replace every instance of the previous image in the entire project.