[Webinar] Streamline your web hosting managementRegister Today

x
?
Solved

Typo3 Website embedded Flash Doesn't display

Posted on 2010-04-01
18
Medium Priority
?
990 Views
Last Modified: 2012-06-27
I am pretty new to website design and typo3 but have been working with it for a couple of weeks now.

I bought a pre-made template which has a flash banner at the top, and uploaded all the folders and files (js/images/html/css/swf) in the same directory order as they were given to me.

When I create a new site/template using templatevoila and preview the website template looks as expectedt. However when I finish the mapping process, and selecting the html headers to include (I include the scripts for the swf) the finished product doesn't include the flash banner.

Everything else displays as it should be, but the place where the flash banner should be is empty, no error message or anything.

Can anyone help me? Its probably a beginner mistake.
0
Comment
Question by:aaron_murray
  • 9
  • 9
18 Comments
 
LVL 37

Expert Comment

by:CyanBlue
ID: 29371573
Do you have a link where we can see it???

CyanBlue
0
 

Author Comment

by:aaron_murray
ID: 29372170
Here is a link to the site, nothing has really been changed from the template, but the banner should be just above the shadow effect.

http://takemorerake.de/index.php?id=460
0
 
LVL 37

Expert Comment

by:CyanBlue
ID: 29372421
That page is looking for your SWF file from here which does not exist...
   http://takemorerake.de/cu3er.swf

CyanBlue
0
Learn to develop an Android App

Want to increase your earning potential in 2018? Pad your resume with app building experience. Learn how with this hands-on course.

 

Author Comment

by:aaron_murray
ID: 29372859
The page is looking for a swf folder which it thinks is located in http://takemorerake.de/cu3er.swf ?

I have uploaded the swf to a folder inside the folder I keep the template, thinking that as long as I keep the same folder organization as the template folder I download all the files should be in the correct place?

How do I correct this in typo3 ? What should I edit or where should I put the swf file to get it working?
0
 

Author Comment

by:aaron_murray
ID: 29373310
This is the html in my template directory, should I change this to point somewhere else ?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>DreamTemplate</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/swfobject/swfobject.js"></script>
<script type="text/javascript">
		var flashvars = {};
		flashvars.xml = "config.xml";
		flashvars.font = "font.swf";
		var attributes = {};
		attributes.wmode = "transparent";
		attributes.id = "slider";
		swfobject.embedSWF("cu3er.swf", "cu3er-container", "960", "400", "9", "expressInstall.swf", flashvars, attributes);
</script>
</head>
<body>
<div class="main">
  <div class="blok_header">
    <div class="header">
      <div class="logo"> <a href="index.html"><img src="images/logo.gif" width="139" height="153" border="0" alt="logo" class="one" /></a> </div>
      <div class="menu">
        <ul>
          <li><a href="index.html" class="active"><span>Home</span></a></li>
          <li><a href="about.html"><span>About Us</span></a></li>
          <li><a href="portfolio.html"><span>Portfolio</span></a></li>
          <li><a href="contact.html"><span>Contact Us</span></a></li>
        </ul>
      </div>
          <div class="clr"></div>
         </div>
    <div class="clr"></div>
  </div>
  <div class="clr"></div>
  <div class="header_text_bg">
    <div class="cu3er_resize">
      <div id="cu3er-container"><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></div>
    </div>
    <div class="header_text">
      <div class="header_text_resize">
    <div class="search">
        <form id="form1" name="form1" method="post" action="">
          <label><span>
            <input name="q" type="text" class="keywords" id="textfield" maxlength="50" value="Search..." />
            </span>
            <input name="b" type="image" src="images/search.gif" class="button" />
          </label>
        </form>
      </div>
      <h2>Your company's welcome message or slogan. Lorem ipsum dolor sit amet, consectur el.<br />
        <span>Donec metus lacus, porta id, auctor sit amet, aliquam eu, lacus. Quisque sagittis vulputate orci.</span></h2>
      <div class="clr"></div>
    </div>
     </div>
    <div class="clr"></div>
  </div>
  <div class="body_resize">
    <div class="body">
    <div class="port_resize">
    <h2>Modern web &amp; interactive media.<br />
