browser compatability issues

ok, so im getting in-depth to make sure that everything is viewing properly in multiple browsers... and im having a few issues.

1. everything looks fine in firefox 3.0.8 FOR ME, and for some of you who have looked at my page, but i know at least 2 other people who are on 3.0.8 who cannot load the flash on the main page.

2. everything looks good (as far as i can tell, so far) in Opera. 9.6.4 (havent checked anything older)

3. in Chrome (1.0.154.53) and Safari (4 public beta), the site looks good, in terms of spacing, but the entire main body is shifted over under the header, by the width of the whole page.... html validator (in FF) shows this message:

"<table> lacks summary attribute " for this line:

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

so i dont know if that is what is shifting everything over to the right.

additionally, the flash carousel is not showing... however it is also not giving any error messages?

4. the biggest mess is of course, IE. I cant even get it to finish loading (it says 1 item remaining, which i assume is the flash)... and because it wont even stop loading i have had no luck with debugger...

Any suggestions would be welcome, as i start the "cleanup" phase here...

http://www.customk9design.com/catalogzen

THANKS!

Firefox users have to install Flash, also there are certain modules that help them to hide "ads", and that will also hide your flash content.

customk1:

html validator (in FF) shows this message:

"<table> lacks summary attribute "
Did it not also mention about a </div> which should not be there?

yellow: ok, i understand your point, but then wouldnt it still show the "download flash player" icon? for those in FF who are not seeing it, its not like they are seeing a white box, like in the other browsers not displaying... they are actually seeing code displayed....

rob: YES! it did show that too, and i cant locate it anywhere! i have looked in my tpl_header/footer and tpl_main(?), index.php and english.php... any idea where this floating div might be located? best i can tell, it is in some place that is "assembling" all the pieces so to speak, because i cant find it in the most obvious places... from the best i can tell at least (i am NOT expert in code, but do pretty well at matching up div to /div, ul to /ul, etc etc and finding spares)

any additional help would be greatly appreciated!

"site copyright display" is found in: templates/your_template/common/tpl_footer.php

Sometimes it helps to put a comment tag in various places so when viewing the parsed output you can see where you are.

I'm also seeing the code instead of the Flash in FF 3.0.8 (Mac OS X). And I do have the latest Flash installed, so there's something wrong with the code.

Checking your site in the W3's Validator gives 4 errors, starting with that extra /div, and the others are probably the same thing. A link on the W3 report leads to this URL about script problems which may cause this. Better have a look.

Rob

In FF 3.08 Windows I see the blank Flash area and the download image for Flash. Could be because I have Flash disabled. If I copy the Flash URL directly into my FF I do see the code which is actually an error. This could be because you have the Flash file(s) in your Admin section which makes no sense. The Admin area is not for public viewing and could explain the whole problem.

I can't see your Flash in my FF so I don't know for certain what exactly your objectives are but have you considered abandoning the Flash and installing a javascript slideshow? They're much more cross-browser friendly and very interactive and quite versatile. They offer the ability to display multiple slideshows on the same page, optional linking and link targeting, pause on mouse-over etc. For example I've used one on this site to show some studio photos. They are useful for products as well because you can link directly to a product page. They can, of course, also be used within the Zen PHP environment.

Here's a link to a good script at Dynamic Drive that is free for use.

If it applies to your sitaultion they can be quite useful - Good luck

i see error message using FF .. about loading swf and xml.
im all for a ecom site that is less clutter with all this stuff that moves and makes me dizzy .

I installed only one zencart for family member .. thats all i did and took me few minutes .. ( 2 years ago ) , always wanted to change the look of ( template ) , using classic zc , with only one major modification .. i changed the logo :blush:
i was told , customers are commenting on the site , that is clean , easy to navigate and is not cluttered .. no flash, no banners, and nothing that would distract visitors ..

my 2 cents ..

thanks to all of you for your replies!!!

rob: regarding the div, i have checked my footer, and as far as i can tell, all the divs match up? let me put it here so that i can have another set of eyes on it, im sure im just missing something obvious.

<?php
/**
 * Common Template - tpl_footer.php
 *
 * this file can be copied to /templates/your_template_dir/pagename<br />
 * example: to override the privacy page<br />
 * make a directory /templates/my_template/privacy<br />
 * copy /templates/templates_defaults/common/tpl_footer.php to /templates/my_template/privacy/tpl_footer.php<br />
 * to override the global settings and turn off the footer un-comment the following line:<br />
 * <br />
 * $flag_disable_footer = true;<br />
 *
 * @package templateSystem
 * @copyright Copyright 2003-2005 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version $Id: tpl_footer.php 4821 2006-10-23 10:54:15Z drbyte $
 */
require(DIR_WS_MODULES . zen_get_module_directory('footer.php'));
?>

