Using Dreamweaver to insert a Flash movie that has text wrap and a left and bottom customized white space
How can you place a Flash movie (the .swf file) into an HTML document using Dreamweaver CS3? There are three different ways to do this in Dreamweaver.
Insert menu, Media submenu, Flash command will allow you to insert one of your .swf Flash published animations. You simply browse to the swiff file's location using the Select File dialogue box that comes up.
The Common Tab of the layout bar works to insert Flash too. The 7th button in the Common group's toolbar is the Media button. You will see it looks exactly like the Media submenu list of commands. It has all ten commands in the same order.
The Files Panel is the 3rd way. The Files panel is over on the right side of your Dreamweaver workspace. You can switch drives or go to your Desktop and navigate to the folder you have a Flash swiff (.swf) file in. When you drag and drop it right into your document, it will be placed wherever you see the insertion point when you drop it by letting up the mouse button.
How was the above Flash movie (Day6Spr2008.swf) placed with text wrapping right alignment and with horizontal and vertical white space separating it from the wrapping text?
See the Adobe training video Adding Flash Content to a web page using Dreamweaver by Lynn Grillo. I used the easier method of using the Properties Panel to set the HSPACE and the VSPACE and the ALIGNMENT to get the Text Wrapping and Right Justification of the Flash movie above. For this next inserted Flash .swf file, I'll use the CSS (Cascading Style Sheet) method and create a new CSS Rule that gets applied to the Flash movie.
Again, you make sure that the Flash object is selected before you apply actions to it. As Lynn states, she wants to get space on only the left side and the bottom of the Flash content. HTML via the HSPACE and VSPACE settings cannot do that, as these setting apply the extra space to BOTH left and right and to BOTH top and bottom.
Go to the Layout options. Look for Insert, Common, Layout, Forms, Data, Spry, Text, Favorites on the strip just below the menu bar. Layout is the 3rd choice and it effects what toolbar buttons you see. You might have used Common, the 2nd choice, above when you inserted the Flash content (see above, item #2).
Layout Options toolbar has the Insert Div Tag button. Click that button. The dialogue box will have a field to type in the name of your CSS class. I used .winter for that name. Note the period in front of .winter, for the name of the class. The insert field should be set to Wrap Around Selection.
Click the New CSS Style button in the Insert Div Tag dialogue box to get to the next dialogue box, which is titled New CSS Rule. The Selector type will be Class (can apply to any Tag). The Selector will be .winter, the name I chose in the previous dialogue box. The final setting for the New CSS Rule dialogue box will be the option button for This Document Only will be selected. This means your rule is Defined in and for this HTML document only and not applied to everyone after you who uses Dreamweaver on the same computer.
Category Box, Float to the right, give it space along the bottom and the right. I chose 10 for the left and chose 25 for the bottom to exagerate the effect for the above example. The space is pixels, the term for picture elements. More about that later in the class. You obviously have to uncheck the same for all checkbox to give custom settings to the top, right, bottom and left spacings.
CSS Rule Definition for .winter would be what you see in the dialogue box above. Click the OK button when you are done and you are back to the Insert Div Tag dialogue, where you begin this intricate and drawn out process. Click OK there and you are done.
Back in Dreamweaver, you may have to click the Refresh button at the bottom of your user interface.