Thread: Products Layout

Results 1 to 9 of 9

Hybrid View

  1. #1
    Join Date
    Nov 2006
    Location
    Dartmouth, NS Canada
    Posts
    2,378
    Plugin Contributions
    0

    Default Re: Products Layout

    Quote Originally Posted by jwitt98 View Post
    ... However, If you want every other row to be staggered like in your screen shot, that will take a bit more work and some php code editing. Basically you will need the php code to generate 2 separate class selectors assigned to every other div. Hope you have enough php knowledge because this can become tricky.
    And then assign some style for example:
    .div1 img {
    float: right;
    border-left: 2px solid brown;
    }
    .div2 img {
    float: left;
    border-right: 2px solid brown;
    }
    Actually the Zen Cart code already contains classes for doing this. They're not in the stylesheet, but there's lots of classes that are not in the stylesheet but ready for use in the code if you need them. So add these two elements to your stylesheet.css and edit as suggested above.

    .productListing-odd { }
    .productListing-even { }

    I use them for setting an alternate colour for each row, but I'm going to look into doing something similar to what you're trying to do. I like that look a lot.

    Rob

  2. #2
    Join Date
    Sep 2008
    Location
    Cleethorpes
    Posts
    1,229
    Plugin Contributions
    6

    red flag Re: Products Layout

    Quote Originally Posted by rstevenson View Post
    Actually the Zen Cart code already contains classes for doing this. They're not in the stylesheet, but there's lots of classes that are not in the stylesheet but ready for use in the code if you need them. So add these two elements to your stylesheet.css and edit as suggested above.

    .productListing-odd { }
    .productListing-even { }

    I use them for setting an alternate colour for each row, but I'm going to look into doing something similar to what you're trying to do. I like that look a lot.

    Rob
    Go for it Rob, I'd already worked out the classes and have managed to do this anyway. The bit I'm struggling with is the actual layouts of the product listings. Not so much the background of them.

    Thanks Though

    Nick

  3. #3
    Join Date
    Feb 2009
    Posts
    95
    Plugin Contributions
    0

    Default Re: Products Layout

    Nick,
    Please ignore what I said in my first post.
    I was thinking you were referring to the products listings on the main page, shopping cart page etc. where the featured products, new products etc. are listed. Those are laid out using divs and css.

    It's obvious to me now that you are trying to change the layout of the actual products listing page. That page is laid out using tables.

    Sorry, my bad. I should have read your post more clearly. What the others are saying seems to be the route to go.

 

 

Similar Threads

  1. Replies: 2
    Last Post: 23 Mar 2012, 03:28 PM
  2. change search results layout and all products layout
    By gfcordnance in forum Templates, Stylesheets, Page Layout
    Replies: 3
    Last Post: 1 Mar 2010, 04:50 AM
  3. Change Category Page Layout to New Products Layout
    By tonemap in forum Templates, Stylesheets, Page Layout
    Replies: 1
    Last Post: 22 Jan 2010, 11:30 PM
  4. Major issues with Column Layout / Grid Layout for Products Listing
    By kinget in forum All Other Contributions/Addons
    Replies: 5
    Last Post: 27 Jul 2007, 10:11 PM
  5. New Products Layout vs. Product Listing layout
    By tcschmit in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 25 Apr 2007, 05:07 PM

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