<span>Sed congue, dui vel tristique mollis...</span></h2>
    <img src="images/top_img_1.jpg" alt="picture" width="298" height="101" />
    <p>Duis porta quam et neque gravida vulputate dictum mi varius. Vestibulum fermentum iaculis felis, vitae scelerisque libero rutrum ac.</p>
    <p><a href="#">Read More »</a></p>
    </div>
      <div class="port_resize">
    <h2>Modern web &amp; interactive media.<br />
<span>Sed congue, dui vel tristique mollis...</span></h2>
    <img src="images/top_img_2.jpg" alt="picture" width="298" height="101" />
    <p>Duis porta quam et neque gravida vulputate dictum mi varius. Vestibulum fermentum iaculis felis, vitae scelerisque libero rutrum ac.</p>
    <p><a href="#">Read More »</a></p>
    </div>
      <div class="port_resize">
    <h2>Modern web &amp; interactive media.<br />
<span>Sed congue, dui vel tristique mollis...</span></h2>
    <img src="images/top_img_3.jpg" alt="picture" width="298" height="101" />
    <p>Duis porta quam et neque gravida vulputate dictum mi varius. Vestibulum fermentum iaculis felis, vitae scelerisque libero rutrum ac.</p>
    <p><a href="#">Read More »</a></p>
    </div>
      <div class="clr"></div>
    </div>
    <div class="clr"></div>
  </div>
  </div>
<div class="FBG">
  <div class="FBG_resize">
    <div class="left">
      <h2>about</h2>
      <p>Code is seo friendly, optimized for getting the top results in the search engines .</p>
      <ul>
        <li><a href="#">Overview »</a></li>
        <li><a href="#">Another Link »</a></li>
        <li><a href="#">Our Company »</a></li>
        <li><a href="#">Our Staff »</a></li>
        <li><a href="#">Mision Statement »</a></li>
      </ul>
    </div>
        <div class="left">
      <h2>philosophy</h2>
      <p>Neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat magna eros eu erat. </p>
      <p>Neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. </p>
      <p><a href="#">Check Our Works »</a></p>
    </div>
        <div class="left">
      <h2>blog</h2>
      <p>Neque id cursus faucibus, tortor <br />
        neque egestas augue, eu <br />
        vulputate magna eros eu erat. </p>
      <ul>
        <li><a href="#">Category 1 »</a></li>
        <li><a href="#">Category 2 »</a></li>
        <li><a href="#">Category 3 »</a></li>
        <li><a href="#">Category 4 »</a></li>
        <li><a href="#">Category 5 »</a></li>
      </ul>
    </div>
        <div class="left">
      <h2>support</h2>
      <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. </p>
      <p><span>support@yoursite.com »<br />
        +1 (123) 444-5677</span></p>
      <p><span>sales@yoursite.com »<br />
        +1 (123) 444-5678</span></p>
    </div>
    <div class="clr"></div>
  </div>
  <div class="clr"></div>
</div>
<div class="footer">
  <div class="footer_resize">
    <p class="leftt">© Copyright YourSiteName. All Rights Reserved<br />
    <a href="#">Home</a> | <a href="#">Contact</a> | <a href="#">RSS</a></p>
      <p class="right">(DT) <a href="http://www.dreamtemplate.com"><strong>Website Templates</strong></a></p>
    <div class="clr"></div>
  </div>
  <div class="clr"></div>
</div>
</body>
</html>

Open in new window

0
 
LVL 37

Expert Comment

by:CyanBlue
ID: 29373797
Replace all the occurrences of 'cu3er.swf' to 'path/to/cu3er.swf' and see if that works for you...

CyanBlue
0
 

Author Comment

by:aaron_murray
ID: 29374156
I will try that but it looks like its calling a script to install the swf to the page in the below code snippet, could that have anything to do with it too ?


swfobject.embedSWF("cu3er.swf", "cu3er-container", "960", "400", "9", "expressInstall.swf", flashvars, attributes);
</script>
</head>

Open in new window

0
 
LVL 37

Expert Comment