<?php
if (!isset($flag_disable_footer) || !$flag_disable_footer) {
?>

<!--bof-navigation display -->
<div id="navSuppWrapper">
<div id="navSupp">
<ul>
<!-- <li><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">'; ?><?php echo HEADER_TITLE_CATALOG; ?></a></li> -->
<?php if (EZPAGES_STATUS_FOOTER == '1' or (EZPAGES_STATUS_FOOTER == '2' and (strstr(EXCLUDE_ADMIN_IP_FOR_MAINTENANCE, $_SERVER['REMOTE_ADDR'])))) { ?>
<li><?php require($template->get_template_dir('tpl_ezpages_bar_footer.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_ezpages_bar_footer.php'); ?></li>
<?php } ?>
</ul>
</div>
</div>

<ul id="bottomMenuStyle">
<li><a href="http://www.hsus.org" rel="popup standard 820 700 noicon"><img src="http://www.customk9design.com/catalogzen/includes/templates/darkness/images/humanesociety.gif" alt="Humane Society" width="290" height="55"/></a></li>
<li><a href="javascript:void(0);" onclick="window.open('http://www.justhost.com/ecertified?domain='+document.domain+'','JustHost','toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=570,height=680,left=300,top=200');"><img style="border:0px;" src="http://www.justhost.com/img/greenbadges/badge4.gif" alt="Green Web Hosting" /></a></li>
<li><a href="http://www.facebook.com/home.php?#/pages/Custom-K9-Design/72436717447?ref=mf" rel="popup standard 975 700 noicon"><img src="http://www.customk9design.com/catalogzen/includes/templates/darkness/images/facebook_48.gif" alt="Facebook" width="55" height="55" border="0"/></a></li>
<li><a href="http://www.mozilla.com/en-US/firefox/organic/?from=sfx&uid=0&t=353570" rel="popup standard 950 700 noicon"><img src="http://www.customk9design.com/catalogzen/includes/templates/darkness/images/organicfirefox.jpg" alt="Firefox" width="115" height="55" border="0"/></a></li>
<li><img src="http://www.customk9design.com/catalogzen/includes/templates/darkness/images/paymentoptions.png" alt="Payment Options" width="115" height="55"></img></li>
</ul>

<!--eof-navigation display -->


<!--bof-ip address display -->
<?php
if (SHOW_FOOTER_IP == '1') {
?>
<div id="siteinfoIP"><?php echo TEXT_YOUR_IP_ADDRESS . '  ' . $_SERVER['REMOTE_ADDR']; ?></div>
<?php
}
?>
<!--eof-ip address display -->

<!--bof-banner #5 display -->
<?php
  if (SHOW_BANNERS_GROUP_SET5 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET5)) {
    if ($banner->RecordCount() > 0) {
?>
<div id="bannerFive" class="banners"><?php echo zen_display_banner('static', $banner); ?></div>
<?php
    }
  }
?>
<!--eof-banner #5 display -->

<ul id="bottomMenuStyle2">
<li><a href='http://customk9design.com/catalogzen/index.php?main_page=page&id=2'>About Us   </a></li> 
<li><a href='http://customk9design.com/catalogzen/index.php?main_page=contact_us'>Contact Us   </a></li>
<li><a href='http://customk9design.com/catalogzen/index.php?main_page=page&id=7'>Legal Stuff   </a></li>
<li><a href='http://customk9design.com/catalogzen/index.php?main_page=page&id=8'>Shipping, Returns and Availability   </a></li>
<li><a href='http://customk9design.com/catalogzen/index.php?main_page=site_map'>Site Map</a></li>
</ul>


<!--bof- site copyright display -->
<div id="siteinfoLegal" class="legalCopyright"><?php echo FOOTER_TEXT_BODY; ?></div>
<!--eof- site copyright display -->

<?php
} // flag_disable_footer
?>

regarding admin: yes! i was also suprised by this, but that is the location the code generated, for me to put it. i am all for moving this, and will try it next, to see if it fixes the problem. do i need to move it only one folder over, to "includes" (same level as "admin") or can i put it into the same folder as the images and the xml file?

regarding dynamic drive: i like this a lot! my only question is, can i embed the images with links, so if you see something come up that you like, and you click on it, it will take you directly to that item...? thats one of the things i liked about the carousel flash.

regarding too busy: tony, i do agree with you, to some point... i may like it a little flashier than some, but it does need some streamlining. because it isnt live yet, i put some stuff up to see how it all looked, but will be tweaking it back a little over the next week. thanks for your input!

thanks to all of you, keep the thoughts coming!! (i will be out of town later today thru sunday, so if you dont get an immediate response, it isnt because im not interested! any suggestions are ALWAYS welcome!)

customk1:

regarding dynamic drive: i like this a lot! my only question is, can i embed the images with links, so if you see something come up that you like, and you click on it, it will take you directly to that item...? thats one of the things i liked about the carousel flash.

