Four across on main page either catagories or products on slow site.

[phlipper]

Hello

Site has been recently 'upgraded' now contractor has been paid - he is AWOL!

here is a link to the layout listing problem: http://www.kwmagic.com/index.php?mai...&cPath=604_366

as you can see i would like to get 4 or more catagories or products across the main area to fill in the blank space on the right. - for the life of me I CANNOT find the stylesheet where I would change this. alterternatively I could make the default view as LIST view not grid, however I have not been able to find how to do this either. So after 8 hours I broke down and posted here

Contractor installed something called bootstrap, could this be slowing down my site? some of the additions are not coded with explanations, so it is further causing me difficutly. I called bluehost about the slow site, they said too many slow sql queries is the cause - I read several articles and followed some repair and optimization steps, but site is still slow when changing catagories, any suggestions would be appreciated.

Thank-you for your time, any help appreciated. I know I put three problems in one post, however if anyone can put me on the right track to get one of the fixed I would be grateful.

p.

[phlipper]

after some playing around it looks like the maximum catagories per row is one off, I had it set to 4 but only 3 were showing. I set it to 5 and 4 show, then 6 and now 6 show!

So one of these problems is fixed (sort of).

[gjh42]

I had it set to 4 but only 3 were showing. I set it to 5 and 4 show, then 6 and now 6 show!

Four and five both divide evenly into 100, so each item would be exactly 25% or 20% leaving no room for your 5px horizontal padding:
stylesheet_style_evoluzion.css, line 101:

.list-inner {
    padding: 0px 5px;
}

The padding is added to the item width and makes it wider than intended, pushing the last item to the next row. Six across gives a loose fit and lets the padding space the items.

You could override the inline styling with (for 4 across)

.list-inner {
    width: 24% !important;
    padding: 0px 5px;
}

[gjh42]

I also observe that your contractor installed a javascript categories menu which is invisible if you do not have javascript enabled in your browser. This is bad practice, to unnecessarily force users to enable js or push them off your site if they can't. The cool slide-out menu can now be replicated with CSS and no javascript for all modern browsers, and older browsers will work but just not have so many fancy effects.

[phlipper]

Thank-you, that makes sense now, and I appreciate you giving me the file to look at, I am learning.

I installed the slide out menu last night as the one that the contrator had installed did not update the main body of the page with the catagories, I actually had a customer call me and complain that she could not see any products on our site, some of this had to do with the very slow updating when you finally drill down to the lowest sub catagory - only at that point did the main page update.

The menu I installed is the the vertical multilevel slideout menu from the add-in section of this site, when i tested it updated the center section with the catagories when clicking on any level, was this a mistake on my part?

Thank-you for your advice on this.

Phil

[phlipper]

I have been reading this morning more on this, it seems I am supposed to have an option for number of columns under config>product listing, but it is not there so currently my product listings are only 3 across, this option seems to be MIA. Before I go and install another addin - is this normal?

[gjh42]

The standard Column Layout Grid mod from Plugins (and others based on it) will give the admin option for number of columns, but I see that what you have is quite customized in its internal listing output to give more detailed styling control, and might not even have that admin option. Or, the SQL for it was not run properly and it is missing a setting and defaulting to the mod standard three products per row. That is something we can't tell from view source.

The function of the slide-out menu is fine, *as long as you have javascript*. There is inline styling to hide the menu totally until javascript operates on it, and that is bad practice. The basic critical navigation functions should not depend solely on an optional technology; there should be a fallback to some useable state. Mods in Plugins are checked for safety and compliance with rules, but not for best coding practice, so not everything there is really optimal to use.

I also noticed that some of the links were broken, not leading anywhere useful but only back to the homepage. I'll check for more detail on this if you want.

[phlipper]

Thank-you Glenn, for the advice and spending the time to look at this, it is very much appreciated.

I did not realize that the menu I installed last night was Java Script dependant, I will look for other alternatives, unfortuantely my programming skills are minimal, and like I said my programmer has disappeared - I hope he is okay, last time he said his village flooded.

Yes, I think the template was heavily modified, I could go back to the old menu system, however it does not allow the catagories to open until a customer has drilled down to the lowest level of a catagory, making the site not very user friendly.

Once again - thank-you for your time, I am open to ideas - I have to get this site up to snuff, but finding a decent programmer has been challenging, I have wasted a lot of money on Odesk, and I am currently trying to learn more about stylesheets and the structure to be able to handle some of the basics myself.

[gjh42]

The CSS Flyout Menu in Plugins does the same expansion (without the sliding effect) and is compatible with all conditions. It can be styled however you like. Categories Dressing can also be set up as a flyout, though it's probably overkill unless you want some other features it can do. Modern CSS3 techniques can give nice fade-in or probably slide-out effects for up-to-date browsers while still working correctly for older ones.