by:CyanBlue
ID: 29374303
That's the line that embeds the SWF into the page where cu3er.swf should be written with the proper path...

CyanBlue
0
 

Author Comment

by:aaron_murray
ID: 29376709
It didnt work :(

The above HTML file also references images from the /images folder successfully, so considering the cu3er.swf file is in the same directory as the index.html file shouldnt that reference to it be correct anyway?
0
 
LVL 37

Expert Comment

by:CyanBlue
ID: 29376951
I don't see the change in the HTML file...  Can you let me know once you've done that so that I can check???

CyanBlue
0
 

Author Comment

by:aaron_murray
ID: 29377423
I just started from scratch and now adobe flash player loads but not the actual banner!

http://takemorerake.de/index.php?id=482

but I think that maybe if I also reference the other .swf absolutely it might work ?
0
 
LVL 37

Expert Comment

by:CyanBlue
ID: 29378241
Change these to include the path as well...

   flashvars.xml = "config.xml";
   flashvars.font = "font.swf";

CyanBlue
0
 

Author Comment

by:aaron_murray
ID: 29379050
no luck! I thought it was going to work.

The only thing that is odd is that I could not find the file "font.swf", I wonder whether it is not needed as when I use the downloaded template and open it up in firefox it displays fine even though there is no such file.

http://takemorerake.de/index.php?id=526

At the moment it loads up adobe but no more.... :(
0
 
LVL 37

Expert Comment

by:CyanBlue
ID: 29379712
Ah...  Try adding params like this...

CyanBlue
var flashvars = {};
		flashvars.xml = "fileadmin/templates/unicall-cuber/config.xml";
		flashvars.font = "font.swf";
		var params = {};
		params.base = "fileadmin/templates/unicall-cuber/";
		var attributes = {};
		attributes.wmode = "transparent";
		attributes.id = "slider";
		swfobject.embedSWF("fileadmin/templates/unicall-cuber/cu3er.swf", "cu3er-container", "960", "400", "9", "fileadmin/templates/unicall-cuber/js/swfobject/expressInstall.swf", flashvars, params, attributes);

Open in new window

0
 
LVL 37

Accepted Solution

by:
CyanBlue earned 2000 total points
ID: 29381508
Set this back to the original...
     flashvars.xml = "config.xml";

CyanBlue
0
 

Author Comment

by:aaron_murray
ID: 29383485
your legendary! Thanks it worked.

Could you give me a rough explanation on what the problem was?

I would have thought that as long as I kept the same directory/file format int he same place as the working template and just uploaded it should work within typo3?

Just would like to understand it a little better.
0
 
LVL 37

Expert Comment

by:CyanBlue
ID: 29384379
Well...  I tried Typo3 a couple times and I never go near it...  Just kidding...  :p

The problem is that Flash automatically sets a virtual base directory to where the HTML file that's embedding the SWF is not the location where your SWF file exists...  So, originally you were trying to load a SWF from path/to/swf, but all other corresponding files were searched from the root where the HTML file is...
So, we basically set the BASE parameter to the location of the SWF file so that it will be looking for files from the given directory...  

Well, that's the gist of it...

CyanBlue
0

Featured Post

[Webinar] Improve your customer journey

A positive customer journey is important in attracting and retaining business. To improve this experience, you can use Google Maps APIs to increase checkout conversions, boost user engagement, and optimize order fulfillment. Learn how in this webinar presented by Dito.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article describes a solution to a problem of subloading one movie into another when they have different SWF versions. Sometime back, I was working on an ActionScript project while I came across an interesting fact which I would like to share…
While working over numerous projects I often had the requirement for doing a screen capture in AS3.0. Unfortunately I found no "ready made" solutions in google search that suited my requirements. But I did come across some great resources which help…
The goal of the tutorial is to teach the user how to set there setting in Adobe Flash Media Live Encoder and YouTube for optimal video and audio quality.
The goal of the tutorial is to teach the user how to select the video input device. Make sure you have an input device that in connected and work and recognized by Adobe Flash Media Live Encoder and select it in the “video input” menu.
Suggested Courses
Course of the Month9 days, 13 hours left to enroll

591 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question