Once you have made all of the edits to your slide show, you can now publish your project for the Web.

This process will differ somewhat depending on whether you're publishing into a "static"  web site that you control directly or  into a blog or content management system.  Most  of  the instructions below apply to either publishing method, but we've  include a special section for blog/CMS users at the end. 

Even though your original project folder has all of the files necessary to publish your project, you still should click the "EXPORT" button at the bottom of your project window.

Once you click this button, Soundslides will gather all of your images and audio, and create a "Publish_to_Web" folder inside your main project folder.

The contents of your publish_to_web folder will look something like this:

The entire contents of your publish_to_web folder IS your final exported project. It is what you should give your Web team in order to view your Soundslides project online.

The Publish_to_web folder contains several key files:

• Index.html - This is a Web page that holds the full-size version of your Soundslides project.
• Small.html - This is the same as index, but holds a small-size version of of your project (perfect for inclusion in blogs or small bodies of text)
• Audio_hi.mp3 - High quality copy of your audio track.
• Audio_lo.mp3 - Low quality copy of your audio track.
• Soundslide.txt - A data file that contains all of the information of your project (for the most part, you can ignore this file)
• Soundslider.swf - The actual Flash file itself. However, it can't be opened byitself. You will need to use the HTML files included.

Including a Soundslides project in a Web page using Dreamweaver

Soundslides is a great program for editing slide shows because of its ease of use. However, it does not lend itself as well during the production phase. This section covers some advanced coding topics. It is highly recommended that you simply hand off your entire publish_to_web folder to your Webmaster. 

There are a couple of ways to embed a Soundslides project into a Web page yourself:

Method #1: Link to your Soundslides project (highly recommended)

This is by far the easiest way to include Soundslides in your multimedia package. Simply create a link to the index.html file that is inside your publish_to_web folder. This eliminates an enormous amount of hassle of embedding the actual project within your page.

In Dreamweaver, highlight the text you want to link to your Soundslides project (you can also highlight elements like a photo), then click the folder icon on your property inspector and choose the index.html inside your publish_to_web folder.

Example:

It's important to note: You MUST include all the files in your publish_to_web folder on the server you are publishing your Web project to. 

Method #2: Copy-and-paste the embed code

This method is considerably more difficult, especially for people who have never dealt with HTML code. If you need to embed your Soundslides project in a Web page, here's one way to do it:

In Dreamweaver click on the "Split" view icon.

You will notice that your main project area splits into two segments; one for code and one for the design. Whenever you click in the design portion of your Web site (the bottom area), the cursor will automatically move to that corresponding location in your code at the top. This is how you find the spot in your code that you need to paste in the Soundslide's <embed> tags for your project.

Once you have found the location where you want to paste your project, open the index.html file inside your publish_to_web folder using Dreamweaver. (You can do this by going up to the File menu, and selection "open." Dreamweaver will have both pages open, and will use tabs at the top to identify which file is which.)

Click on the "CODE" viewing option, and look for the block of code that looks similar to this:

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="620" height="533" id="soundslider" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="soundslider.swf?size=1&format=txt" />
<param name="quality" value="high" />
<param name="menu" value="false" />
<param name="bgcolor" value="#FFFFFF" />
<embed src="soundslider.swf?size=1&format=txt" quality="high" bgcolor="#FFFFFF" width="620" height="533" name="soundslider" align="middle" menu="false" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> 

Next, copy-and-paste that code into the upper code portion of your Web site page.

NOTE: This will method will only work if you include the contents of your publish_to_web folder in the same folder as your Web page HTML file.

 Method 3) Using Dreamweaver's Embed function

Dreamweaver has some pre-built Flash embed options built into it. With these tools, you can embed a Soundslides presentation. This method is a little tricky and is designed for advanced users of Dreamweaver.

In Dreamweaver, click on the INSERT menu at the top of the screen, then select MEDIA --> FLASH.

A dialogue box will appear asking for your flash file. Navigate to your publish_to_web folder and select your SOUNDSLIDER.SWF file (not the index.html file).

IMPORTANT! Do not click OK, instead, you must set two parameters for Soundslides to work correctly. Press the "Parameters" button. This will allow you to add two very important parameters: The size of your slide show, and the method it uses to process data.

For the parameters you want to set:

"size" with a value of "1"

"format" with a value of "txt"

(note: If you wanted to use the smaller version of your project, set the size to value "0")

Click OK. 

You are almost there, just one last step. Dreamweaver cannot determine the size of this Flash project since it is dynamic (flexible). So you will have to set the size yourself. In the property inspector, set the size to 640 width and 533 height. (note: if you are importing the smaller version of your project, you will have to set the size to 420 by 383.)

Test your movie. Remember, you will need to keep all of the files in your publish_to_web folder intact in order for your slide show to work. 

Publishing slideshows to  a blog or content management system 

Blogs and content management systems generally offer some way to upload files such as images or videos into the body of an article. However, SoundSlides presents a unique problem because it outputs an entire folder full of files - MP3  audio, JPG images, XML reference files, etc.

No content management system that we know of allows you  to upload an entire  folder full of content and keep it intact when it lands on the server. Therefore, you'll  need to place your  entire  publish_to_web  folder on a web server first, then embed that into  an article  or  blog  post.

If you  have direct FTP access to the system hosting your  blog, you should upload your slideshow folder  into the same folder  on the server where other uploaded content lives, and take note of the final  destination URL.

If you don't have direct FTP access, you should be able  to ask your webmaster to upload the folder for  you.  Your webmaster  can then  provide you  with the final  URL  of the uploaded content. 

If this  is not  possible, you may need to upload  your SoundSlides content  to  another server to which you do have access (again, taking note  of its  final URL).

Once you  have this  URL, you  can use  a tool on the SoundSlides web site to generate  embed code which can be inserted  into your article body. If your  blog  or content management system has a WYSIWYG editor, you must  switch to "code" mode before pasting in the embed code. 

Alternatively, if you use WordPress, ask your  administrator to install the Kimili Flash Embed plugin. With this installed, you won't  need the multi-line embed  code, and you won't need to switch your post editor into code mode. Instead, do this:

• Calculate the full  URL to the soundslider.swf  file in your  project. For example, if the SoundSlides project was uploaded (by you or your webmaster) into the  wp-content/uploads/slideshows/mycat/ then the full URL to your project will be something like http://mydomain.com/wp-content/uploads/slideshows/mycat/soundslider.swf

• Paste this line into  your  article  body, while  in Visual (not code) mode:
  [kml_flashembed movie="http://mydomain.com/wp-content/uploads/slideshows/mycat/soundslider.swf" height="250" width="400" /]

• Alter the height and width attributes to  match the dimensions of your slideshow, keeping in mind that  most  publishing systems use  pre-defined templates with a maximum content width.Publish your  post - it should work!