Yes, you can indeed embed links - That's one of the great attributes! A potential customer can pause an image by mouse-over and click the image to be taken directly to the product page.

For example: Take a look about half way down this page where you see the rotating images of our lovely Italian model wearing various pieces of jewelry. I have these links set to go directly to that products category page.

customk1:

rob: regarding the div, i have checked my footer, and as far as i can tell, all the divs match up? let me put it here so that i can have another set of eyes on it, im sure im just missing something obvious.

regarding admin: yes! i was also suprised by this, but that is the location the code generated, for me to put it. i am all for moving this, and will try it next, to see if it fixes the problem. do i need to move it only one folder over, to "includes" (same level as "admin") or can i put it into the same folder as the images and the xml file?
The error is not a result of Validation but due to the files being within the Admin area; which is not viewable to the pubic.

Put your files anywhere else than the Admin area / directories. I usually like to create a new dir. for files like this, which are sitewide and must be publicly available. Somewhere at the same level as 'images', 'includes', but any Public dir. will work.

Put your files anywhere else than the Admin area / directories. I usually like to create a new dir. for files like this, which are sitewide and must be publicly available. Somewhere at the same level as 'images', 'includes', but any Public dir. will work.

ok, so i created a new directory called carousel, and it is in my catalogzen folder, equal to the "images" and "includes" folder.

the only thing in that folder is the carousel.swf file. the images and the default.xml file still remains in the "catalogzen/images/carouselimages" folder...

i did change the script on my main page thru the define pages editor to call the new folder (instead of admin)

<div>
			<object width="585" height="575" id="Carousel" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
				<param value="Carousel.swf" name="movie" />
				<!--[if !IE]>-->
				<object width="585" height="475" data="http://customk9design.com/catalogzen/carousel/Carousel.swf" type="application/x-shockwave-flash">
<param value="xmlfile=images/CarouselImages/default.xml" name="flashvars" />
				<!--<![endif]-->
					<a href="http://www.adobe.com/go/getflashplayer">
						<img alt="Get Adobe Flash player" src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" />
					</a>
				<!--[if !IE]>-->
				</object>
				<!--<![endif]-->
			</object>
		</div>

so, what now?
i am fine with trying the other type of slideshow... just kinda want to get this to work, now more for the principle of the matter! lol

ALL of this still shows WAYYYY right on most browsers too... so, no matter what i do, i need to get this shifted back.
i assume this may be from that extra div, but still cant find it...

thanks!

The extra closing div is probably this one in includes/templates/YOUR_TEMPLATE/common/tpl_main_page.php

</div>
<!--bof- parse time display -->
<?php
  if (DISPLAY_PAGE_PARSE_TIME == 'true') {
?>
<div class="smallText center">Parse Time: <?php echo $parse_time; ?> - Number of Queries: <?php echo $db->queryCount(); ?> - Query Time: <?php echo $db->queryTime(); ?></div>
<?php
  }
?>
<!--eof- parse time display -->

Now the closing div is part of a stock install but you probably close the div earlier in the code so that one got left hanging, or you closed the div early by mistake.......

barco,
thanks! that was the allusive div. now, im trying to figure out how to use all these tools at my disposal... how did you know that that div was on the main page, did you have something to show you the root or location?

also, that still has not fixed the shifting over issue in chrome and safari... the only thing else that is "wrong" according to htmlvalidator ff addon is:

line 116 column 1 - Warning: <table> lacks "summary" attribute
line 215 column 1 - Warning: trimming empty <li>

the table is here:

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

but im not sure how it should read, because it is original coding, if i remember correctly.

as for the <li>, not sure where that is either...

i think i have narrowed down the issue to that table coding..??? it only looks wrong in google chrome and safari... both which are webkit based browsers?? maybe something in common there... i think if i can get the fix, it will fix both, as i am correctly displaying in FF, IE and Opera now... (as far as i can tell).

any input would be great, and if you need any copies of css or code, just let me know, i will paste! thanks..

so, i have resolved the table and <li> issue, the page passes html inspection with no problems...

but still have a huge shift to the right, ONLY on safari and chrome.

any suggestions please?

https://www.customk9design.com/catalogzen

thanks!

Two suggestions;

1. have you defined a width to your "topbar"
2. and a <br class="clearBoth" /> inbetween...

<br class="clearBoth" />

ROB, YOU ROCK MY SOCKS OFF! (thats a good thing..)

thanks so much! it needed the:
<br class="clearBoth" />

now just one question, the area that was an issue was at the VERY bottom of the tpl_header.php... and i didnt know if i should put it after the last div there, and before the php closing, or in the tpl_mainpage.php before the <table id="contentMainWrapper"

i did the 2nd one, put it in the mainpage, not the header... is this ok?

Placement is only a matter of preference. Long as it works is what counts. :smile: