Responsive Sheffield Blue v1.0

Quote:

---

Originally Posted by rbarbour

This is a bug in the responsive code, it will be upgraded in the newest version. Anne I will forward this fix to you.

---

Thank you so much!

Thanks,

Anne

Quote:

---

Originally Posted by ozzyizzy

Hi. I have recently implemented the Responsive Sheffield Blue Template for my site www.knicknacs.com.au.(work in progress) I think the Template is great ( Thank you Picaflor Azul) is great, but I have found a couple of problems. The first one is the product info. It displays fine after selecting the item from a category,(example (http://knicknacs.com.au/murano-jewel...-perfume-vials) but after clicking the item to expand the description the product info is not there(example http://knicknacs.com.au/murano-jewel...ial-red-flower) . My site also includes general document items, and they display the info just fine. (example http://knicknacs.com.au/mobile-phone...u-dual-sim-red) . My second problem is that I currently open my index page with categories as when I set it to open without them, I only get a bar with New, Specials and Featured. How do I configure it that I don't have to "click" on the "New" Tab for it to display the "new items opened? ie I want some of the photos to show on the index page. I use zen version 1.51. Thanks in advance.

---

If you read this support thread you will see that the first problem has been addresses and I posted a patch.

See this for changing which tab shows by default:

http://www.zen-cart.com/showthread.p...72#post1134272

Thanks,

Anne

Hi Anne

@BiDi Issues, @Info, @right-to-left direction.
File: includes/templates/responsive_sheffield_blue/common/html_header.php
Loading template css files per-language, loading responsive css file per-language then direction switching (for all responsive templates except Sheffield Blue) be done through css files without any code change.
For Responsive Sheffield Blue, template boxes header are directional, still needs slight coding to use left box template in place of right and right in place of left, in right-to-left direction.

Best Regards
Hany

Thank you Anne.

I sorted the product info problem by changing the responsive css file as mentioned in an earlier post in this thread, and sorted my index page by following the suggestion in this post

http://www.zen-cart.com/showthread.p...72#post1134272

Thank you for all your hard work

Quote:

---

Originally Posted by ozzyizzy

Thank you Anne.

I sorted the product info problem by changing the responsive css file as mentioned in an earlier post in this thread, and sorted my index page by following the suggestion in this post

http://www.zen-cart.com/showthread.p...72#post1134272

Thank you for all your hard work

---

I am happy that you figured it all out :)

Thanks,

Anne

Quote:

---

Originally Posted by Hany

BTW; setting css for #navMainWrapper {margin:-110px 20px; width:60%;} solves it, may this help you.

---

Thanks for this. Solved issue for me (Firefox 24)

This may have been discussed already. When the screen is reduced/mobile sized the top item in the dropdown menu displays whenever an item is in the cart.

But then the customer has to select the menu to be made aware an item is in the cart. Is there a recommended method to indicate near the top of the page on mobile sized screen (either above or below icon toolbar), whenever an item is in the cart? And/or make the shopping cart icon dynamic (e.g. glow yellow/orange) whenever an item is in the cart.

The "Add to cart" unit form field (box) increases in horizontal size (to 85%) when screen resized to small.

What is best method to make the add to cart form box remain the same standard size, when screen viewed large or small?

Maybe assign a specific class to input select for the add to cart and then set width to 10% in responsive.css?

When "Use split-login page" is enabled, at small screen size the two "panels" for new customers and returning customers remain side-by-side at intermediate screen size. However, when screen size reduced to narrow smartphone width, rather than one panel moving underneath the other, the returning customer panels moves down but moves diagonally (stays to the right), not directly beneath the new customer panel.

Firefox 25.0

Quote:

---

Originally Posted by Woodymon

The "Add to cart" unit form field (box) increases in horizontal size (to 85%) when screen resized to small.

What is best method to make the add to cart form box remain the same standard size, when screen viewed large or small?

Maybe assign a specific class to input select for the add to cart and then set width to 10% in responsive.css?

---

Assign a width in css:

Code:

---

#cartAdd input[type="text"] {clear:left; float:none; width:4em; margin:0.25em auto;}

---

May also need to do something like this:

Code:

---

#cartAdd input[type="image"] {clear:left; float:none; margin:0.25em auto;}

---

hope this helps

Quote:

---

Originally Posted by Woodymon

This may have been discussed already. When the screen is reduced/mobile sized the top item in the dropdown menu displays whenever an item is in the cart.

But then the customer has to select the menu to be made aware an item is in the cart. Is there a recommended method to indicate near the top of the page on mobile sized screen (either above or below icon toolbar), whenever an item is in the cart? And/or make the shopping cart icon dynamic (e.g. glow yellow/orange) whenever an item is in the cart.

---

If you want the cart contents to be visible at all screen resolutions you can edit the tpl_header.php file to add your code and then use the media queries in the responsive.css file to show the code on the mobile sized screens.

Thanks,

Anne

Quote:

---

Originally Posted by Woodymon

The "Add to cart" unit form field (box) increases in horizontal size (to 85%) when screen resized to small.

What is best method to make the add to cart form box remain the same standard size, when screen viewed large or small?

Maybe assign a specific class to input select for the add to cart and then set width to 10% in responsive.css?

---

You can make any css adjustments in the responsive.css file.

Thanks,

Anne

Quote:

---

Originally Posted by Woodymon

When "Use split-login page" is enabled, at small screen size the two "panels" for new customers and returning customers remain side-by-side at intermediate screen size. However, when screen size reduced to narrow smartphone width, rather than one panel moving underneath the other, the returning customer panels moves down but moves diagonally (stays to the right), not directly beneath the new customer panel.

Firefox 25.0

---

If you want to use split screen and you want to make adjustments you can add them to the responsive.css file.

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

If you want the cart contents to be visible at all screen resolutions you can edit the tpl_header.php file to add your code and then use the media queries in the responsive.css file to show the code on the mobile sized screens.

---

I'm not clear on this. The cart contents (along with login/log off, home and checkout links) are displayed in the header when browser window is at most larger sizes. When browser window size s reduced to smartphone size none of these header items are displayed.

So any hints on how to keep the cart contents displaying in the header (at all sizes) but hide ALL the other header links at smartphone screen size?

I can likely work up some logic code to deal with this but just need a nudge in the right direction. Thanks.

Is there a best method to configure it so product descriptions are fully displayed (not collapsed) when visiting a product page?

I can understand the desire for the descriptions to be collapsed by default on mobile screens but prefer descriptions to be displayed (not collapsed) on larger screens. If cannot set different defaults (collapsed vs not collapsed) for different screen sizes, then prefer to set not collapsed for all devices.

I've set the shop up so the index page displays only Featured Products, not New or Specials. As suggested earlier in this thread added .box_image{min-height:100px;} to the stylesheet. So now the top of each row of boxes line up. However the bottom of the boxes do not. All the images are the same height (150px) because some products have product names longer than one line. Some are two lines and others are three lines.

Is there a method so the product boxes (on the grid) are the same size (vertically & horizontally) and the vertical height of the grid is based on the box size of the product with the longest product name (number of lines in product name)? To keep the content of the boxes lined up on the grid, the internal spacing (padding) between the top line of the box and the first line of the product name would need to be adjusted dynamically (again based on the longest product name)..

If not possible what is the best method to vertically center the contents of each box, while keeping all the boxes the same size?

I've done this using tables on a previous version of Zen Cart. I'm sure the CSS solution is simple but it escapes me at the moment.

Quote:

---

Originally Posted by Woodymon

I've done this using tables on a previous version of Zen Cart. I'm sure the CSS solution is simple but it escapes me at the moment.

---

That's the difference, the responsive templates don't use tables as tables are finite and can't work using percentages (unless I'm wrong?)...

Quote:

---

Originally Posted by Woodymon

Is there a best method to configure it so product descriptions are fully displayed (not collapsed) when visiting a product page?

