Responsive Sheffield Blue v2.0

rbarbour:

Just to be sure I know what I am doing, are these the 3 files I need to upload:

CATALOG_FILES/includes/templates/responsive_default/jscript/jquery.matchHeight.js
CATALOG_FILES/includes/templates/responsive_default/jscript/jscript_matchHeight-min.js
CATALOG_FILES/includes/templates/responsive_default/jscript/jscript_responsive_framework.php

Thank you,

Silver

SilverHD:

rbarbour:

Just to be sure I know what I am doing, are these the 3 files I need to upload:

Thank you,

Silver

See post 855 and 857

rbarbour:

I see what you are saying but the codes are different.

This is the code that you say to create on post 855:

create:
Code:

 ```

/includes/templates/responsive_sheffield_blue/jscript/jscript_matchHeight.php

but the actual code is:
 

/includes/templates/responsive_sheffield_blue/jscript/jquery.matchHeight.js

So, either I have made a mistake, I don't understand, or something else is wrong??

Thanks,

Silver

SilverHD:

CATALOG_FILES/includes/templates/responsive_default/jscript/jquery.matchHeight.js

Forget about this one

SilverHD:

CATALOG_FILES/includes/templates/responsive_default/jscript/jscript_matchHeight-min.js

upload this one

SilverHD:

CATALOG_FILES/includes/templates/responsive_default/jscript/jscript_responsive_framework.php

Forget about this one

create one:

/includes/templates/responsive_sheffield_blue/jscript/jscript_matchHeight.php

paste this code in above:

<?php
/**
 * @package templateSystem
 * @copyright Copyright 2003-2016 Zen Cart Development Team
 * @license [url]http://www.zen-cart.com/license/2_0.txt[/url] GNU Public License V2.0
 * @version ZCA/GIT: $Id: rbarbour New for v1.5.5 $
 */
?>

<script type="text/javascript"><!--//
(function($) {
$(document).ready(function() {

$('.centerBoxContentsProducts').matchHeight();


  });
}) (jQuery);
//--></script>

matchHeight > rbarbour:

See post 855 and 857

zc 1.5.5a with Responsive Sheffiled Blue, IH4 and other mods.

Does matchHeight not play nice with IH4 and/or Colorbox or other mods with jscripts? With the changes as in post 855 and 857 I don't see anything different on my pages and my images open individually in a new window :(not a popup), with no close/previous/next facility.

Clicking on any product also generates the following errors in Firebug:

ReferenceError: jQuery is not defined
this.options)});b._afterUpdate&&b._afterUpdate(a,b._groups)};b._update=function(...

jscript...-min.js (line 11, col 1)
TypeError: $.browser is undefined

msie = $.browser.msie,

jQuery_...nner.js (line 25, col 2)
TypeError: $(...).matchHeight is not a function
$('.centerBoxContentsProducts').matchHeight();

The errors don't occur when site is initially opened but do occur when anything is clicked on, including refresh page.

I have replicated this on my live site but have taken the matchHeight files off while I sort this. I still have them on my test site to continue playing with.

If I switch to responsive classic template I get this error:> TypeError: $(...).colorbox is not a function

$("a[rel^='colorbox']").colorbox({opacity:0.6,speed:400,initialWidth:250,initial... and the product images appear in popups as I would expect.

Using max-height in my css has my product listing boxes evenly set so I am in no panic. I'm just curious and always looking to improve my understanding.

rbarbour:

Forget about this one

upload this one

Forget about this one

create one:

/includes/templates/responsive_sheffield_blue/jscript/jscript_matchHeight.php

> 
> paste this code in above:
> ```
<?php
/**
 * @package templateSystem
 * @copyright Copyright 2003-2016 Zen Cart Development Team
 * @license [url]http://www.zen-cart.com/license/2_0.txt[/url] GNU Public License V2.0
 * @version ZCA/GIT: $Id: rbarbour New for v1.5.5 $
 */
?>

<script type="text/javascript"><!--//
(function($) {
$(document).ready(function() {

$('.centerBoxContentsProducts').matchHeight();


  });
}) (jQuery);
//--></script>

Thank you for posting the instructions for this ;)

I have been working on the upgrades for the template packages. Thank you so much for your help with converting them to the new DIY package. I like the new one better because there are no core file overwrites. It will make future upgrades so much easier.

Thanks,

Anne

rbarbour:

I am not trying to be difficult here, but could you be a bit more clear. Which one should I upload and which one should I forget? Just a bit confused.

Thanks,

Silver

SilverHD:

rbarbour:

I am not trying to be difficult here, but could you be a bit more clear. Which one should I upload and which one should I forget? Just a bit confused.

Thanks,

Silver

Forget about this one
CATALOG_FILES/includes/templates/responsive_default/jscript/jquery.matchHeight.js

Forget about this one
CATALOG_FILES/includes/templates/responsive_default/jscript/jscript_responsive_framework.php

upload this one
CATALOG_FILES/includes/templates/responsive_default/jscript/jscript_matchHeight-min.js

create this one:

/includes/templates/responsive_sheffield_blue/jscript/jscript_matchHeight.php

and add this code to it:

<?php
/**
 * @package templateSystem
 * @copyright Copyright 2003-2016 Zen Cart Development Team
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version ZCA/GIT: $Id: rbarbour New for v1.5.5 $
 */
?>

<script type="text/javascript"><!--//
(function($) {
$(document).ready(function() {

$('.centerBoxContentsProducts').matchHeight();


  });
}) (jQuery);
//--></script>

picaflor-azul:

Thank you for posting the instructions for this ;)

