Results 1 to 9 of 9
  1. #1
    Join Date
    Nov 2014
    Location
    United States
    Posts
    2
    Plugin Contributions
    0

    Default Products no longer align in a straight row across

    I'm using Zen Cart version 1.5.1 and PHP Version 5.6.27.

    I didn't make any changes on my end that I remember, but for quite some time now I've noticed my product rows not aligning properly. Here's an example:

    http://www.ritualmagick.net/shopcart...ex&cPath=48_50

    I've tried both Chrome and Edge and neither display properly. Did something change with how the browsers display my zen cart products?

    Thank you for any help you can offer.

  2. #2
    Join Date
    Jul 2012
    Posts
    15,913
    Plugin Contributions
    17

    Default Re: Products no longer align in a straight row across

    So the biggest "problem" I see related to the product alignment is that of the 15 items displayed, one of them has an image that is basically horizontal as compared to the others being vertical. This caused the clickable text for that one product to move up though it did not significantly modify the overall display.

    It seems that if that one picture were rotated then all things would "properly" align. Or perhaps there is some css minimums to apply or many other options to ensure uniformity. I wouldn't say though that the issue displayed at the above link is some sort of systemic change or action.

    In fact at least on my mobile browser I wouldn't have even really considered there to be an issue on that page except that there was one claimed to be there. And actually if anything, to me, the unusual number of product in the selection list was more of an issue as it wasn't just as many would fit across a row for the first page. Sure if there was a second page, that's what remains going forwards, but there are place holders for at least 16 product and only 15 are displayed. That is the kind of situation that gets me asking questions.
    ZC Installation/Maintenance Support <- Site
    Contribution for contributions welcome...

  3. #3
    Join Date
    Jan 2004
    Location
    N of San Antonio TX
    Posts
    8,012
    Plugin Contributions
    9

    Default Re: Products no longer align in a straight row across

    It's not a complete fix but...

    As MC# pointed out, a mix of Portrait (vertical) and Landscape (horizontal) images is the real cause of the misalignment. When we have this mix, the display needs to be more "flexible". Not only that, it needs to know how we want it to be flexible.

    Without doing a whole lot to the files, you can simply add the following to your stylesheet.css for the site.

    We recommend that you add stylesheet_zcustom.css if you won't already have it. You can put the code there, it will load last, and it will keep all your changes made to the site for later reference/upgrade.

    Code:
    div#productListing {    display: flex;
        flex-flow: row wrap;
        justify-content:space-evenly;
    }
    You will see a shift of the first and last rows but, everything will be lined up.

    Note: You have many other more pressing problems with the site. Not the least is that it is not secure even at log in.

  4. #4
    Join Date
    Feb 2006
    Location
    Tampa Bay, Florida
    Posts
    7,857
    Plugin Contributions
    108

    Default Re: Products no longer align in a straight row across

    Quote Originally Posted by hotdeals View Post
    I'm using Zen Cart version 1.5.1 and PHP Version 5.6.27.
    Time to upgrade! Your site doesn't work on a mobile device and is using an obsolete and insecure version of PHP.
    That Software Guy. My Store: Zen Cart Modifications
    Available for hire - See my ad in Services
    Plugin Moderator, Documentation Curator, Chief Cook and Bottle-Washer.

  5. #5
    Join Date
    Dec 2013
    Location
    Adelaide, South Australia
    Posts
    18
    Plugin Contributions
    0

    Default Re: Products no longer align in a straight row across

    Hi All. :)

    Just a quick question with the default search result listing.

    I have changed the New, and All formatting via the Admin interface, but couldn't find where to format the default search results?

    Does this require changing core templates or can I create a custom template over-ride or an edit to existing CSS files?

    If so what templates would need to be clones in the over-ride folders?

    The image below show the formatting I am trying to achieve.

    Thank you in advance for any hints, tips and direction. :)

    Name:  default-search-result-listi.jpg