I can understand the desire for the descriptions to be collapsed by default on mobile screens but prefer descriptions to be displayed (not collapsed) on larger screens. If cannot set different defaults (collapsed vs not collapsed) for different screen sizes, then prefer to set not collapsed for all devices.

---

This bug has already been addressed earlier in this thread and a patch has been posted.

Thanks,

Anne

Quote:

---

Originally Posted by Woodymon

I've set the shop up so the index page displays only Featured Products, not New or Specials. As suggested earlier in this thread added .box_image{min-height:100px;} to the stylesheet. So now the top of each row of boxes line up. However the bottom of the boxes do not. All the images are the same height (150px) because some products have product names longer than one line. Some are two lines and others are three lines.

Is there a method so the product boxes (on the grid) are the same size (vertically & horizontally) and the vertical height of the grid is based on the box size of the product with the longest product name (number of lines in product name)? To keep the content of the boxes lined up on the grid, the internal spacing (padding) between the top line of the box and the first line of the product name would need to be adjusted dynamically (again based on the longest product name)..

If not possible what is the best method to vertically center the contents of each box, while keeping all the boxes the same size?

I've done this using tables on a previous version of Zen Cart. I'm sure the CSS solution is simple but it escapes me at the moment.

---

You need to add a min-height or height to the the div that contains the product image, name, price, etc.

Thanks,

Anne

I do not think message 165 was ever addressed and I am having the same issue. Once the screen size reaches hand held device size there is a problem with the products list. When the screen is full size the product title has what appears to be a line break so that the product description will start on a new line. Whenever I decrease the size of the screen to handheld size the product description starts right after the product title without a line break. As long as the product title is at least one full line the break after the product title works fine on the handheld device. I get the same results when using Chrome and Firefox on a Linux desktop and Chrome or Opera on an android smart phone or 7 inch tablet.

Quote:

---

Originally Posted by jnissley

I do not think message 165 was ever addressed and I am having the same issue. Once the screen size reaches hand held device size there is a problem with the products list. When the screen is full size the product title has what appears to be a line break so that the product description will start on a new line. Whenever I decrease the size of the screen to handheld size the product description starts right after the product title without a line break. As long as the product title is at least one full line the break after the product title works fine on the handheld device. I get the same results when using Chrome and Firefox on a Linux desktop and Chrome or Opera on an android smart phone or 7 inch tablet.

---

If you post a link to your site I can take a look.

So you are seeing a problem with the tablet at screen resolution 768 pixels wide?

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

If you post a link to your site I can take a look.

So you are seeing a problem with the tablet at screen resolution 768 pixels wide?

Thanks,

Anne

---

My test website is test.gunkings.com. I opened it up so you can get to it. I do not like it open to the word for long since Google tends to index things even if you do not want them to some times. Thanks for any assistance you can provide.

Quote:

---

Originally Posted by jnissley

My test website is test.gunkings.com. I opened it up so you can get to it. I do not like it open to the word for long since Google tends to index things even if you do not want them to some times. Thanks for any assistance you can provide.

---

I just checked your site on an ipad at portrait (768 pixels wide) and an android at 758 pixels wide using google chrome mobile and do not see the problem.

If you are just resizing your browser you will see in between break points where this happens, but none of the mobile devices are rendering this way.

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

I just checked your site on an ipad at portrait (768 pixels wide) and an android at 758 pixels wide using google chrome mobile and do not see the problem.

If you are just resizing your browser you will see in between break points where this happens, but none of the mobile devices are rendering this way.

Thanks,

Anne

---

Here is what I see. Notice how the title of the item is left justified and if it does not take up the whole screen width the description is wrapped strangely. Also the buy now button and prices are overwriting things. This is from my desktop but is the same on my notebook.

Attachment 13302

Quote:

---

Originally Posted by jnissley

Here is what I see. Notice how the title of the item is left justified and if it does not take up the whole screen width the description is wrapped strangely. Also the buy now button and prices are overwriting things. This is from my desktop but is the same on my notebook.

Attachment 13302

---

Yes, this is not how the site is rendering on a tablet in portrait orientation. You are seeing an "in between" break point while resizing your desktop browser window.

Thanks,

Anne

jnissley - with Firefox using the web developer plugin one of the tools I have is a ruler; if you have that or something similar, take a measurement of the page width, then open the responsive.css file.

The responsive file is broken up into sections that represent the different widths, starting from smaller to largest, and here is where these settings are adjusted. Word of warning, it's pretty complex, and I'd keep a copy of the file you started with before working on it in case you need to go back to the beginning...

Quote:

---

Originally Posted by chowardart

jnissley - with Firefox using the web developer plugin one of the tools I have is a ruler; if you have that or something similar, take a measurement of the page width, then open the responsive.css file.

The responsive file is broken up into sections that represent the different widths, starting from smaller to largest, and here is where these settings are adjusted. Word of warning, it's pretty complex, and I'd keep a copy of the file you started with before working on it in case you need to go back to the beginning...

---

Yes, this is a solution. But, should not be necessary since it will be a non-standard width which is not rendering on any handheld device ;) It is unlikely that your desktop customers will be browsing your shop and resizing the browser window on various pages of the site to the non-standard widths ;)

Thanks,

Anne

picaflor-azul,

I love the responsive mega-menu and i am trying to incorporate that into my custom responsive site. Can you point me to the files that need editing?
If i download this template i can copy and paste and compare things but is most of that done in the responsive.css or else where as well?

Quote:

---

Originally Posted by gazag

picaflor-azul,

I love the responsive mega-menu and i am trying to incorporate that into my custom responsive site. Can you point me to the files that need editing?
If i download this template i can copy and paste and compare things but is most of that done in the responsive.css or else where as well?

---

The Pure CSS mega menu is not responsive. If you look in the plugins section you can download the module package.

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

The Pure CSS mega menu is not responsive. If you look in the plugins section you can download the module package.

Thanks,

Anne

---

Hello Anne,

I realize that the pure CSS mega menu is not responsive, i have downloaded and installed that from your website and it work great but now i need to adjust it to make it responsive. On your new responsive templates such as this one that has the responsive mega menu where did you have to make the changes?

Is it mainly in the responsive.css file or more than that?:wacko::lamo:

Quote:

---

Originally Posted by gazag

Hello Anne,

I realize that the pure CSS mega menu is not responsive, i have downloaded and installed that from your website and it work great but now i need to adjust it to make it responsive. On your new responsive templates such as this one that has the responsive mega menu where did you have to make the changes?

Is it mainly in the responsive.css file or more than that?:wacko::lamo:

---

Ok, I understand. If you take a peek at the readme.html file included in the template package in the credits section there will be a link to the tutorial that has the code for the handheld menu ;)

Thanks,

Anne

Hi!

Is there a possibility to built in a anti-spam filter in the header menu? In the mail form i mean.
And if so, how do i do that?
I already received a few ############ offers :blush:

Quote:

---

Originally Posted by picaflor-azul

This bug has already been addressed earlier in this thread and a patch has been posted.

Thanks,

Anne

---

Post # please. I've been though the entire thread and did not find the patch referred to. Thanks.

Quote:

---

Originally Posted by Marcel Wiegers

Hi!

Is there a possibility to built in a anti-spam filter in the header menu? In the mail form i mean.
And if so, how do i do that?
I already received a few ############ offers :blush:

---

If you do a forum search, I think it is in the abbington mega support thread or the sheffield blue support thread, there is code posted to cut down on spam in the header contact us form ;)

Thanks,

Anne

Anne,

I see that you are making Bradford Pure responsive using 'Responsive DIY Template Default for 1.5.x V2.0'.

Do you have any plans to upgrade Responsive Sheffield Blue to this latest framework package?

Cheers

Quote:

---

Originally Posted by simon1066

Anne,

I see that you are making Bradford Pure responsive using 'Responsive DIY Template Default for 1.5.x V2.0'.

Do you have any plans to upgrade Responsive Sheffield Blue to this latest framework package?

Cheers

---

Yes, I will probably be updating all of the responsive template packages to the new framework ;)

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

