Guest Posted August 8, 2005 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 Share this post Link to post Share on other sites
Guest Posted August 8, 2005 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.... Share this post Link to post Share on other sites
Guest Posted August 8, 2005 I'll give that a try, thanks.. I'll let you know if that works. Chris Share this post Link to post Share on other sites
Guest cyberjavier Posted August 14, 2005 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 Share this post Link to post Share on other sites
Guest Posted August 14, 2005 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 ) 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.... Share this post Link to post Share on other sites
Guest cyberjavier Posted August 14, 2005 Thanks i go to probe and sen the result Share this post Link to post Share on other sites
Guest Posted August 17, 2005 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 Share this post Link to post Share on other sites
Guest sachie Posted September 9, 2005 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 Share this post Link to post Share on other sites
Guest Oscgfx Posted September 9, 2005 Just try using that code but backup the file first under a different name - if it doesnt work just go back to the old version... Share this post Link to post Share on other sites
Guest Posted September 9, 2005 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} </font></strong></font></div></td> </tr> </table> </div> </div> <div> <div class="colLeft"> Share this post Link to post Share on other sites
Guest sachie Posted September 9, 2005 Excellent, thanks mate. Got it all sorted. Thanks buddy Share this post Link to post Share on other sites
Guest woodbtreasures Posted September 15, 2005 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 Share this post Link to post Share on other sites
Guest vrakas Posted September 24, 2005 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 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. Share this post Link to post Share on other sites
Guest arbycorzen Posted October 23, 2005 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 Share this post Link to post Share on other sites
Guest LNT Posted October 23, 2005 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. Share this post Link to post Share on other sites
convict 6 Posted October 28, 2005 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 : <input type="hidden" name="act" value="viewCat" /><input name="Submit" type="submit" class="searchBtn" value="{LANG_GO}" /> Share this post Link to post Share on other sites
Guest vrakas Posted October 28, 2005 Perfect solution and explanation. Added here Share this post Link to post Share on other sites
Guest Posted October 28, 2005 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. Share this post Link to post Share on other sites
Guest Posted March 14, 2006 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.. Share this post Link to post Share on other sites
Guest Stormz Posted April 23, 2006 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 :( Share this post Link to post Share on other sites
Guest Posted June 17, 2006 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!!!!!!!!!!!!!!! Share this post Link to post Share on other sites
Guest Posted July 20, 2006 Absolutely brilliant! Thanks all of you (especially convict) ! One thing though. Instead of the absolute url in the `index.tpl` eg : 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" Share this post Link to post Share on other sites
Guest phonon56 Posted August 9, 2006 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> Share this post Link to post Share on other sites
Guest Posted December 15, 2006 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 Share this post Link to post Share on other sites