I have been working on the upgrades for the template packages. Thank you so much for your help with converting them to the new DIY package. I like the new one better because there are no core file overwrites. It will make future upgrades so much easier.

Thanks,

Anne

Glad I could help! :smile:

soxophoneplayer:

matchHeight

zc 1.5.5a with Responsive Sheffiled Blue, IH4 and other mods.

Does matchHeight not play nice with IH4 and/or Colorbox or other mods with jscripts? With the changes as in post 855 and 857 I don't see anything different on my pages and my images open individually in a new window :(not a popup), with no close/previous/next facility.

Clicking on any product also generates the following errors in Firebug:

The errors don't occur when site is initially opened but do occur when anything is clicked on, including refresh page.

I have replicated this on my live site but have taken the matchHeight files off while I sort this. I still have them on my test site to continue playing with.

If I switch to responsive classic template I get this error: and the product images appear in popups as I would expect.

Using max-height in my css has my product listing boxes evenly set so I am in no panic. I'm just curious and always looking to improve my understanding.

Shouldn't be any conflict. The error indicated, states that is can't find matchHeight, make sure it is loading.

Take a look at post 928 to make sure /jscript/jscript_matchHeight-min.js is in place.

rbarbour:

Unfortunately, I don't know how to "create" code. If there is an easy way, please clue me in.

Thanks,

Silver

SilverHD:

rbarbour:

Unfortunately, I don't know how to "create" code. If there is an easy way, please clue me in.

Thanks,

Silver

Your not creating any code, create a file and name it "jscript_matchHeight.php"

add this code to that file:

<?php
/**
 * @package templateSystem
 * @copyright Copyright 2003-2016 Zen Cart Development Team
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version ZCA/GIT: $Id: rbarbour New for v1.5.5 $
 */
?>

<script type="text/javascript"><!--//
(function($) {
$(document).ready(function() {

$('.centerBoxContentsProducts').matchHeight();


  });
}) (jQuery);
//--></script>

upload that file to: /includes/templates/responsive_default/jscript/

rbarbour:

I think I did exactly as you had instructed and I still have uneven images. Take a look at categories -> cabinets. I don't think I did anything wrong, although it was the first time I did anything like that. I created a file in Notepad ++ and called it "jscript_matchHeight.php" without the quotes, per your instructions. Then, I added the rest of the code and added it to /includes/templates/responsive_default/jscript/

Again, the site is www.mygiftsite.com

Thanks,

Silver

SilverHD:

rbarbour:

I think I did exactly as you had instructed and I still have uneven images. Take a look at categories -> cabinets. I don't think I did anything wrong, although it was the first time I did anything like that. I created a file in Notepad ++ and called it "jscript_matchHeight.php" without the quotes, per your instructions. Then, I added the rest of the code and added it to /includes/templates/responsive_default/jscript/

Again, the site is www.mygiftsite.com

Thanks,

Silver

Ok, my mistake

/includes/templates/responsive_default/jscript/

should be

/includes/templates/responsive_sheffield_blue/jscript/

rbarbour:

I made the change and have the same results. Don't know what's going on. Take a look:

http://www.mygiftsite.com/index.php?main_page=index&cPath=24_25

Silver

SilverHD:

rbarbour:

I made the change and have the same results. Don't know what's going on. Take a look:

http://www.mygiftsite.com/index.php?main_page=index&cPath=24_25

Silver

I see the content of that file :cool:

I don't see a reference to
/includes/templates/responsive_sheffield_blue/jscript/jscript_matchHeight-min.js

I also see 2 references to jQuery CDN, not sure why.

rbarbour:

Refer to Post #928:

Code:

upload this one:
```
CATALOG_FILES/includes/templates/responsive_default/jscript/jscript_matchHeight-min.js

That's not the responsive_sheffield_blue.  Confused again??


Silver

SilverHD:

rbarbour:

Refer to Post #928:

Code:

upload this one:
```
CATALOG_FILES/includes/templates/responsive_default/jscript/jscript_matchHeight-min.js

> 
> That's not the responsive_sheffield_blue.  Confused again??
> 
> 
> Silver

file have to be uploaded to your template override folders, I copied and pasted responsive_default (my fault) but all files need to go in the  responsive_sheffield_blue folder.

rborbour:

I switched it over to the proper template: responsive_sheffield_blue, deleted the code:

jscript_matchHeight-min.js  
```  from responsive default and still have the same results:

<http://www.mygiftsite.com/index.php?main_page=index&cPath=24_25>

Been a long day....What's up??

Silver

SilverHD:

rborbour:

I switched it over to the proper template: responsive_sheffield_blue, deleted the code:

jscript_matchHeight-min.js

> 
> <http://www.mygiftsite.com/index.php?main_page=index&cPath=24_25>
> 
> Been a long day....What's up??
> 
> Silver

Very long day.

Ok, everything is loading correctly now.

Now that you have matchHeight up, you can delete this from your css

.centerBoxContentsProducts { min-height: 595px; }

with matchHeight you have options

this code makes all you listing boxes the same height

$('.centerBoxContentsProducts').matchHeight();

or you can add individual selectors

$('img.listingProductImage').matchHeight();
$('h3.itemTitle').matchHeight();
$('div.listingDescription').matchHeight();
$('div.pl-price').matchHeight();

now to apply matchHeight to center-boxes you'll need to add:

$('.centerBoxContentsNew').matchHeight();
$('.centerBoxContentsFeatured').matchHeight();
$('.centerBoxContentsSpecials').matchHeight();

Good luck, I'm calling it a day!