Yes, I will probably be updating all of the responsive template packages to the new framework ;)

Thanks,

Anne

---

That's great, thank you

Quote:

---

Originally Posted by picaflor-azul

I have included a cross browser javascript to make isolating css on specific browsers easier. Add a rule to the bototm of your stylesheet for .ie8 #navMainSearch input[type="image"] {top:5px; or whatever to line it up}

Anne

---

I had added a header BG image to RenaissanceManInc.com:

Code:

---

#headerWrapper{background:url("../images/hd.png") no-repeat scroll center top / 1200px rgba(0, 0, 0, 0);}

---

needed add following for it to show up in internet explorer 8:

Code:

---

.ie8 #headerWrapper {
position: relative;
background: url("http://renaissancemaninc.com/includes/templates/renaissance3/images/hd.jpg");
background-repeat: no-repeat;
}

---

Had tried adding the HTML5Shiv to header_html.php file as well, but it did not solve the issue.

The wordpress twentythirteen responsive theme background header works on ie8, but I'm not sure how or why.

Apparently nearly 10% of internet surfers were still using ie8 as of Spring in 2013.

Hey Anne...

I hope what I'm getting isn't a bug, but my product pages aren't displaying descriptions even though the settings say they should...

Zen 1.5.1, Sheffield Blue Responsive, add-ons Apsona ShopAdmin, Easy Populate 4, Zen Lightbox, hosted on GoDaddy. This is a site in development to replace the current site so it's not really live yet...

Configuration>Product Listing>Display Product Description is set at 150; All Listing, New Listing and Featured are all at 0... I've got several products in there with descriptions but none will display on the individual product pages... Am I missing something?

Thanks in advance!...

Quote:

---

Originally Posted by chowardart

Hey Anne...

I hope what I'm getting isn't a bug, but my product pages aren't displaying descriptions even though the settings say they should...

Zen 1.5.1, Sheffield Blue Responsive, add-ons Apsona ShopAdmin, Easy Populate 4, Zen Lightbox, hosted on GoDaddy. This is a site in development to replace the current site so it's not really live yet...

Configuration>Product Listing>Display Product Description is set at 150; All Listing, New Listing and Featured are all at 0... I've got several products in there with descriptions but none will display on the individual product pages... Am I missing something?

Thanks in advance!...

---

This is a bug! But, it has been already noted and I posted a patch earlier in the thread :)

Thanks,

Anne

If it was a snake.... Oh well...

Hey, while I'm on the subject, I saw another post where the responsive core was getting an update? How does one install that?

Or is it premature to ask at this time?...

Again, thanks!...

Quote:

---

Originally Posted by chowardart

If it was a snake.... Oh well...

Hey, while I'm on the subject, I saw another post where the responsive core was getting an update? How does one install that?

Or is it premature to ask at this time?...

Again, thanks!...

---

It is premature, but when I do the updated package I'll include upgrade instructions ;)

Thanks,

Anne

i can't see featured product or new products when someone enter my url
i can see featured product or new product when we click on featured link
pls help me out of this

Quote:

---

Originally Posted by sandy101

i can't see featured product or new products when someone enter my url
i can see featured product or new product when we click on featured link
pls help me out of this

---

If you post a link to your site I can take a look.

Thanks,

Anne

Why I can't see into "product listing" the "ACTIVATE Responsive Template by selecting Column Widths"?

Quote:

---

Originally Posted by picaflor-azul

If you do a forum search, I think it is in the abbington mega support thread or the sheffield blue support thread, there is code posted to cut down on spam in the header contact us form ;)

Thanks,

Anne

---

Hi Anne, I found the response that Design75 gave me when I was using standard 'Sheffield Blue' so thought I'd post it here for the others asking the same question to see.

The response I received re Anti Spam solution was:-

Quote:

---

Originally Posted by Design75

Add this line

PHP Code:

---

<?php echo  zen_draw_input_field('should_be_empty', '', ' size="40" id="CUAS"  style="visibility:hidden; display:none;" autocomplete="off"');  ?>

---

after

PHP Code:

---

<br class="clearBoth" />
                        <label for="enquiry">Message<span class="required"> *</span></label>
                        <textarea name="enquiry" cols="40" rows="3"  id="enquiry"></textarea> 


---

---

The file that needs changing is /YOURSHOP/includes/templates/responsive_sheffield_blue/common/tpl_mega_menu.php

I've just completed the change without any problems showing on the Responsive Template.

Link to original posts here

Quote:

---

Originally Posted by 100asa

Why I can't see into "product listing" the "ACTIVATE Responsive Template by selecting Column Widths"?

---

found solution: delete and then adding again with this sql:

Code:

---

SET @configuration_group_id=0;
SELECT (@configuration_group_id:=configuration_group_id) FROM configuration_group WHERE configuration_group_title= 'Settaggi Layout' LIMIT 1;
INSERT INTO configuration (configuration_id, configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, date_added, use_function, set_function) VALUES
(NULL, '<font color="#0044ff">ACTIVATE Responsive Template by selecting Column Widths</font>', 'COLUMN_WIDTH', '2', 'Width of the Left and Right Columns<br />0 = Use Default Template Settings<br />1 = 75px<br />2 = 150px<br />3 = 225px',@configuration_group_id, NULL, NOW(), NULL, 'zen_cfg_select_option(array(\'0\', \'1\', \'2\', \'3\'),');

---

but also with this modify, and follow instruction step by step, website not show properly www.100asa.it/newcart

Quote:

---

Originally Posted by Purecarsound

Hi Anne, I found the response that Design75 gave me when I was using standard 'Sheffield Blue' so thought I'd post it here for the others asking the same question to see.

The response I received re Anti Spam solution was:-



The file that needs changing is /YOURSHOP/includes/templates/responsive_sheffield_blue/common/tpl_mega_menu.php

I've just completed the change without any problems showing on the Responsive Template.

Link to original posts here

---

Thanks for posting the link :)

Thanks,

Anne

Quote:

---

Originally Posted by 100asa

found solution: delete and then adding again with this sql:

Code:

---

SET @configuration_group_id=0;
SELECT (@configuration_group_id:=configuration_group_id) FROM configuration_group WHERE configuration_group_title= 'Settaggi Layout' LIMIT 1;
INSERT INTO configuration (configuration_id, configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, date_added, use_function, set_function) VALUES
(NULL, '<font color="#0044ff">ACTIVATE Responsive Template by selecting Column Widths</font>', 'COLUMN_WIDTH', '2', 'Width of the Left and Right Columns<br />0 = Use Default Template Settings<br />1 = 75px<br />2 = 150px<br />3 = 225px',@configuration_group_id, NULL, NOW(), NULL, 'zen_cfg_select_option(array(\'0\', \'1\', \'2\', \'3\'),');

---

but also with this modify, and follow instruction step by step, website not show properly www.100asa.it/newcart

---

There is another bug noted earlier in the thread. It involves the tpl_header.php file and there is a patch/fix posted if you are going to leave the tagline blank.

Thanks,

Anne

Thanks Anne for all the work you did on this template it was very easy to work with... I just uploaded my auction site this weekend and now running it through some more testing... still finding forms I missed making responsive. One thing I found I like to share...

From one of my user point of view, the description, info, review tabs didn't have a hint to click for expanding them.... so I tagged in a pointer... I know, should of just added it to the 'heading' class, was in a rush...

Code:

---

<p class="heading" style="cursor:pointer;"><?php echo PRODUCT_DETAILS; ?></p>

---

Think I modified another 7-10 mods when I did the template change.... with all that.. the template remained fast and user responsive... very nice!
testing with a BlackBerry... so far it's all finger ready... even colorbox works..

Quote:

---

Originally Posted by davewest

Thanks Anne for all the work you did on this template it was very easy to work with... I just uploaded my auction site this weekend and now running it through some more testing... still finding forms I missed making responsive. One thing I found I like to share...

