Responsive Classic (built in to Zen Cart v1.5.5) [Support Thread]

idtags:

I looked in my responsive.css there is nothing like navSupp or navSuppWrapper.

I changed "hidden" in responsive_mobile.css to "visible" in two occurrences:

/bof basic/
legend{line-height:25px;}
.mhide{display:none;}
#navCatTabsWrapper, #navEZPagesTop, #navSuppWrapper{display:none;visibility:visible;}
h2{line-height:22px;}
input[type=password], select, input[type=number], input[type=tel], input[type=email]{width:80%;margin-left:20px;}
input[type=text]{width:80%;margin-left:15px;}

and

/bof basic/
legend{line-height:25px;}
.mhide{display:none;}
#navCatTabsWrapper, #navEZPagesTop, #navSuppWrapper{display:none;visibility:visible;}
h2{line-height:22px;}
#cartAdd input[type=text]{width:11% !important;}
input[type=password], select, input[type=tel], input[type=text], input[type=email]{width:85% !important;}

Footer did not show on mobile template.

I stopped at this point. :cool:

Remove or change the** display: none;**

You could display**: block** or inline-block... but **none **will also turn the block off.

Thank you, your recent suggestion brought Footer in Mobile template to life!

For others, to recap the actions, to make footer visible in mobile template do following:

1. In file /includes/templates/your_responsive_template/css/responsive_mobile.css

change the line:

#navCatTabsWrapper, #navEZPagesTop, #navSuppWrapper{display:none;visibility:hidden;}

to line:

#navCatTabsWrapper, #navEZPagesTop, #navSuppWrapper{display:block;visibility:visible;}

Snapshot of line position in december 2017 [Attachment no longer available]

Result of actual change: [Attachment no longer available]

In the classic template the attributes of a product and the "add to cart" button come after or below the product description. But in most responsive templates, attributes and add to cart are in the upper right corner, and the description is below all this. Is there some way to position attributes and add to cart (which is usually in a box) below or after the product description?

includes/templates/responsive_classic/templates/tpl_productinfo_display.php is fairly well compartmentalized and defined with <!--bof through <!--eof for each section. You can experiment with those by moving them to different areas of the file.

Keep in mind that many features on this page are stylesheet-controlled and, as such, may look completely different in mobile or tablet mode after your adjustments.

Thanks for the pointer - I will see what happens from here!

sdelaney:

In the classic template the attributes of a product and the "add to cart" button come after or below the product description. But in most responsive templates, attributes and add to cart are in the upper right corner, and the description is below all this. Is there some way to position attributes and add to cart (which is usually in a box) below or after the product description?

You may run into this:
includes/modules/YOUR_TEMPLATE/product_listing.php

<div class="listingDescription">' . zen_trunc_string(zen_clean_html(stripslashes(zen_get_products_description($listing->fields['products_id'], $_SESSION['languages_id']))), PRODUCT_LIST_DESCRIPTION) . '</div>'

Notice the location within the $lc_text output line

        $lc_text = '<h3 class="itemTitle"><a href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), 'cPath=' . (($_GET['manufacturers_id'] > 0 and $_GET['filter_id'] > 0) ?  zen_get_generated_category_path_rev($_GET['filter_id']) : ($_GET['cPath'] > 0 ? zen_get_generated_category_path_rev($_GET['cPath']) : zen_get_generated_category_path_rev($listing->fields['master_categories_id']))) . '&products_id=' . $listing->fields['products_id']) . '">' . $listing->fields['products_name'] . '</a></h3><div class="listingDescription">' . zen_trunc_string(zen_clean_html(stripslashes(zen_get_products_description($listing->fields['products_id'], $_SESSION['languages_id']))), PRODUCT_LIST_DESCRIPTION) . '</div>';

This caused a lot of grief trying to control the product description *location *between mobile/tablet/desktop using CSS.

*MOVING *the product_description code block to a neutral location *THEN *modifying the CSS will maintain coding sanity ;)

Just be sure you don't add it into a site feature that may get shut off or ignored in the code flow. An example, if you add it to the products_model $lc_text output and turn off Display Product Model in admin... you'll hide both the model and the description.

I have an issue in regards to the layout of the Attributes within my product listing.

Basically I would just like them to be in line, can anyone help please?

Thank you in advance

