15 Replies Latest reply: Jan 16, 2012 9:38 AM by SLBseeker RSS

    Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)

    SLBseeker

      I know there were other with the same problem in earlier years. But here goes.

       

      I inserted a Windows Media Video file (127mb). When I uploaded it on a new page and placed a nav link on my homepage to take me to it, the file opens in media player separate for me to play it. I want it to play in the page where the file image is placed. But all I have there is a white image box only.

       

      http://www.harvestenterprises-sra.com/FiberDesignsByBenedict.html

       

      Here's the code I have:

       

      <embed src="images/FiberDesignsByBenedict-Slideshow.wmv" width="1033" height="814"> </embed>

       

      I tried to embed Windows Media Player with the code below but kept having trouble with it. It showed the player controls and noted "ready" but couldn't start it or move the scroll bar either. the code must be wrong somehow. Help. Thanks.

       

      </EMBED><OBJECT ID="MediaPlayer" WIDTH="1033" HEIGHT="814" CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"

      STANDBY="Loading Windows Media Player components..." TYPE="application/x-oleobject">

      <PARAM NAME="FileName" VALUE="FiberDesignsByBenedict-Slideshow.wmv">

      <PARAM name="ShowControls" VALUE="true">

      <param name="ShowStatusBar" value="true">

      <PARAM name="ShowDisplay" VALUE="true">

      <PARAM name="autostart" VALUE="true"><EMBED TYPE="application/x-mplayer2" SRC="FiberDesignsByBenedict-Slideshow.wmv"

      WIDTH="1033" HEIGHT="814" ShowControls="1" ShowStatusBar="1" ShowDisplay="1" autostart= "1"></EMBED></OBJECT>

        • 1. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
          Nancy O. MVP

          Start here:

          http://www.mediacollege.com/video/format/windows-media/streaming/embed-examples.html

           

          NOTE: you'll need the plug-in installed for Firefox to play it on the page.

          Some versions of Firefox are not auto initializing the player plug-in so you may need to do it manually.

           

          This tells how:

          http://windows7forums.com/windows-7-support/36617-q-windows-media-player-plugin-firefox.ht ml

           

          Firefox Plug-ins Checker

          http://www.mozilla.org/en-US/plugincheck/

           

           

          Nancy O.

          Alt-Web Design & Publishing

          Web | Graphics | Print | Media  Specialists 

          http://alt-web.com/

          • 2. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
            SLBseeker

            Will try your suggestions. One other thing. When I preview what I have, it all worked fine from within Dreamweaver's preview feature. But when just going to the page outside dreamweaver, it does what I explained above--windows media player opens separate on top of page, not within the image on the page, and no controls under image either. Will keep you posted. Thanks.

            PS I preview in IE. When I preview in Chrome, it says there is no "plugin" to view this image. Does the same on Firefox.

             

            Another factor is when in DW and looks at file features in properties, there is "plugin, 130474K and a blank field under it. Under Src, the "Plg Url" field is also blank. And the "play" button won't work; says "unable to find the plugins in configuration/plug in folders in DW and browsers. Don't know where those folders are. Have IE and Chrome on computer, not Firefox.

             

            Check first link, http://www.mediacollege.com/video/format/windows-media/streaming/embed -examples.html, and that is where I got the second code I pasted above, made the necessary changes, but still doesn't work. It shows up as if it's ready to play, but controls do not work.

            • 3. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
              adninjastrator Community Member

              As for you link, are you linking to the Web page? or are you linking to just the video?... so the anchor just opens the media player rather than the Web page?

              I needed to download an additional plugin to see the video in the link you posted... but then it played fine, with controls and all..... but I had to download the pluggin in both IE and FF...

              What you are seeing with the requirement to download an additional plugin is another good reason not to use .wmv files on the Internet. The compression is poor (your 127MB file shows that) and many visitors will not have the pluggin... nor will they make the effort to download it.

              I'd recommend that you convert your video to a .flv or mp4 file and use a more modern, cross browser friendly video file format.

              Best wishes,

              Adninjastrator

              • 4. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
                SLBseeker

                Linking to the webpage. Then player opens on top of the page and automatically starts playing. I've read that I should save as a .flv or mp4 as you said. Will give it a try and see what happens. Thanks.

                 

                PS Where did you get your plugins anyway? And where does DW have its folder? Where do the browsers have their plugin folders. I searched and searched and couldn't find any. Maybe because I have none, therefore no folder????

                • 5. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
                  adninjastrator Community Member

                  Browser pluggins or "Add ons" have nothing to do with DW, they are browser Add ons and each different browser must have it's own.

                  To see which pluggins a browser has as well as which version of pluggin, click the "Tools" link in the browser menu, then "Manage Add on's" (IE) or just "Add ons" (FF) depending on which browser you are using. Select the Add on you want and then down in lower left, "more info" to find out more info, including the folder location.

                  Best wishes,

                  Adninjastrator

                  • 6. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
                    SLBseeker

                    I converted my wmv to .flv and .mpg using PSEl8 and Premiere8. The .flv didn't work and couldn't be recognized. The .mpg worked but without audio for some strange reason after Premiere converted it to .mpg. So, I went in and removed the video insert and just used images and text to link to both .mwv and .mpg. The only problem now is that the .mpg doesn't have the audio/music going with the videl/slideshow. Any ideas?

                     

                    Also, when I went to download a separate converter via polaris-software.com, Norton caught a trojan and removed it. Needless to say I didn't download it. I've seen all kinds of warnings about using converter programs on the net. So, that's why I changed things out. The links works fast in IE but take anywhere from 2 (.mwv 127mb) -10 (.mpg 380mb) minutes to open in Chrome. And no audio on Chrome either with .mpg.

                     

                    See what both now do for you. If you have any other specific ways, step by step to be able to insert/embed into an html any video with audio that will work across browsers, by all means offer it. I don't really know what to do about plugins. I haven't been able to figure it out. Probably will be upgrading my software that works better all around...maybe even making it easier on inserting/embedding videos. Thanks.

                     

                    http://www.harvestenterprises-sra.com/FiberDesignsByBenedict.html

                     

                    PS. When I open and play the .mpg in PS Premiere8, the audio works there.but not in PSEl8, only the video.

                    • 7. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
                      adninjastrator Community Member

                      The mpg link on your web page is really a no-go... the file is HUGE and no-one will take the time to download it. I've sent you a Private Message here in the Forum with a couple options in it.

                      Best wishes,

                      Adninjastrator

                      • 8. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
                        adninjastrator Community Member

                        Thought a review of what "Video bitrate" is would be helpful. It's very important because the video bitrate must be less than the viewers Internet connection speed or the video will start/stop as the video buffers (download catches up to the display).

                        Video bit rate

                        Video bitrate is the minimum amount of data that must continually flow into the video player in order for the player to display that particular video uninterrupted. If that supply of data is not high enough, the video player will stop…. Wait for more data to download, then resume. The video bitrate is set as a parameter when the video is encoded.

                        One of the principle of goal setting is to "Begin with the end in mind". In this case it'll be very hard to give good recommendations because the end is not defined. So I'll just make a few assumptions and you can correct me as needed.
                        First, I'll assume that since you are converting to Flash, you want to deliver this video over the Internet. If that's true, then we'll have to make some assumptions on the Internet connection download speeds of your potential viewers. Let's just say that most have at least a 1.5Mb connection or faster.
                        OK, that would mean that a video bitrate of half that should usually provide a video download that is not interupped by buffering (most of the time anyway). So assuming a video bitrate of 750kbps, what would the optimum display dimensions be?
                        Before we decide, here's a little info about bitrate. For highest quality playback, the video bitrate is tied directly to the display dimensions. That is, the larger the display, the more incoming data is required to properly display the video. Think of bitrate in terms of a can of paint. If you have 1 quart of paint, you might be able to do a very nice job on a 32 X 24 foot area. But if you try to stretch that same amount of paint out over a 64 X 48 foot area, the coverage will not be nearly as good and you get poor results.
                        In the same way, a video displayed at 640 X 480 pixels will require 4 times the bitrate as a video displayed at 320 X 240 pixels to produce the same quality. So for example a video with a bitrate of 100kbps, displayed at 160 X 120 will produce the same quality results as a video with a bitrate of 1600kbps if displayed at 640 X 480.
                        So to boil it all down, video bitrates of 750kbps, even up to 1000kbps can usually get delivered of the Internet on most high speed connections. Higher bit rates may work for really fast connections but will cause problems for viewers with slower connections. Video display size has a direct bearing on the final quality. In the 750 to 1000kbps range, display size should be kept around 450 or 500 width max (and whatever height the aspect ratio calls for). Yes it can be displayed larger, but the quality will suffer.
                        Sound like your audio settings are fine, especially for Internet delivery.
                        As for framerate, maintain the original raw video framerate for best results. So if the video was shot at 24fps, leave it.
                        As for video converters, do you have the Flash 8 Video Converter? It works just fine for video to be delivered over the Internet. Remember, you are taking a Cadillac version of video (h.264 HD) and stuffing it into a Chevy body to get it to work over the Internet.

                        Best wishes,

                        Adninjastrator

                        • 9. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
                          SLBseeker

                          They both work! Hooray! The only thing I have to do now is redesign the page. I started to like having some samples of my work on it. But it's beginning to be fun now, with your help. Thank you.

                           

                          The .m4v I assume is a mpeg, right? Trying to learn all these extensions. So many. Also, I used that one as text link. In IE it took me to WMPlayer and worked well. In Chrome, it automatically played on a blank page, but the screen was smaller and no way to enlarge it.

                           

                          Also, wish .flv one had controls for viewer being able to move around the video. And that it would give the time duration. And when I preview the page with .flv inserted on page, it has a large note below that says a newer version of flash is required to play this video. How can I reduce the size of the statement? I guess I'll need to play with the font sizes around the .flv file to get it smaller, hopefully.

                           

                          Now, will send it out to friends to test it for me from their end.

                           

                          No, I don't have any video converters except what is offered in Photoshop Premiere Elements 8. Have  Windows Live Movie Maker, but only seems to save as .wmv. In order to do what you did, I assume I need Flash 8 Video Converter?

                           

                          I will also need to read your "bitrate" discussion above several times, since I really don't know where to look to see what the bitrate is for my video. And it will take some add'l brain work to relate it to display dimensions. I did change my display dimensions on the .flv back to 640wx480h.

                           

                          Thanks again for all your help. And will keep you posted after I hear back from my friends, and I do some more brain work on this.

                          • 10. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
                            adninjastrator Community Member

                            Best of luck with your adventure!

                            As for the statement about the newer player... you can remove that all together... not needed at all. There are a number of players with various "skins" available... search around a little... JWPlayer is one... FlowPlayer is another.

                            The .m4v is the iProducts version of the mp4 (which is far removed from the plain old mpeg version, far better compression, etc.). I included that so you can make your video available on mobile products like the iPhone/iPad, etc.

                            I really like the JWPlayer for playing those m4v files... they will play back on a PC or mobile device... check it out sometime:

                            http://www.longtailvideo.com/players

                            And as great as video is at getting your message across to viewers, video is terrible at getting your message across to Search Engines. So I'd suggest that if you go with the Flash version, learn to use swfobject for Flash detection and the ability to add alternate content... which in your case would be a detailed text description of exactly what's going on in the video, the complete narration... using lots of keywords, etc.

                            http://code.google.com/p/swfobject/

                            Don't worry about getting everything perfect when you frst start... we all go through a learning process... one step at a time.

                            Best wishes,

                            Adninjastrator

                            PS... if you want to mark my post as helpful or an answer to your problem... I'd apprecitate it!

                            Oh... and video bitrate of the .flv is 1000kbps + 96 for audio.

                            video bitrate for the m4v is 900 + 96 for audio.

                            • 11. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
                              SLBseeker

                              Thanks for all the suggestions and ways to reach the mobile demographic. Will check them all out. And add some keywords in the text explaining the video more for search engines to pick up.

                               

                              On the "newer player" statement, I didn't type it in on the page. It just shows up when I preview underneath the .flv video ("Content on this page requires a newer version of Adobe Flash Player.") How can I remove it then?

                               

                              Boy, do I have a lot to learn! Thanks for giving me a good start.

                              • 12. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
                                adninjastrator Community Member

                                Open your web page in code view, find that stuff and just comment it out or remove it.

                                <!-- this is a comment, anything between these comment tags will stay on the page source code but will not be visible...use comment tags so you can come back later and then remove the comment tags if needed. -->

                                Best wishes,

                                Adninjastrator

                                • 13. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
                                  SLBseeker

                                  http://www.harvestenterprises-sra.com/FiberDesignsByBenedict.html

                                   

                                  I changed out the page and everything worked in DW preview. Had to use Filezilla to transfer files though. DW "put" feature causes timeouts on some files it seems.

                                   

                                  When I opened in IE, the .flv video was missing completely, just a large space between text lines. In Chrome, all I had for .flv was a white box. The text/image links to the .m4v seemed to work in both--IE going to WMediaPlayer, Chrome downloading .m4v.

                                   

                                  Window Media Player also doesn't recognize .flv, nor has any codec for it. I don't really want to mess with codec packs because of my lack of sufficient knowledge.

                                   

                                  Would rather just have the .flv video show up as it does in DW preview. Your ideas?

                                   

                                  PS I did add the <!-- tags around that statements and it grayed out and disappeared like you said. Would any of the grayed areas make the .flv disappear on IE? Here's the code in DW...

                                   

                                  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="640" height="480" id="FLVPlayer">

                                            <param name="movie" value="FLVPlayer_Progressive.swf" />

                                            <param name="quality" value="high" />

                                            <param name="wmode" value="opaque" />

                                            <param name="scale" value="noscale" />

                                            <param name="salign" value="lt" />

                                            <param name="FlashVars" value="&amp;MM_ComponentVersion=1&amp;skinName=Clear_Skin_1&amp;streamName=images/FiberDe signsByBenedict&amp;autoPlay=false&amp;autoRewind=true" />

                                            <param name="swfversion" value="8,0,0,0" />

                                            <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->

                                            <param name="expressinstall" value="Scripts/expressInstall.swf" />

                                            <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->

                                            <!--[if !IE]>-->

                                            <object type="application/x-shockwave-flash" data="FLVPlayer_Progressive.swf" width="640" height="480">

                                              <!--<![endif]-->

                                              <param name="quality" value="high" />

                                              <param name="wmode" value="opaque" />

                                              <param name="scale" value="noscale" />

                                              <param name="salign" value="lt" />

                                              <param name="FlashVars" value="&amp;MM_ComponentVersion=1&amp;skinName=Clear_Skin_1&amp;streamName=images/FiberDe signsByBenedict&amp;autoPlay=false&amp;autoRewind=true" />

                                              <param name="swfversion" value="8,0,0,0" />

                                              <param name="expressinstall" value="Scripts/expressInstall.swf" />

                                              <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->

                                              <div>

                                              <!--<h4>Content on this page requires a newer version of Adobe Flash Player.</h4>--!>

                                          <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p>

                                        </div>

                                        <!--[if !IE]>-->

                                            </object>

                                            <!--<![endif]-->

                                          </object>

                                  • 14. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
                                    adninjastrator Community Member

                                    Looks like you are missing some of the files. Besides uploading the .flv to your server, you also need to upload the player.swf and the skin .swf.

                                    For example your player .swf is coded to be at:

                                    http://www.harvestenterprises-sra.com/FLVPlayer_Progressive.swf

                                    but returns file not found.... so either the file is not uploaded to the Web server or it was uploaded to the wrong folder.

                                    So be sure to upload all the flash related files, the .flv, the player .swf and the skin .swf (Clear_Skin_1.swf).

                                    Best wishes,

                                    Adninjastrator

                                    • 15. Re: Inserting a Windows Media Video file on an html page (using DW CS5, Windows 7)
                                      SLBseeker

                                      Thanks so much. I don't know what I would have done without your help here. God bless you. I just didn't upload them to the server. Everything works now as far as I can tell. So much to learn. But with helpers like you, this can actually be fun! Now I need to get into my studio and continue weaving projects for an event coming this weekend. Thanks again.