Jump to content

Flash


Guest

Recommended Posts

Hi,

I'm feeling a little lost, I've found where the background image is for the header, But I would like to put up a flash header, I can't seem to find a header template anywhere. Does anyone know what file to edit for this ?

Thanks,

Chris

Link to comment
Share on other sites

I believe it is here:

#topHeader {

	text-align: right;

	height: 111px;

	margin-bottom: 20px;

	padding-right: 0px;

	padding-top: 0px;	

}
 In J:\skins\Classic\styleSheets (where 'classic' can be any one of your installed skins) Simply add a background line in there and let in call for flash i.e. 
	background-image:url(../images/YOURFLASH.swf);

	background-repeat:no-repeat;

I believe that should work....

Link to comment
Share on other sites

Guest cyberjavier

Hi i am new in the cube cart forum

I write the code posted and don't work

the header has been blank

if you can help me.

many thanks

Link to comment
Share on other sites

Ok that didn't work and I know why..... I don't think it is possible (correct me if I am wrong please, I am willing to learn :lol: ) to add a flash component into CSS.

So....here is a possible way on how to get it working without too much coding:

Open index.tpl in \skins\Classic\styleTemplates\global and find around line s 17 thru 20

	<div id="topHeader">

  <div>{SEARCH_FORM}</div>

  <div>{SESSION}</div>

	</div>
Directly under
	<div id="topHeader">

you need to place your flash tag and it looks similar to:

  <div align="left"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="XXX" height="XXX">

        <param name="movie" value="DIR1/DIR2/DIR3/YOUR_MOVIE.swf" />

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

        <embed src="DIR1/DIR2/DIR3/YOUR_MOVIE.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="XXX" height="XXX"></embed>

      </object></div>

Change all the RED values to your pref.

<div align="left"> where left will place your flash in the left of your header.

Change your path to your movie and the width and height.....

If you have an editor like dreamweaver you can create the <div> tag and after that click on --> Insert --> Media --> Flash and from there you can locate your flash and all coding will be automatically created....

Now in \skins\Classic\styleSheets open layout.css and match the height in the #topHeader tag with your flash height......

If anybody knows on how to put this all in CSS please let me know....

Link to comment
Share on other sites

Hi Mobie,

Ok I got the flash working, I had to remove the search and login to make it fit

in right. I'm still running it through it tests. Once I got everything stable I'll post all the code. Now I have to figure out where to put the search and login stuff, but hey "Thank You" very much for your help.!!

Chris

Link to comment
Share on other sites

  • 4 weeks later...

Hi scubadu,

Have you got the code running stable yet? I'm dying to put a flash header in my site. Its using 3.0.2 and the killer skin.

Thanks in advance

Sachie

Link to comment
Share on other sites

Hi scubadu,

Have you got the code running stable yet? I'm dying to put a flash header in my site. Its using 3.0.2 and the killer skin.

Thanks in advance

Sachie

Hi Sachie,

I did get it to work, but there was nothing easy about it. You have to edit the

index.tpl to do it, I used dreamweaver and just loaded the file and played

with it till I got it to work. Make sure you place your file.swf in the root of the

shopping cart to work, not in the template directory.

/skins/Legend/styleTemplates/global/index.tpl

Should be the same for Killer template.

The one problem I ran into was the search box, so I removed it and put it

on the left hand colum.

You can view the example at: http://www.gaslogset.com

Hope this helps. I could have been alot more creative with the flash,

but I got put on other projects.

Example Code:

<body>

<div id="pageSurround">

<div id="subSurround">

<div id="topHeader">

<div align="left">

<table width="748" border="0" cellspacing="0" cellpadding="0">

<tr>

<td><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="748" height="100">

<param name="movie" value="http://gaslogset.com/header.swf" />

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

<embed src="http://gaslogset.com/header.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="748" height="100"></embed></object></td>

</tr>

<tr>

<td bgcolor="#333333">

<div align="right"><font color="#00FF00" size="2" face="Arial, Helvetica, sans-serif"><strong><font size="3">{SESSION}&nbsp;&nbsp;</font></strong></font></div></td>

</tr>

</table>

</div>

</div>

<div>

<div class="colLeft">

Link to comment
Share on other sites