A link to the site will help others help you, @Shillam! Welcome to the Zen Cart community!

https://www.print-shack.co.uk Thank you in advance

@Shillam, using FireFox, I pressed the F12 key to bring up the "Developer Tools" and used the Inspector tab to navigate through the HTML to find the cart-box and the productsAttributes div.

You need those option-names to "line up", so they need to have a specific width. You can edit your stylesheet.css file, adding to the bottom:

h4.optionName { width: 15em; }

to set that specific width.

Before you get too much further, I suggest using the Clone a Template plugin to (er) clone your current copy of the responsive_classic template so that your changes are easier to manage on any site upgrade.

You can also spiffy it up a little more by making it```
h4.optionName, .wrapperAttribsOptions select { width: 15em; }
input#attrib-4-0 {width:14.3em;}

***BUT....*** You may also want to consider adding some Please Select a ...  to your Option Values.  Using "Please Select a Size" for the hoodie, "Please Select a Colour" for the hoodie and design, and using a requirement for text in the Custom Name can keep the customer from accidentally ordering something they did not want.

You would add each as an option value to the option name and, when adding to the item in the Attributes Controller, mark each Please Select as "*Used for Display Purposes Only*" and "*Default Attribute to be Marked Selected*."  Yellow and Gold would now show up in the listing rather than an X.

For the text, you would use the "Attribute Required for Text" selection WITHOUT the yellow or gold.  You can add some text asking your customer to enter N/A if they do not want a Custom Name.

Thank you for that, however I have looked everywhere and tried editing different things and it still won't work - ARGHHHHHHHHHHH

Did you add it the END of your stylesheet.css? That's where it needs to go as lat9 pointed out.

Make sure you clear your cache after the change so you can really see if it took.

There's also going to need to be an adjustment for when your screen is more than 1500 pixels in width.

That would be in the responsive_default.css in lines 380 thru 412

I have an issue with Responsive Classic that appeared today and can't figure out why. All of a sudden the right column has moved to the bottom of the middle section of my site (osdparts.com). Have current zen cart installed and using chrome. The fonts on the "what's new" and "specials" sections seem to be really big too and weren't before. Is there a common thing that causes that to happen? The only thing I did today was adding some new products to the site. Turned all products added off and still have the issue. Tried searching for a previous thread for info on the issue with no luck.

osdmarine:

I have an issue with Responsive Classic that appeared today and can't figure out why. All of a sudden the right column has moved to the bottom of the middle section of my site (osdparts.com). Have current zen cart installed and using chrome. The fonts on the "what's new" and "specials" sections seem to be really big too and weren't before. Is there a common thing that causes that to happen? The only thing I did today was adding some new products to the site. Turned all products added off and still have the issue. Tried searching for a previous thread for info on the issue with no luck.

Any chance there is some stray bracket or colon within the product text, description, model, etc that could have been interpreted by the browser as markup code? This usually happens when there is a minor break in the HTML start/end tags.

twitchtoo:

Any chance there is some stray bracket or colon within the product text, description, model, etc that could have been interpreted by the browser as markup code? This usually happens when there is a minor break in the HTML start/end tags.

Found it! Turns out somehow my main page got messed with and some lines added changing the table that's on the home page. I didn't do it so strange sometimes pages get html added with me doing nothing to them.

osdmarine:

Found it! Turns out somehow my main page got messed with and some lines added changing the table that's on the home page. I didn't do it so strange sometimes pages get html added with me doing nothing to them.HTML does NOT self-generate. You need to contact your host and see if they can find when this change was made in their logs to see if you might have been hacked.
Meanwhile, it's probably not a bad idea to follow http://www.zen-cart.com/wiki/index.php/Recovering_From_Hacks just to make sure no one's messing with you.

Hi, im having a fresh install of v1.5.5f using template responsive classic.

I changed the background color, but want to give the sideboxes an other background color, i can't find where to do that. Anyone who can help me ?

The stylesheet for this template is a little confusing. I suggest you do the following.

Investigate two mods.

First, look at the Color Change Mod. It allows the break-out of colors for easier editing.

Second, Clone a Template by lat9. You can use this to clone the template into your own. This gives you something to fall back on if you mess something up.

I suggest the following sequence.

Install the Color mod, Clone it to your own template, and edit your own template.