From one of my user point of view, the description, info, review tabs didn't have a hint to click for expanding them.... so I tagged in a pointer... I know, should of just added it to the 'heading' class, was in a rush...

Code:

---

<p class="heading" style="cursor:pointer;"><?php echo PRODUCT_DETAILS; ?></p>

---

Think I modified another 7-10 mods when I did the template change.... with all that.. the template remained fast and user responsive... very nice!
testing with a BlackBerry... so far it's all finger ready... even colorbox works..

---

I am happy that you are using the template and have managed to integrate so many modules.

Thanks for posting. I'll make a note and include this in the stylesheet for a future update ;)

Thanks,

Anne

Once again thanks for the Sheffield Blue Responsive theme. I've been learning quite a lot working with it. Will definitely be recommending Picaflor Azul to people.

I would like to know two things:

#1. On the product page...how to move the product name, description, price and quantity to the right of the product image. Here is a product page showing what I'm talking about: http://www.cocoroots.com/cart/rings/...ll-silver-ring

I'm guessing I need to change: \includes\templates\responsive_sheffield_blue\templates\tpl_product_info_display .php but that doesn't seem to be enough. If I have the image size small enough then the info above moves to the right of the image, but we would like to have a nice 300x250px image and then it all moves down below the image.

#2. Is there a way to force Zen Cart (or the template) so that the boxes on the main page (showing new, featured, special) to be the same height? If the product name is long (becoming two lines) or I believe when something is showing "sold out" then the boxes are different heights and look quite messy. I've come up with one solution which is to force all the product names to be two lines by adding a <br>, but that will be quite confusing for the people who are entering in the products.

Thanks!
Greg

Quote:

---

Originally Posted by palafirst

#2. Is there a way to force Zen Cart (or the template) so that the boxes on the main page (showing new, featured, special) to be the same height? If the product name is long (becoming two lines) or I believe when something is showing "sold out" then the boxes are different heights and look quite messy. I've come up with one solution which is to force all the product names to be two lines by adding a <br>, but that will be quite confusing for the people who are entering in the products.

---

Greg
Go to the stylesheet.css file and look for ".centerBoxContentsProducts"... You can add a height value (I made mine at 335px)...

Recommend, I use Firefox (I actually use several browsers for different purposes), and add the Web Developer and Firebug plugins. Then all you have to do is select items in your store and in most cases it will show you the settings for various things, and in the case of WD will show you things like image sizes, or paths, or many other helpful info...

Quote:

---

Originally Posted by palafirst

Once again thanks for the Sheffield Blue Responsive theme. I've been learning quite a lot working with it. Will definitely be recommending Picaflor Azul to people.

I would like to know two things:

#1. On the product page...how to move the product name, description, price and quantity to the right of the product image. Here is a product page showing what I'm talking about: http://www.cocoroots.com/cart/rings/...ll-silver-ring

I'm guessing I need to change: \includes\templates\responsive_sheffield_blue\templates\tpl_product_info_display .php but that doesn't seem to be enough. If I have the image size small enough then the info above moves to the right of the image, but we would like to have a nice 300x250px image and then it all moves down below the image.

#2. Is there a way to force Zen Cart (or the template) so that the boxes on the main page (showing new, featured, special) to be the same height? If the product name is long (becoming two lines) or I believe when something is showing "sold out" then the boxes are different heights and look quite messy. I've come up with one solution which is to force all the product names to be two lines by adding a <br>, but that will be quite confusing for the people who are entering in the products.

Thanks!
Greg

---

1. the example site is not loading. You will need to edit the tpl_product_info_display.php file and the stylesheet.css

2. You can add min-height:your height here; to the various elements in the stylesheet so that they line up. If you post a link to your site I can take a look



Thanks,

Anne

Quote:

---

Originally Posted by chowardart

Greg
Go to the stylesheet.css file and look for ".centerBoxContentsProducts"... You can add a height value (I made mine at 335px)...

Recommend, I use Firefox (I actually use several browsers for different purposes), and add the Web Developer and Firebug plugins. Then all you have to do is select items in your store and in most cases it will show you the settings for various things, and in the case of WD will show you things like image sizes, or paths, or many other helpful info...

---

If you do this, then all of the boxes will be the same height, but the elements within the boxes may not line up perfectly ;) If you want the individual elements to line up, then it is better to use min-height on the elements.

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

If you do this, then all of the boxes will be the same height, but the elements within the boxes may not line up perfectly ;) If you want the individual elements to line up, then it is better to use min-height on the elements.

---

Is there a way to limit how much info gets displayed?

Quote:

---

Originally Posted by picaflor-azul

1. the example site is not loading. You will need to edit the tpl_product_info_display.php file and the stylesheet.css

2. You can add min-height:your height here; to the various elements in the stylesheet so that they line up. If you post a link to your site I can take a look



Thanks,

Anne

---

The example site direct to the product page the first problem should be: http://www.cocoroots.com/cart/rings/...ll-silver-ring Otherwise the main page is www.cocoroots.com/cart. If you go to any of the products you should see that the product name, description, etc. is below the product image. It's late here in India so I'll check all the other suggestions first thing in the morning. Thanks!

Quote:

---

Originally Posted by picaflor-azul

If you do this, then all of the boxes will be the same height, but the elements within the boxes may not line up perfectly ;) If you want the individual elements to line up, then it is better to use min-height on the elements.

Thanks,

Anne

---

Yes Anne...I tried this and then one box has the "Details" button lower then the other boxes. Is there a better solution OR are there other changes to make so that the other elements inside the boxes can be made to line up? Much thanks!

Quote:

---

Originally Posted by chowardart

Is there a way to limit how much info gets displayed?

---

The easiest way to remove elements would be to use css and add a display:none; on the div class.

Thanks,

Anne

Hi Anne, very pretty template - just spent the better part of 2 weeks upgrading to 1.5.1 and RSB so... thank you!

I'm having a couple problems:

1. When I add a product to cart and login (or vice versa) it screws up the mega menu header. I can add to cart *or* login and no problem so it only shows up when I do both. See pics:
Attachment 13388Attachment 13389

2. The "Sold Out" image in Product Listing displays "Sold Out Sm" - this is not the case in the Product Info page. See pic:
Attachment 13390

3. Since I removed 3 of the mega-menu items, "Service" opened left (hover) which ran off the screen. I'm a CSS dummy but I figured out if I removed the following code from stylesheet_mega_menu.css that it would open right. Will this mess anything up? Here's the code I removed:

/* bof drop down on mouse hover right aligned */
.mega-menu li .align_right {-moz-border-radius: 5px 0px 5px 5px;-webkit-border-radius: 5px 0px 5px 5px;border-radius: 5px 0px 5px 5px;}
.mega-menu li:hover .align_right {left:auto;right:-1px;top:25px;}

Much thanks!
Scott

My site so far:
zc1.5.1
Responsive Sheffield Blue
Image Handler 4
Zen Lightbox
EP4.0 and EP-CSV
MAP Pricing
Multi-Product Copy

Quote:

---

Originally Posted by scottj

Hi Anne, very pretty template - just spent the better part of 2 weeks upgrading to 1.5.1 and RSB so... thank you!

I'm having a couple problems:

1. When I add a product to cart and login (or vice versa) it screws up the mega menu header. I can add to cart *or* login and no problem so it only shows up when I do both. See pics:
Attachment 13388Attachment 13389

2. The "Sold Out" image in Product Listing displays "Sold Out Sm" - this is not the case in the Product Info page. See pic:
Attachment 13390

3. Since I removed 3 of the mega-menu items, "Service" opened left (hover) which ran off the screen. I'm a CSS dummy but I figured out if I removed the following code from stylesheet_mega_menu.css that it would open right. Will this mess anything up? Here's the code I removed:

/* bof drop down on mouse hover right aligned */
.mega-menu li .align_right {-moz-border-radius: 5px 0px 5px 5px;-webkit-border-radius: 5px 0px 5px 5px;border-radius: 5px 0px 5px 5px;}
.mega-menu li:hover .align_right {left:auto;right:-1px;top:25px;}

