Left/Right Navigation Columns Not Properly Aligning Vertically

[Kennith69]

I installed ZC version 1.5.5f on a HostGator server about a week ago; now I'm working on a customized template. The site: mjsmercantile.com. I haven't installed any plugins. The site has shared hosting using PHP Version 5.6.30.

Here's the issue:

When the banner_box_all.php is activated (right navigation column), the right navigation column properly aligns vertically, but the left navigation column is knocked down a bit (see MJM Screenshot 1). When I deactivate banner_box_all.php through Configuration > Layout Settings, the left navigation column properly aligns vertically, but the right navigation column is knocked down quite a bit, as though the banner box were still there but invisible (see MJM Screenshot 2). When I deactivate both banner_box_all.php and banner_box.php, the left navigation column remains properly aligned vertically, but the right navigation is still knocked down a bit, though not as much (see MJM Screenshot 3). When I deactivate all three banner_box php files, the left navigation column remains properly aligned vertically, but the right navigation column is once again knocked pretty far down (as in MJM Screenshot 2).

So far I've used the Firefox Inspect Element to try to find the problem, but both the left and the right navigation columns have identical CSS attributes. I also studied the page source to try to find the problem but had no luck. I've searched the forum here as well as Google and Bing, but I haven 't been able to find any relevant discussions. Any direction would be most appreciated.

Kennith

[lat9]

That's due to your (re-)naming of the sidebox "container" classes to columnLeft and columnRight. The responsive.css (see line#20) applies a style to all classes that start with col.

[idtags]

Hello,

I have a general question.

I was editing EZ Page and it took some time to type in text.

By the time I clicked "Update" Zen Cart Admin panel kicked me off the session.

Is there somewhere Setting for this time-out value?

Or everything should be done outside and just quickly copied in EZ Page?

Thank you.

[Kennith69]

That's due to your (re-)naming of the sidebox "container" classes to columnLeft and columnRight. The responsive.css (see line#20) applies a style to all classes that start with col.

lat9,

Thanks for responding. I haven't renamed the sidebox container classes, so that can't be the problem. The name for the left navigation column container remains "leftBoxContainer", and the name for the right navigation column container remains "rightBoxContainer". These names were included in the original ZC files. When I check the page source, I see that 'class="columnLeft" ' is applied to the td that contains the left navigation column, and similarly that 'class="columnRight" ' is applied to the td that contains the right navigation column. I didn't, though, create and apply these classes; they're included in the original ZC files (some CSS and some PHP files).

Perhaps I'm misunderstanding your post.

Kennith

[Kennith69]

Hi, idtags,

You may change the timeout setting by going to Admin > Configuration > My Store, then set "PA-DSS Admin Session Timeout Enforced?" to "No". Then set "Admin Session Time Out in Seconds" to whatever you want. BE WARNED, THOUGH: As I understand the matter, turning off the PA-DSS enforcement will make your site non-compliant (not a good thing). I think it a better practice to create files off line, then copy and paste them into the appropriate ZC place. I learned this lesson early on, when I wrote these absolutely stunning product descriptions, only to have them disappear when I tried to post them.

Kennith

PS: Your query really doesn't fit the subject of this thread, and people may get quite testy about off-topic posts. Here's a link to a full discussion of your question: https://bit.ly/2yzWQdG.

[lat9]

lat9,

Thanks for responding. I haven't renamed the sidebox container classes, so that can't be the problem. The name for the left navigation column container remains "leftBoxContainer", and the name for the right navigation column container remains "rightBoxContainer". These names were included in the original ZC files. When I check the page source, I see that 'class="columnLeft" ' is applied to the td that contains the left navigation column, and similarly that 'class="columnRight" ' is applied to the td that contains the right navigation column. I didn't, though, create and apply these classes; they're included in the original ZC files (some CSS and some PHP files).

Perhaps I'm misunderstanding your post.

Kennith