Views: 64
Size:  21.9 KB
    Last edited by webmanstudios; 8 Jun 2021 at 10:36 AM. Reason: Correcting Typos! :)

  6. #6
    Join Date
    Mar 2008
    Location
    Belgium
    Posts
    88
    Plugin Contributions
    6

    Default Re: Products no longer align in a straight row across

    @webmanstudios

    https://docs.zen-cart.com/user/templ...configuration/

    Looks like you gave everything a starting number of 1
    Change all from 1XXX to 2XXX except for product image.

  7. #7
    Join Date
    Mar 2008
    Location
    Belgium
    Posts
    88
    Plugin Contributions
    6

    Default Re: Products no longer align in a straight row across

    @hotdeals

    http://www.ritualmagick.net/shopcart...index&cPath=46 has the same problem and the first line has all square pictures.

    I suspect that you're trying to cram 5 products in a space for only 4. You can't display foot long sausages on 10 inch trays!

    Admin > Configuration > Product Listing > Columns Per Row
    My guess is it is on 5. You should set to 4 or less.

    And as you're already advised, update! Both your Zen Cart and PHP-version. 1.5.7c has also a mobile friendly template. Customize it with your own background and colours. Many people these days have their phone conjoint to their hand.

  8. #8
    Join Date
    Nov 2014
    Location
    United States
    Posts
    2
    Plugin Contributions
    0

    Default Re: Products no longer align in a straight row across

    Sorry for the delay in getting back to you all.

    @mc12345678
    This sounded like it could be the problem. As a test, I marked the 2 items with horizontal pictures as out of stock, so they wouldn't display in the list. It definitely helped the alignment issue, but the bottom picture was still misaligned, even though they were all vertical images.

    @dbltoe
    Thank you so much for the code. I added it as stylesheet_zcustom.css as you suggested. It also helped with the alignment issues, but the bottom row pictures were still all offset strangely. Yes, I hope to upgrade to SSL eventually, but for now, all payments are done through PayPal, which is completely secure for my customers.

    @swguy
    Thank you. I do hope to upgrade when I have some time to do so.

    @Philibel
    I was SO HOPING it would be this simple. I checked that setting, and it is set at 4, not 5. Thank you though for your suggestion... that would have been wonderful if it was just a simple setting like that. Thank you for the advice of upgrading so it'll be mobile friendly. I definitely hope to do this eventually, when I have time.

    As a work around for now, I've gone ahead and changed the layout style from columns to rows. This at least displays everything neatly for now. Thank you again to everyone who tried to help me with this. I really appreciate all the suggestions and help!

  9. #9
    Join Date
    Jan 2004
    Location
    N of San Antonio TX
    Posts
    8,012
    Plugin Contributions
    9

    Default Re: Products no longer align in a straight row across

    Quote Originally Posted by hotdeals View Post
    @dbltoe
    Thank you so much for the code. I added it as stylesheet_zcustom.css as you suggested. It also helped with the alignment issues, but the bottom row pictures were still all offset strangely. Yes, I hope to upgrade to SSL eventually, but for now, all payments are done through PayPal, which is completely secure for my customers.
    What I provided was a first step. Not the final solution.

    And, respectfully, your thinking that using PayPal will stop browsers from informing your customers that your site is insecure is sorely inaccurate.

    As a minimum, customers will see the Not Secure in red letters next to the address bar. If you have any download links on the page, the browser may even deny access to the site.

    And, as if that wasn't enough, the Search Engines will drop your rank like a hot potato. You'll need a really special spell to recover from that.

    There are perfectly capable (and free) SSL certs out there. It should be item number one on your shopping list.

    Number two - a proper responsive template.

 

 

Similar Threads

  1. align 3 drop down attributes across the page horizontally
    By RonGin in forum Templates, Stylesheets, Page Layout
    Replies: 10
    Last Post: 4 Feb 2015, 06:25 PM
  2. Display 2 subcategories across and 3 products across per subcatagory
    By unclemantis in forum Templates, Stylesheets, Page Layout
    Replies: 1
    Last Post: 13 Sep 2009, 07:52 AM
  3. Align - Attributes and additional images in row
    By aussieny in forum Templates, Stylesheets, Page Layout
    Replies: 0
    Last Post: 28 Apr 2009, 03:40 AM
  4. How to Align Product attributes across instead of in rows
    By zoolo in forum Templates, Stylesheets, Page Layout
    Replies: 4
    Last Post: 2 Feb 2009, 06:34 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
disjunctive-egg
Zen-Cart, Internet Selling Services, Klamath Falls, OR