Much thanks!
Scott

My site so far:
zc1.5.1
Responsive Sheffield Blue
Image Handler 4
Zen Lightbox
EP4.0 and EP-CSV
MAP Pricing
Multi-Product Copy

---

If you post a link to your site I can take a look at 1.

2. If you want a different image then you can create your button, name it the same, and upload to includes/templates/responsive_sheffield_blue/buttons/english



Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

If you post a link to your site I can take a look at 1.

2. If you want a different image then you can create your button, name it the same, and upload to includes/templates/responsive_sheffield_blue/buttons/english



Thanks,

Anne

---

Thanks, it's bumboatonline.com

So you're saying the "Sold Out Sm" is intentional? What does it mean? What about the css code I removed, will that mess anything up?

Scott

Quote:

---

Originally Posted by scottj

Thanks, it's bumboatonline.com

So you're saying the "Sold Out Sm" is intentional? What does it mean? What about the css code I removed, will that mess anything up?

Scott

---

I just logged in and added an item to the cart and did not see a problem. What browser are you using?



Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

I just logged in and added an item to the cart and did not see a problem. What browser are you using?



Thanks,

Anne

---

Google Chrome. Interestingly I just tried with IE and don't have the problem. I assume you're using FF so it must be limited to Chrome. Hmmmm....?

Hi Anne, I was starting to get spam from bots using the contact-us form in the mega menu. So I killed the form and went back to testing the honeypot... found that 40% of the time, the honeypot and other error checks worked and 60% of the time it skipped all checks and went for the send... not sure why! Refused to return back to any CAPTCHA, decided on studying honeypots more closely... After some more testing and changes, it&#39;s been live for a week now without any more attacks and no CAPTCHA eye tests. What I did, honeypot suggestions.. --Hide the style tag into css ID --added placeholder so if css fails, user doesn&#39;t enter anything --added second honeypot, which is a preview of the message before sending.. if the first honeypot fails, the form just does as expected and displays the success screen and moves on, no send, never gets to that part of the code. if it tests good, on to the main contact us page where all but the subject is filled in, letting the user pick a subject and hit send... the form behaves as expected at this point, all tests work at 100%. The message is sent after testing email for bad or block addresses. I did it by changing the action from &#39;send&#39; to &#39;mega&#39; so I can do a quick honeypot check and go to preview if it&#39;s good. Fourm post is acting up on me so can&#39;t show any code...

Quote:

---

Originally Posted by davewest

Hi Anne, I was starting to get spam from bots using the contact-us form in the mega menu. So I killed the form and went back to testing the honeypot... found that 40% of the time, the honeypot and other error checks worked and 60% of the time it skipped all checks and went for the send... not sure why! Refused to return back to any CAPTCHA, decided on studying honeypots more closely... After some more testing and changes, it's been live for a week now without any more attacks and no CAPTCHA eye tests. What I did, honeypot suggestions.. --Hide the style tag into css ID --added placeholder so if css fails, user doesn't enter anything --added second honeypot, which is a preview of the message before sending.. if the first honeypot fails, the form just does as expected and displays the success screen and moves on, no send, never gets to that part of the code. if it tests good, on to the main contact us page where all but the subject is filled in, letting the user pick a subject and hit send... the form behaves as expected at this point, all tests work at 100%. The message is sent after testing email for bad or block addresses. I did it by changing the action from 'send' to 'mega' so I can do a quick honeypot check and go to preview if it's good. Fourm post is acting up on me so can't show any code...

---

Thank you for posting your solution. Please do come back later and post your code so that others can implement this if they need it ;)

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

Thank you for posting your solution. Please do come back later and post your code so that others can implement this if they need it ;)

Thanks,

Anne

---

Looks like it's working today... OK, forms have been modified for usibility, (nija code) so some things going on not part of the honeypot so can't just post it all, would mess folks up... just posting the honeypot.
using ZenCart 1.5.1
in Mega Menu I changed the action...

Code:

---

<?php echo zen_draw_form('contact_us', zen_href_link(FILENAME_CONTACT_US, 'action=mega', $request_type), 'post',  'enctype="multipart/form-data"'); ?>

---

Then added this just after the textarea field

Code:

---

<?php echo zen_draw_input_field('should_be_empty', '', ' size="10" id="email-pot" placeholder="do not fill in!" autocomplete="off"'); ?>
                      <?php echo zen_draw_hidden_field('subject', 'From MegaMenu', ' id="subject"'); ?>

---

in my stylesheet.css file I added

Code:

---

#email-pot {position:absolute; visibility:hidden; display:none;}

---

then in the includes/modules/pages/contact_us/header_php.php I added this after the $error = false; line

Code:

---

if (isset($_GET['action']) && ($_GET['action'] == 'mega')) {
  $antiSpam = isset($_POST['should_be_empty']) ? zen_db_prepare_input($_POST['should_be_empty']) : '';
if ($antiSpam != '') {
      $zco_notifier->notify('NOTIFY_SPAM_DETECTED_USING_CONTACT_US');
      zen_redirect(zen_href_link(FILENAME_CONTACT_US, 'action=success')); 
  } elseif ($antiSpam == '') {
  $name = zen_db_prepare_input($_POST['contactname']);
  $email_address = zen_db_prepare_input($_POST['email']);
  $subject = ''; //blank subject so dropdown error works
  $enquiry = zen_db_prepare_input(strip_tags($_POST['enquiry']));
 }
 //fall back and fill in contact us form for final review and send
}

---

So if it's a bot, it just leaves to the success page, non-bot, loads the contact us page, fills in what it had, I use a subject dropdown so I need them to pick something. With the default form you could keep the subject field intact. Oh.. I also changed the words submit to preview on the button.
So far it's working, and coming in using the contact from is normal, the honeypot is part of ZenCart 1.5.1..