The only file in an as-shipped Zen Cart that uses the columnLeft and columnRight HTML classes is includes/templates/template_default/common/tpl_main_page.php.

That template is not responsive and you appear to be creating a customized version of the responsive_classic template, which has its own version of the tpl_main_page.php that doesn't use those classes and, thus, renders properly.

[Kennith69]

The only file in an as-shipped Zen Cart that uses the columnLeft and columnRight HTML classes is includes/templates/template_default/common/tpl_main_page.php.

That template is not responsive and you appear to be creating a customized version of the responsive_classic template, which has its own version of the tpl_main_page.php that doesn't use those classes and, thus, renders properly.

I did indeed base (or at least intended to base) my custom template on the responsive_classic template. I hadn't created an override tpl_main_page.php in my custom template folder, as I had understood that I needed to create override files only when I intended to edit the file for customization. I did, though, copy the tpl_main_page.php in the responsive_classic folder and placed it (without changes) into my custom template folder, and that action appears to have solved the immediate display problem (while creating some others, but that's for another day).

As a general matter, can I direct ZC to check first for an override file in my custom template folder, then (if it finds no override file there) next check the responsive_classic template folder? Obviously the program does the first, but then it accesses the template_default template folder when no override files are included in the custom template folder. Or should I just copy all relevant files from the responsive_classic folder (if they may be overridden) and place them in my custom template folder?

Thanks,

Kennith

[dbltoe]

When creating a custom template in the 1.5.# series, it's best to first decide whether you want or don't want responsive. You really do but some don't care.

If you want to be responsive, before making any changes to the packaged template, use lat9's clone a template to make a clone of the responsive_classic. That will give you all the responsive files you need PLUS, leaving the original responsive_classic pristine provides an excellent place to go when things get screwy. We sometimes create a clone at each major step of a new design. Sure makes it a lot easier to fix the "bumps in the night."

Likewise, if you do not wish to have responsive, then clone the template_default. Most search engines (SEs) will knock you down in rank without responsive.

[Kennith69]

When creating a custom template in the 1.5.# series, it's best to first decide whether you want or don't want responsive. You really do but some don't care.

If you want to be responsive, before making any changes to the packaged template, use lat9's clone a template to make a clone of the responsive_classic. That will give you all the responsive files you need PLUS, leaving the original responsive_classic pristine provides an excellent place to go when things get screwy. We sometimes create a clone at each major step of a new design. Sure makes it a lot easier to fix the "bumps in the night."

Likewise, if you do not wish to have responsive, then clone the template_default. Most search engines (SEs) will knock you down in rank without responsive.

dbltoe,

Thanks for this direction: It's most helpful. After first uploading ZC, I chose specifically to base my custom template on the responsive_classic template, but I followed the directions for creating a custom template at https://bit.ly/2pS9S21. The directions were clear, well written, and easy to follow, but they did give me the impression that I needed to move files into my custom template only when I intended to edit them as part of my custom template set-up. I did learn from this article to leave all the packaged ZC files alone, including the files in the packaged templates, so I still have all of the original ZC files in pristine states. The cloning process that you referred me to removed a whole brouhaha of confusion that I was slogging through. Live and learn.

Thanks again,

Kennith

[dbltoe]

That faq is excellent but written before responsive templates were included in Zen Cart.

The beauty of the clone a template mod is that you can clone AND delete a template. So, create custom templates with anything that helps you remember what was being done with the template at that time. Once you get everything where you want it, you can easily delete all the template files you don't need.

For example, if today's goal is to get the product listing correct for mobile, tablet, and desktop; I'd create a template clone of my current template (maybe called current) called prodListAll. I'd use the css and maybe a file to get the product listing like I wanted it. Then I'd update the template to current.

IOW
from current template - clone prodListAll
make all needed adjustments to stylesheets and files in prodListAll
delete current template
clone prodListAll to current
delete prodListAll

Now, I'm back to a current template that is working with all the changes made so far. I've still got one or two previous templates that I feel are necessary fall backs, including the original responsive_classic.