How to display Flash in Zen Cart banner locations

January 25, 2010 in Zen Cart Customization, Zen Cart Guides

Is this useful? Like it.

You can display Flash at any location of your Zen Cart website by editing the design files (PHP). But this post will teach you how to display Flash content in the standard built-in Zen Cart banner locations — by using Zen Cart’s Banner Manager.

First, you need to have a working Flash file (SWF) — which can be created by Adobe Flash or Swish Max. Just make sure the dimension (width) of your Flash movie fits your template design. For example, the banner image width of our Premium 7 template is 930 pixels — so, in this case, you should design your Flash movie to have 930 pixels width, while the height is up to you.

1. Upload the Flash SWF file to your server

In your Flash editor, you can export the Flash to SWF and HTML files. For example, in Swish Max, choose File > Export > HTML + SWF

Using FTP, upload the SWF file to your server at http://www.your_zen_site.com/images/yourflash.swf (or any other lcoation)

2. Get the embed code

Open the HTML file that you have generated in Step 1 with any text editor. Find the object embed code — the codes within the tags <object> …. </object>

Flash Object Embed Code

Flash Object Embed Code

Check that the width/height is correct. And most importantly, change the actual path of the SWF file to reflect where you have uploaded the file on your server. See screenshot example above. (Normally, there will be two places where you need to change the .SWF path in the code)

3. Activate the Flash banner

a. Go to Zen Cart admin, Admin > Configuration > Layout Settings > Banner Display Groups…… , enter the group name for the banner location, if you have not done so.
b. Go to Zen Cart admin, Admin > Tools > Banner Manager > click ‘new’ or ‘edit’
c. Enter the “Banner Title”
d. Enter the “Banner Group” — make sure you choose/enter the correct group name for the location that you want
e. Paste <object> code that you have prepared in Step 2
f. Save

See screenshot example (Banner Manager) :

Zen Cart Banner Manager

Zen Cart Banner Manager

Compatibility: Zen Cart 1.3.9 and 1.3.8 — Should work with any of the Zen Cart’s built in banner locations. Works with all premium templates available here.

Disclaimer: Some templates, depending on the designer, do not use built-in Zen Cart banner locations to display the banner at the header (and other locations). They may use hard-coded HTML/CSS to display the banner image or use background image as header image. You’ll need to edit the template file’s code instead

Bookmark and Share

Comments

10 Responses to “How to display Flash in Zen Cart banner locations”

  1. delia on February 4th, 2010 10:50 pm

    To work in all browsers there’s also a js file that is needed, correct?

    Dreamweaver CS4 uses swfobject_modified.js now. I’m trying to get this on a site right now. Once the client gets the banner uploaded I’ll let you know the results.

  2. Dwain on February 5th, 2010 9:25 pm

    it works.. you rock.. keep up the great work.

  3. Jackie on February 10th, 2010 7:10 pm

    Thanks so much, that was so helpful, much better than the Zen Cart website!

  4. admin on February 10th, 2010 7:31 pm

    delia,

    Nope, you only need the SWF flash file

  5. Samuel on February 23rd, 2010 8:05 am

    it has not worked for me. I will be happy if you can tell me which folder to put the swf file, i ‘ve put it in several yet it did not work. I have activated the banner under admin tools and under cofiguration ‘header position 1′ placed it above the site position and header2 just placed it somewhere else in the site. Is there anything that i have to do? i have read all tutorials and am having real headache. Please help.

  6. admin on February 23rd, 2010 10:42 am

    Samuel,

    You can upload the SWF with FTP in any folder. You just need to edit the object code to reflect the actual path of your SWF, see STEP 2 above.

  7. Samuel on February 23rd, 2010 10:02 pm

    Thanks for your quick response. The flash was eventually loaded but on top of the page. I want it to show where we have the default tagline showing. I chose top header one in the configuration layout. Iam sorry to border you, but please can you help further?
    Thanks and best regards
    Sam

  8. admin on February 23rd, 2010 10:25 pm

    Samuel,

    At Admin > Config. > Layout Settings, you can see a number of banner locations… each location may be different depending on the temaplate you use.

    You should maybe try the “Header Position 1 ~ 3″ and “Footer Position 1 ~ 3″ to see where actually the banners are displayed on the front end.

    Also, see “Disclaimer” within the article above… not all templates uses the built in banner location for the header image.

  9. Samuel on February 23rd, 2010 11:14 pm

    Thanks i will try that. i will get back to you how am doing. thanks a lot again

  10. Sharum4007 on March 5th, 2010 2:37 am

    That was quite excellent, thanks a bunch! I’ll have to check out some of the other posts too…

Leave a Reply




Premium Templates

Premium 1 Series ($22~25)

Premium 2 Series ($26)

Premium 3 Series ($29)

Premium 4 Series ($28)

Premium 5 Series ($30)

Premium 6 Series ($30)

Premium 7 Series ($35)

Premium 8 Series ($40)