Accidentally posted the following to the non-responsive version of this template and received a partial response (that needed to be implemented); however, the below issue/question is a bit different than previous discussion about the description not showing up (solution provided at: http://www.zen-cart.com/showthread.p...52#post1220352 ) which for me meant changing the last line of the css file.

Hi,

I've installed this template, been able to control the contact_us menu option so that do not get spam through it, moved some things around and clean it up so that features are enabled/disabled as set in the admin panel (version 1.5.1 of Zen Cart); however, I am trying to figure out where/how to disable the Details drop down if there is nothing in the database that would populate that drop down. (ie., on page loads where data is present to have it load/display, and on pages where nothing would be present to remove the "window" and any clickable areas.) I would also like to apply the CSS necessary to have the full description show on page load instead of the default of it being drawn up into the description button. (Ie., not require clicking on the description button to have the description appear.)

The problem is that the words "details" and "description" are throughout the ZC code so when searching for these particular program areas, I have not had much success and I am trying to get through this portion as quickly as I can. Could someone please direct me to which file(s) to look in for the programming code, and in which of the CSS files it would be recommended to add the line that will make the description show upon loading the page similar to having the special products, new products, and/or featured products show on the main page?

Quote:

---

Originally Posted by mc12345678

Accidentally posted the following to the non-responsive version of this template and received a partial response (that needed to be implemented); however, the below issue/question is a bit different than previous discussion about the description not showing up (solution provided at: http://www.zen-cart.com/showthread.p...52#post1220352 ) which for me meant changing the last line of the css file.

Hi,

I've installed this template, been able to control the contact_us menu option so that do not get spam through it, moved some things around and clean it up so that features are enabled/disabled as set in the admin panel (version 1.5.1 of Zen Cart); however, I am trying to figure out where/how to disable the Details drop down if there is nothing in the database that would populate that drop down. (ie., on page loads where data is present to have it load/display, and on pages where nothing would be present to remove the "window" and any clickable areas.) I would also like to apply the CSS necessary to have the full description show on page load instead of the default of it being drawn up into the description button. (Ie., not require clicking on the description button to have the description appear.)

The problem is that the words "details" and "description" are throughout the ZC code so when searching for these particular program areas, I have not had much success and I am trying to get through this portion as quickly as I can. Could someone please direct me to which file(s) to look in for the programming code, and in which of the CSS files it would be recommended to add the line that will make the description show upon loading the page similar to having the special products, new products, and/or featured products show on the main page?

---

The code for the toggles on the product info page is located in includes/templates/responsive_sheffield_blue/templates/tpl_product_info_display.php

Thanks,

Anne

Quote:

---

Originally Posted by davewest

Looks like it's working today... OK, forms have been modified for usibility, (nija code) so some things going on not part of the honeypot so can't just post it all, would mess folks up... just posting the honeypot.
using ZenCart 1.5.1
in Mega Menu I changed the action...

Code:

---

<?php echo zen_draw_form('contact_us', zen_href_link(FILENAME_CONTACT_US, 'action=mega', $request_type), 'post',  'enctype="multipart/form-data"'); ?>

---

Then added this just after the textarea field

Code:

---

<?php echo zen_draw_input_field('should_be_empty', '', ' size="10" id="email-pot" placeholder="do not fill in!" autocomplete="off"'); ?>
                      <?php echo zen_draw_hidden_field('subject', 'From MegaMenu', ' id="subject"'); ?>

---

in my stylesheet.css file I added

Code:

---

#email-pot {position:absolute; visibility:hidden; display:none;}

---

then in the includes/modules/pages/contact_us/header_php.php I added this after the $error = false; line

Code:

---

if (isset($_GET['action']) && ($_GET['action'] == 'mega')) {
  $antiSpam = isset($_POST['should_be_empty']) ? zen_db_prepare_input($_POST['should_be_empty']) : '';
if ($antiSpam != '') {
      $zco_notifier->notify('NOTIFY_SPAM_DETECTED_USING_CONTACT_US');
      zen_redirect(zen_href_link(FILENAME_CONTACT_US, 'action=success')); 
  } elseif ($antiSpam == '') {
  $name = zen_db_prepare_input($_POST['contactname']); http://babyvegas.com.au/wp/wp-login.php
  $email_address = zen_db_prepare_input($_POST['email']);
  $subject = ''; //blank subject so dropdown error works
  $enquiry = zen_db_prepare_input(strip_tags($_POST['enquiry']));
 }
 //fall back and fill in contact us form for final review and send
}

---

So if it's a bot, it just leaves to the success page, non-bot, loads the contact us page, fills in what it had, I use a subject dropdown so I need them to pick something. With the default form you could keep the subject field intact. Oh.. I also changed the words submit to preview on the button.
So far it's working, and coming in using the contact from is normal, the honeypot is part of ZenCart 1.5.1..

---

Thank you for taking the time to make such a detailed post ;)

Thanks,

Anne

Quote:

---

Originally Posted by mc12345678

Accidentally posted the following to the non-responsive version of this template and received a partial response (that needed to be implemented); however, the below issue/question is a bit different than previous discussion about the description not showing up (solution provided at: http://www.zen-cart.com/showthread.p...52#post1220352 ) which for me meant changing the last line of the css file.

Hi,

I've installed this template, been able to control the contact_us menu option so that do not get spam through it, moved some things around and clean it up so that features are enabled/disabled as set in the admin panel (version 1.5.1 of Zen Cart); however, I am trying to figure out where/how to disable the Details drop down if there is nothing in the database that would populate that drop down. (ie., on page loads where data is present to have it load/display, and on pages where nothing would be present to remove the "window" and any clickable areas.) I would also like to apply the CSS necessary to have the full description show on page load instead of the default of it being drawn up into the description button. (Ie., not require clicking on the description button to have the description appear.)

The problem is that the words "details" and "description" are throughout the ZC code so when searching for these particular program areas, I have not had much success and I am trying to get through this portion as quickly as I can. Could someone please direct me to which file(s) to look in for the programming code, and in which of the CSS files it would be recommended to add the line that will make the description show upon loading the page similar to having the special products, new products, and/or featured products show on the main page?

---

Quote:

---

Originally Posted by picaflor-azul

The code for the toggles on the product info page is located in includes/templates/responsive_sheffield_blue/templates/tpl_product_info_display.php

Thanks,

Anne

---

For those interested, to accomplish the "disablement" of the details drop down, all that I needed to do was to move the applicable div tag declarations and closures into the if statement that was present within the file above. This made sure not to show the details menu bar on the product page unless the criteria to display the content was met for that product. I did the same thing for both the details and description menus. It is probably a personal preference, but I would rather an option invisible (which in this case CSS may be difficult to apply because the presence is/was data based instead of globally applicable) than to have an option that doesn't do something making me as a potential shopper unsure of the site functionality or out right question the absence of content. For those items that need the extra information, they will receive it and then be properly displayed.

Thank you for the assistance, and hope it helps someone else. Snazzy looking template, good work.

Continuing a love affair with Responsive Sheffield Blue, I am attempting to implement the css_js_loader because there are so many css and js files on the site at this point and I want to reduce TTFB (time to first byte load).

The Numinix module definitely doesn't work out of the box, at least due to differences in the TEMPLATE/common/header_html.php file.

CSS JS Loader loads the javascript and stylesheets using this code:

Code:

---

if($RI_CJLoader->get('status') && (!isset($Ajax) || !$Ajax->status())){
        $RI_CJLoader->autoloadLoaders();
        $RI_CJLoader->loadCssJsFiles();
        $files = $RI_CJLoader->header();       
       
        foreach($files['css'] as $file)
                if($file['include']) {
      include($file['src']);
    } else if (!$RI_CJLoader->get('minify_css') || $file['external']) {
      echo '<link rel="stylesheet" type="text/css" href="'.$file['src'].'" />'."\n";
    } else {
      echo '<link rel="stylesheet" type="text/css" href="min/?f='.$file['src'].'&amp;'.$RI_CJLoader->get('minify_time').'" />'."\n";
    }
               
        foreach($files['jscript'] as $file)
                if($file['include']) {
      include($file['src']);
    } else if(!$RI_CJLoader->get('minify_js') || $file['external']) {
      echo '<script type="text/javascript" src="'.$file['src'].'"></script>'."\n";
    } else {
      echo '<script type="text/javascript" src="min/?f='.$file['src'].'&amp;'.$RI_CJLoader->get('minify_time').'"></script>'."\n";
    }
}

---

whereas Responsive Sheffield Blue Template loads them with this code:

Code:

---

<?php
/**
 * load all template-specific stylesheets, named like "style*.css", alphabetically
 */
  $directory_array = $template->get_template_part($template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css'), '/^style/', '.css');
  while(list ($key, $value) = each($directory_array)) {
    echo '<link rel="stylesheet" type="text/css" href="' . $template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css') . '/' . $value . '" />'."\n";
  }
/**
 * load stylesheets on a per-page/per-language/per-product/per-manufacturer/per-category basis. Concept by Juxi Zoza.
 */
  $manufacturers_id = (isset($_GET['manufacturers_id'])) ? $_GET['manufacturers_id'] : '';
  $tmp_products_id = (isset($_GET['products_id'])) ? (int)$_GET['products_id'] : '';
  $tmp_pagename = ($this_is_home_page) ? 'index_home' : $current_page_base;
  if ($current_page_base == 'page' && isset($ezpage_id)) $tmp_pagename = $current_page_base . (int)$ezpage_id;
  $sheets_array = array('/' . $_SESSION['language'] . '_stylesheet',
                        '/' . $tmp_pagename,
                        '/' . $_SESSION['language'] . '_' . $tmp_pagename,
                        '/c_' . $cPath,
                        '/' . $_SESSION['language'] . '_c_' . $cPath,
                        '/m_' . $manufacturers_id,
                        '/' . $_SESSION['language'] . '_m_' . (int)$manufacturers_id,
                        '/p_' . $tmp_products_id,
                        '/' . $_SESSION['language'] . '_p_' . $tmp_products_id
                        );
  while(list ($key, $value) = each($sheets_array)) {
    //echo "<!--looking for: $value-->\n";
    $perpagefile = $template->get_template_dir('.css', DIR_WS_TEMPLATE, $current_page_base, 'css') . $value . '.css';
    if (file_exists($perpagefile)) echo '<link rel="stylesheet" type="text/css" href="' . $perpagefile .'" />'."\n";
  }

/**
 *  custom category handling for a parent and all its children ... works for any c_XX_XX_children.css  where XX_XX is any parent category
 */
  $tmp_cats = explode('_', $cPath);
  $value = '';
  foreach($tmp_cats as $val) {
    $value .= $val;
    $perpagefile = $template->get_template_dir('.css', DIR_WS_TEMPLATE, $current_page_base, 'css') . '/c_' . $value . '_children.css';
    if (file_exists($perpagefile)) echo '<link rel="stylesheet" type="text/css" href="' . $perpagefile .'" />'."\n";
    $perpagefile = $template->get_template_dir('.css', DIR_WS_TEMPLATE, $current_page_base, 'css') . '/' . $_SESSION['language'] . '_c_' . $value . '_children.css';
    if (file_exists($perpagefile)) echo '<link rel="stylesheet" type="text/css" href="' . $perpagefile .'" />'."\n";
    $value .= '_';
  }

/**
 * load printer-friendly stylesheets -- named like "print*.css", alphabetically
 */
  $directory_array = $template->get_template_part($template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css'), '/^print/', '.css');
  sort($directory_array);
  while(list ($key, $value) = each($directory_array)) {
    echo '<link rel="stylesheet" type="text/css" media="print" href="' . $template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css') . '/' . $value . '" />'."\n";
  }

/**
 * load all site-wide jscript_*.js files from includes/templates/YOURTEMPLATE/jscript, alphabetically
 */
  $directory_array = $template->get_template_part($template->get_template_dir('.js',DIR_WS_TEMPLATE, $current_page_base,'jscript'), '/^jscript_/', '.js');
  while(list ($key, $value) = each($directory_array)) {
    echo '<script type="text/javascript" src="' .  $template->get_template_dir('.js',DIR_WS_TEMPLATE, $current_page_base,'jscript') . '/' . $value . '"></script>'."\n";
  }

/**
 * load all page-specific jscript_*.js files from includes/modules/pages/PAGENAME, alphabetically
 */
  $directory_array = $template->get_template_part($page_directory, '/^jscript_/', '.js');
  while(list ($key, $value) = each($directory_array)) {
    echo '<script type="text/javascript" src="' . $page_directory . '/' . $value . '"></script>' . "\n";
  }

/**
 * load all site-wide jscript_*.php files from includes/templates/YOURTEMPLATE/jscript, alphabetically
 */
  $directory_array = $template->get_template_part($template->get_template_dir('.php',DIR_WS_TEMPLATE, $current_page_base,'jscript'), '/^jscript_/', '.php');
  while(list ($key, $value) = each($directory_array)) {
/**
 * include content from all site-wide jscript_*.php files from includes/templates/YOURTEMPLATE/jscript, alphabetically.
 * These .PHP files can be manipulated by PHP when they're called, and are copied in-full to the browser page
 */
    require($template->get_template_dir('.php',DIR_WS_TEMPLATE, $current_page_base,'jscript') . '/' . $value); echo "\n";
  }
/**
 * include content from all page-specific jscript_*.php files from includes/modules/pages/PAGENAME, alphabetically.
 */
  $directory_array = $template->get_template_part($page_directory, '/^jscript_/');
  while(list ($key, $value) = each($directory_array)) {
/**
 * include content from all page-specific jscript_*.php files from includes/modules/pages/PAGENAME, alphabetically.
 * These .PHP files can be manipulated by PHP when they're called, and are copied in-full to the browser page
 */
    require($page_directory . '/' . $value); echo "\n";
  }

// DEBUG: echo '<!-- I SEE cat: ' . $current_category_id . ' || vs cpath: ' . $cPath . ' || page: ' . $current_page . ' || template: ' . $current_template . ' || main = ' . ($this_is_home_page ? 'YES' : 'NO') . ' -->';

if (COLUMN_WIDTH == '0') {
    echo '';
} else {
    echo '<link rel="stylesheet" type="text/css" href="' . $template->get_template_dir('.css',DIR_WS_TEMPLATE, $current_page_base,'css') . '/' . 'responsive.css' . '" />';
}
?>

<script src="<?php echo $template->get_template_dir('',DIR_WS_TEMPLATE, $current_page_base,'jscript') . '/css_browser_selector.js' ?>" type="text/javascript"></script>

---

Before delving too deeply into the potential integration of the two methods, I'd love some input from the ZC community on the impact of compiling and minifying code in the first place.

Quote:

---

Originally Posted by mutinyzoo

Continuing a love affair with Responsive Sheffield Blue, I am attempting to implement the css_js_loader because there are so many css and js files on the site at this point and I want to reduce TTFB (time to first byte load).

The Numinix module definitely doesn't work out of the box, at least due to differences in the TEMPLATE/common/header_html.php file.

Before delving too deeply into the potential integration of the two methods, I'd love some input from the ZC community on the impact of compiling and minifying code in the first place.

---

Might be better to start a new thread or even a "CSS JS Loader Support thread" seeing how numinix only offers support via his website forums. IMO, the CSS JS Loader is not even worth the bother, focus on optimizing your images and combining id and class rules.

Quote:

---

Originally Posted by rbarbour

Might be better to start a new thread or even a "CSS JS Loader Support thread" seeing how numinix only offers support via his website forums. IMO, the CSS JS Loader is not even worth the bother, focus on optimizing your images and combining id and class rules.

---

Thank you for the insightful reply, RBarbour!. I found a link to a pretty informative explanation of best practices for CSS, which some forum readers might find useful. I love this stuff, even when I'm cursing.

Hi,

In the define_main_page.php and allowing categories on main page...everything is bunched to the left of the screen. I already went to template boxes controller and clicked all side boxes off ...still the same. Any idea?

Quote:

---

Originally Posted by ediesinc

Hi,

In the define_main_page.php and allowing categories on main page...everything is bunched to the left of the screen. I already went to template boxes controller and clicked all side boxes off ...still the same. Any idea?

---

If you post a link to your site I can take a look.

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

If you post a link to your site I can take a look.

Thanks,

Anne

---

nnyparts.com/store

Quote:

---

Originally Posted by ediesinc

nnyparts.com/store

---

Do you have both the left and right hand columns turned off in admin--configuration--layout settings?

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

I just logged in and added an item to the cart and did not see a problem. What browser are you using?



Thanks,

Anne

---

This is regards to the mega-menu getting messed up when logged in and adding an item to cart. The problem appears to only occur when using Chrome. Any ideas where to look? It's pretty minor but I'd still like to fix it. Chrome is a pretty popular browser.
Thanks!
Scott

www.bumboatonline.com

How do I remove the social side bar

I tried adding

.sidebar{display:none;}

to the bottom of

stylesheet.css

the icons disappear but the box is still there

Hi Annie,

Thanks so much for your time. I went ahead and turned off global left and right and it gave me a little more room but the grids still are not lining up and act like something is crunching the categories together. So I turned off open with categories and it allowed the define main page text to fill the area. Now if I used the drop down menu - Shop - Air filters and click on that....it opens with the same issue I had on the main page with categories. Is it something with defining tables? It seems to be an issue with any of the layout pages that are showing listing. I love the template and am sure it is something I screwed up if I could just figure it out.

In your favorite plain text editor open includes/templates/responsive_sheffield_blue/css/stysheet_social_header.css

At the bottom of the file add display:none; to the class for each icon you don't want to display. So, for example if you don't want to display the facebook icon you would add:

.facebook{display:none;}

The classes used for the icons are:

.facebook-sh
.twitter-sh
.youtube-sh
.pinterest-sh
.google-sh
.blog-sh

Quote:

---

Originally Posted by ediesinc

In your favorite plain text editor open includes/templates/responsive_sheffield_blue/css/stysheet_social_header.css

At the bottom of the file add display:none; to the class for each icon you don't want to display. So, for example if you don't want to display the facebook icon you would add:

.facebook{display:none;}

The classes used for the icons are:

.facebook-sh
.twitter-sh
.youtube-sh
.pinterest-sh
.google-sh
.blog-sh

---

Many thanks

I have now sorted it, if you do it that way, it takes away the icons but leaves the box, you have to take the section of code away from the tpl overides file that displays the box.

Regards
AfterHouR

Quote:

---

Originally Posted by scottj

This is regards to the mega-menu getting messed up when logged in and adding an item to cart. The problem appears to only occur when using Chrome. Any ideas where to look? It's pretty minor but I'd still like to fix it. Chrome is a pretty popular browser.
Thanks!
Scott

www.bumboatonline.com

---

While I tried to read through the path of conversation, I didn't blatantly see that the patch posted Oct 4 (or any other) http://www.zen-cart.com/showthread.p...25#post1221225 had been applied. I thought I remembered seeing some mods that specifically targetted some browsers (including Chrome.)

I'm not a css wiz... I have applied min-height to each of the four classes within the class = "centerBoxContentsNew centeredContent back"
so, I have a minimum height for: product_title (40px), box_image (150px), price (30px), and product_detail (35px) and things look nicely lined up, at least along the top...

As nice as it would be to go through the effort of making all images the same size, I would like to be able to instead align the images along their centers for a given row. Currently I have been looking at the items that appear on the main page when looking at new, specials, and featured products. I haven't even gone to look at other areas like categories, or the product page. This is just something that I think can be done referencing the default template. Obviously I would prefer a solution that is "auto-correcting", but if particular sizes must be entered, so be it.. (Ie., it would be nice to say that the min-height for an image is the maximum height expected for images...

Anyone have a bright idea? :)

Quote:

---

Originally Posted by scottj

This is regards to the mega-menu getting messed up when logged in and adding an item to cart. The problem appears to only occur when using Chrome. Any ideas where to look? It's pretty minor but I'd still like to fix it. Chrome is a pretty popular browser.
Thanks!
Scott

www.bumboatonline.com

---

If you can let me know the exact problem that you are having I can take a look.

Thanks,

Anne

Quote:

---

Originally Posted by AfterHouR

How do I remove the social side bar

I tried adding

.sidebar{display:none;}

to the bottom of

stylesheet.css

the icons disappear but the box is still there

---

Add the display:none; to the .sidebar in the stylesheet_social_sidebar.css file

Thanks,

Anne

Quote:

---

Originally Posted by AfterHouR

Many thanks

I have now sorted it, if you do it that way, it takes away the icons but leaves the box, you have to take the section of code away from the tpl overides file that displays the box.

Regards
AfterHouR

---

No, you do not have to edit the php file. See my response and edit the css file.

Thanks,

Anne

Quote:

---

Originally Posted by mc12345678

I'm not a css wiz... I have applied min-height to each of the four classes within the class = "centerBoxContentsNew centeredContent back"
so, I have a minimum height for: product_title (40px), box_image (150px), price (30px), and product_detail (35px) and things look nicely lined up, at least along the top...

As nice as it would be to go through the effort of making all images the same size, I would like to be able to instead align the images along their centers for a given row. Currently I have been looking at the items that appear on the main page when looking at new, specials, and featured products. I haven't even gone to look at other areas like categories, or the product page. This is just something that I think can be done referencing the default template. Obviously I would prefer a solution that is "auto-correcting", but if particular sizes must be entered, so be it.. (Ie., it would be nice to say that the min-height for an image is the maximum height expected for images...

Anyone have a bright idea? :)

---

Try putting the min-height on the .centerBoxWrapper img

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

Try putting the min-height on the .centerBoxWrapper img

Thanks,

Anne

---

Thank you for the suggestion. This stretches the image(s) to fit the minimum height entered. Preferably, would like the heights to be as they are, but have the middle of each image be in a row from left to right. (They seem to already be aligned vertically/centered within the left/right sides, but not top to bottom within the "constructed" area.) Have been trying to apply vertical-align:middle; but haven't seen any effects, nor sure if applying to the correct object.

Quote:

---

Originally Posted by mc12345678

Thank you for the suggestion. This stretches the image(s) to fit the minimum height entered. Preferably, would like the heights to be as they are, but have the middle of each image be in a row from left to right. (They seem to already be aligned vertically/centered within the left/right sides, but not top to bottom within the "constructed" area.) Have been trying to apply vertical-align:middle; but haven't seen any effects, nor sure if applying to the correct object.

---

If you post a link to your site I can take a look.

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

If you can let me know the exact problem that you are having I can take a look.

Thanks,

Anne

---

Thanks Anne,
I posted pictures (before and after) in post #260, page 26 of this thread.
Scott

Quote:

---

Originally Posted by scottj

Thanks Anne,
I posted pictures (before and after) in post #260, page 26 of this thread.
Scott

---

It is very hard for me to follow the conversation if bits and pieces of the question are scattered throughout different pages of the thread.

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

It is very hard for me to follow the conversation if bits and pieces of the question are scattered throughout different pages of the thread.

Thanks,

Anne

---

Here you go, pics: mega-menu lookin good & mega-menu messed up after login & add to cart... this only happens in Chrome.

I getting the Responsive template together, and have changed the banners to what I want for my website.
Where do I upload them too? and how do I find what the URL is?
I am following the firefox read me instruction, but it doesn't say where to load the banners to and it also doesn't say how to find the URL for them.
I went to Tools> Banners but I can't find slide 1,2,3,4 or 5 there.

Also, why is this happening with my drop down Categories when I click on SHOP

Attachment 13546

Okay, found where to change the slides, so that part is fixed now.

Still need to know why the store Categories and sub categories are doing what they are.
Is it possible to have too many Categories?

Quote:

---

Originally Posted by scottj

Here you go, pics: mega-menu lookin good & mega-menu messed up after login & add to cart... this only happens in Chrome.

---

What is the link to your site?

Thanks,

Anne

Quote:

---

Originally Posted by Jenvin

I getting the Responsive template together, and have changed the banners to what I want for my website.
Where do I upload them too? and how do I find what the URL is?
I am following the firefox read me instruction, but it doesn't say where to load the banners to and it also doesn't say how to find the URL for them.
I went to Tools> Banners but I can't find slide 1,2,3,4 or 5 there.

Also, why is this happening with my drop down Categories when I click on SHOP

Attachment 13546

---

Information on how to add your banners to the slide show is included in the readme.html file in the template package.

If you post a link to your site I can take a look.

Thanks,

Anne

Quote:

---

Originally Posted by picaflor-azul

Information on how to add your banners to the slide show is included in the readme.html file in the template package.

If you post a link to your site I can take a look.

Thanks,

Anne

---

Yes, how to add to the slide show is in the read me, but the read me doesn't say how to get the banners you have made up into the template program.
Remember, a lot of people are new at doing this type of this. You can't assume, just because you can do it, every one can.
The read me tell how to load the includes and Admin1. It doesn't say where to load the Banners at all. It also doesn't say how to get the URL to load into the slide show.

Website is here

This is also what it looked like after you loaded the template onto my site, Anne.

Quote:

---

Originally Posted by Jenvin

Yes, how to add to the slide show is in the read me, but the read me doesn't say how to get the banners you have made up into the template program.
Remember, a lot of people are new at doing this type of this. You can't assume, just because you can do it, every one can.
The read me tell how to load the includes and Admin1. It doesn't say where to load the Banners at all. It also doesn't say how to get the URL to load into the slide show.

Website is here

This is also what it looked like after you loaded the template onto my site, Anne.

---

In the readme step 10a is "Add Your Images and Links" and does give instructions on how to add your images and links to the slides.

You have a ton of sub categories in the dog breeds category. This is causing the problem in the shop drop down.

Thanks,

Anne