Guest woodbtreasures

You should take a look at your site in Firefox...while I like the look of the flash header the site is REALLY distorted and squished and not displaying correctly

Link to comment
Share on other sites

  • 2 weeks later...

The post by Mobie posted on Aug 15 2005, 12:15 AM works ok.

You need to move the search and Login to the left and/or right.

Tested with IE and FF :D

Now to test scubadu's mod ;)

Updated:

I also tested scubadu's mod but i had to many problems with FF and when i moved both buttons to the top in IE it was ok but in FF it was under the other columns and all text was distorted. :)

Solution: use Mobie's mod and the part of the buttons on the top with the height propotions from scubadu's mod and then adjust the height in the top header to fit them.

;)

PS:I forgot to mention that is was tested with Legend skin and modified to be full screen in any resolution.

Link to comment
Share on other sites

  • 4 weeks later...
Guest arbycorzen

I have the Killer_Silver and basicly i have a small flash logo to that i would like to insert into the website. I would like it to replace the defult logo.

This is my index.TPL

<!-- BEGIN: body -->

<!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>

<meta http-equiv="Content-Type" content="text/html; charset={VAL_ISO}" />

<title>{META_TITLE}</title>

<meta name="description" content="{META_DESC}" />

<meta name="keywords" content="{META_KEYWORDS}" />



<link href="skins/{VAL_SKIN}/styleSheets/layout.css" rel="stylesheet" type="text/css" />

<link href="skins/{VAL_SKIN}/styleSheets/style.css" rel="stylesheet" type="text/css" />

<script language="javascript" src="js/jslibrary.js" type="text/javascript"></script>

</head>



<body>

<div id="pageSurround">



	

  <div id="topHeader">

  	<div id="sessionBox">

    <div style="padding: 15px 8px 15px 15px; margin: 0px;">

    {SEARCH_FORM}

    {SESSION}

    </div>

  	</div>

  </div>

  

  

  <div id="subSurround">

  

  {CATEGORIES}

  <table border="0" cellspacing="0" width="100%" cellpadding="0">

    <tr valign="top">

  	<td width="175">

       {SHOPPING_CART}  

    {INFORMATION}	

    {CURRENCY}

    {LANGUAGE}</td>

  	<td style="padding: 0px 5px 0px 5px;">{PAGE_CONTENT}</td>

  	<td width="175">

    	{RANDOM_PROD}

    	{POPULAR_PRODUCTS}

    	{SALE_ITEMS}

    	{MAIL_LIST}

  	</td>

    </tr>

  </table>



	

	

	</div>

	{SITE_DOCS}

	

	

</div>

<br><center>

<!-- Begin BidVertiser code -->

<script LANGUAGE="JavaScript1.1" SRC="http://bdv.bidvertiser.com/BidVertiser.dbm?pid=10236&bid=21700"></SCRIPT>

<noscript><a href="http://www.bidvertiser.com">pay per click advertising</a></noscript>

<!-- End BidVertiser code --> 

</center>



</body>

</html>

<!-- END: body -->

I tried to do what you guys were saying but everything just gets messed up when i use the codes.

Thanks for all the help

Link to comment
Share on other sites

I agree with woodtreasures,

I only use firefox, and upon looking I nearly got a shock. It seems as though firefox is ignoring some of the css (thats if you used css to increase the top margin).

Regards,

Tom.

Link to comment
Share on other sites

Hi, here is the flash header implementation, works correct in FF and IE (tested on 6).

LEGEND skin

replace

  <div id="topHeader">

 	 <div style="padding-top: 72px;">{SEARCH_FORM}</div>

 	 <div>{SESSION}</div>

  </div>


with 
  <div id="topHeader">     <div>   <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="746" height="100">         <param name="movie" value="http://gaslogset.com/header.swf" />         <param name="quality" value="high" />         <embed src="http://gaslogset.com/header.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="746" height="100"></embed></object>     </div>     <div style="position:relative; float:left; padding-left:5px">{SEARCH_FORM}</div>     <div style="position:relative; float:right; padding-right:5px">{SESSION}</div>   </div>
