Foundation Theme for ZenCart

[ultimate_zc]

Foundation for ZenCart
Zen Cart® Version: 1.5.5e
Original Author: ultimate_zc
Author' Website: www.gijoecodes.com

The most advanced responsive front-end framework in the world is now available for ZenCart. The Foundation theme for ZenCart (FZCF7211) is provided to the community free of charge. It leverages the powerful Foundation framework to make your site better and faster.

Click here for demos.
Click here for visual demonstrations of the components listed below and/or to add your review.
Post questions on this thread.
Thanks

Theme Features:

• Fully responsive
• Orbit Banner on Main Page
• Orbit for product pages images
• Dropdown menu on large screens
• Off-Canvas Drilldown Menu on medium and small screens
• Customizable buttons (You can set the colors, styles and sizes from within the admin.)
• Abide Form Validation

In addition:

• List/Grid buttons on All Products , Featured Products, New Products and Specials listing pages.
• mThumb to quickly create resized versions of your product images.
• HTML5 Audio player for media collection.

[swguy]

In the plugins section at https://www.zen-cart.com/downloads.php?do=file&id=2175

[carlwhat]

looks pretty great... will have to download it and play around....

new/modern themes for ZC are always welcome....

[dbltoe]

Looks good. Haven't played too much but glad to see 508 being addressed.

The console is giving me uncaught TypeErrors with each page. Looks like one of the jquery or js calls is out of sequence. Sorry, not much time to investigate.

(anonymous) @ index.php?main_page=index:345foundation.abide.js:103
Uncaught TypeError: Cannot read property 'Plugin' of undefined
    at Object.2 (foundation.abide.js:103)
    at __webpack_require__ (foundation.abide.js:20)
    at Object.43 (foundation.abide.js:114)
    at __webpack_require__ (foundation.abide.js:20)
    at Object.13 (foundation.abide.js:92)
    at __webpack_require__ (foundation.abide.js:20)
    at Object.79 (foundation.abide.js:776)
    at __webpack_require__ (foundation.abide.js:20)
    at 0.module.exports (foundation.abide.js:66)
    at foundation.abide.js:69
2 @ foundation.abide.js:103
__webpack_require__ @ foundation.abide.js:20
43 @ foundation.abide.js:114
__webpack_require__ @ foundation.abide.js:20
13 @ foundation.abide.js:92
__webpack_require__ @ foundation.abide.js:20
79 @ foundation.abide.js:776
__webpack_require__ @ foundation.abide.js:20
0.module.exports @ foundation.abide.js:66
(anonymous) @ foundation.abide.js:69
mycontentscript.js:13 KGen:Page => Ready !

Also, is it possible to drop the line-height:0 call for .thumbnail in the foundation.min.css file? I don't see any problem deleting it but, it's presence causes alt information to be on a single line. This means that long alt tags will overwrite themselves. Don't know the effect on SEs reading or readers for those with vision difficulties but, it does not seem to bother anything else that I can find and removing line-height:0 makes all alt tags legible in the browser.

[ultimate_zc]

I don't see any problems with dropping that line from the css. Really good observation. I'm not going to drop it however but will let users know in the README file when I publish an update. As for the abide.js issues, those will take a little bit more work. As for now I will specify to load that file when needed as in create account, sign in forms etc... I failed to do so prior to submission. I apologize for that and Thank you for your observations. Good Help!

[ultimate_zc]

Thanks again dbltoe,

I decided to remove that line from the css. I also fixed the abide.js issue. I will be uploading an updated version soon after I get a little more feedback. I'm currently working on updating constructors to Php 7.

[Design75]

Instead of removing the line from the original file. IMHO it is better practice to add a new file, like custom.css, and make an override in there. This way the edit will not be lost in an foundation update.

[ultimate_zc]

I thought about that at first but to to be fair, overriding that class in a different stylesheet will require giving it a height and websites differ so much. In the other hand, by the time a new Foundation update comes along it will more than likely change so much that a complete new template would have to be created starting from scratch.

[carlwhat]

how did you fix the abide.js issue?

thanks.

[carlwhat]

Looks good. Haven't played too much but glad to see 508 being addressed.

The console is giving me uncaught TypeErrors with each page. Looks like one of the jquery or js calls is out of sequence. Sorry, not much time to investigate.

@dbltoe - yes!

proper order is:

<script src="includes/templates/FZCF7211/jscript/foundation.min.js"></script>
<script src="includes/templates/FZCF7211/jscript/foundation.core.js"></script>
<script src="includes/templates/FZCF7211/jscript/foundation.abide.js"></script>
<script src="includes/templates/FZCF7211/jscript/foundation.what-input.js"></script>

my loader uses alphabetical sequence.... which i have always was not ideal... not sure if that is part of core, or the loader plugin that i have working.

best.