red value of width have to be #pageSurround width - 2px red value of height is your choice layout.css #topHeader remove> padding-right, background-image add> background-color (could be dark collor) modify> height - hieght of your flash logo + 21px style.css .searchBtn replace height: 20px with _height: 16px - dont forget that "_" must be here! (non-standard style property but not for IE ;) ) .searchBox add> height: 14px; form, ol, ul add> , .searchBox, .searchBtn (could be - form, ol, ul, .searchBox, .searchBtn { ) searchForm.tpl Just delete line break between hidden input and button, because of IE. (WHITE SPACE issue)

Final result using scubadus flash logo :unsure: :

legend.jpg

<input type="hidden" name="act" value="viewCat" /><input name="Submit" type="submit" class="searchBtn" value="{LANG_GO}" />
Link to comment
Share on other sites

Thanks for posting that "Convict".

I havn't had a chance to play with the code, and post.. By the time I get back to that site, I'll need to read your post to figure it out again.

Link to comment
Share on other sites

  • 4 months later...

Convict great show. Juss a few things that will make things easier for people to understand first try..

1) The file you edit for #topheader code is called, index.tpl, and it is located in the \style templates\global directory..

2) layout.css

#topHeader

remove> padding-right & background-image

That is all and thanks again..

Link to comment
Share on other sites

  • 1 month later...
Guest Stormz

Absolutely brilliant! Thanks all of you (especially convict) !

I only downloaded and installed CubeCart today, and have already got a nice flash header.... courtesy of using this flash_jpg_rotator from http://www.jeroenwijering.com/?item=Flash_JPG_Rotator (thoroughly recommended).

Cheers!

One thing though. Instead of the absolute url in the `index.tpl` eg :

src="http://www.yoursite.com/store/jpgrotator.swf"




couldn`t you use the relative url of 




"../../../../../jpgrotator.swf"

to make loading quicker? (the ../ means to go up a directory from where you are. To get to the root directory of the store from where `index.tpl` is in the `store/skins/legend/styletemplates/global/ folder`, it needs to point 5 folders up to find the .swf) .

Hmm, maybe not. I`ve broken it :) back to the full url then.....

Now to re-skin the rest of it :(

Link to comment
Share on other sites

  • 1 month later...

THank you all for the very informative post. I used this procedure to change my header completely to matchc my site. Although I used all HTML and no flash, it still works using the same methods.... THANKS!!!!!!!!!!!!!!!

Link to comment
Share on other sites

  • 1 month later...

Absolutely brilliant! Thanks all of you (especially convict) !

One thing though. Instead of the absolute url in the `index.tpl` eg :

:D back to the full url then..... Now to re-skin the rest of it :(

src="http://www.yoursite.com/store/jpgrotator.swf"




couldn`t you use the relative url of 




"../../../../../jpgrotator.swf"




<snip>

Hmm, maybe not. I`ve broken it 
Actually, from a programmaing standpoint, flexible code, and relative paths, the "../..." method looks nice, but it would be better to use a site-relative path, and not a folder relative path as far as system calls and cpu cycles. The full URL is likley going to re-parse and re-request the DNS info to the server, while the ".." method may work from one nested folder, but maybe not if the nested folder is linked to from somewhere else. Use

as a site relative path, that will work no matter where in the hierarchy the address is parsed from, and we know it will be on the same site (usually). Only specify a URL with the hostname if you know it will be going to another server, or another processor on the same server DNS address (clusers of servers with the same hostname).

-Carl

 src="/store/jpgrotator.swf"
Link to comment
Share on other sites

  • 3 weeks later...
Guest phonon56

why doesn't this work??????

-----------------------------------------------------------

<script language="javascript" src="js/swfobject.js" type="text/javascript"></script>

</head>

<body>

<div id="pageSurround">

<div id="subSurround">

<div id="topHeader">

<div style="padding-top: 0px;">

<script type="text/javascript">

var so = new SWFObject("http://www.simpleinsight.com/flashpiece.swf", "flashpiece", "758", "132", "8", "#000000");

so.write("flashcontent");

</script><br>

</div>

</div>

Link to comment
Share on other sites

  • 4 months later...

I can get this to work with showing the flash movie, but it is slighty aligned to the right no matter what I do to the index.tpl or layout.css

Is there a way to correct this?

Thanks

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...