Results 1 to 5 of 5
  1. #1
    Join Date
    Dec 2012
    Posts
    11
    Plugin Contributions
    0

    Default Can I change the width of the product list columns? Using blue_r theme

    Hi I am trying to change the width of the product list columns, product image, item name and price. I am using the blue_ r theme and zencart version 1.5.5. So far I have tried to change the price column from the admin panel from 125 to 25px but this had no effect on the column but did show in the html using firebug. Firebug also shows

    <div id="productListing">
    <div id="productsListingTopNumber" class="navSplitPagesResult back">
    <div id="productsListingListingTopLinks" class="navSplitPagesLinks forward"> </div>
    <br class="clearBoth">
    <table id="cat65Table" class="tabTable">
    <tbody>
    <tr class="productListing-rowheading">
    <th id="listCell0-0" class="productListing-heading" align="center" scope="col">Product Image</th>
    <th id="listCell0-1" class="productListing-heading" scope="col">
    <th id="listCell0-2" class="productListing-heading" width="25" align="right" scope="col">

    so i tried adding

    #listCell0-1 { width: 30%; }
    #listCell0-2 {width: 50%;}
    #listCell0-3 {width: 20%;}
    and different combinations there of to the stylesheet.css for my theme this had no effect either. Developer tools search could not find any reference to listcell0 at all.

    Can anyone tell me how to change these widths or at least what file defines listcell0

    Link to one of the pages in question
    http://www.pappyjames.com/shop/index...index&cPath=65

    Thanks in advance
    Freecat

  2. #2
    Join Date
    Feb 2010
    Posts
    2,159
    Plugin Contributions
    17

    Default Re: Can I change the width of the product list columns? Using blue_r theme

    This is a table and the cells will only shrink down till the content in the cells don't allow them to anymore.

    Plus the width's of the cells have a CSS rule applied in the stylesheet

    Code:
    #listCell0-1 {
            width: 30%;
            }
    #listCell0-2 {
            width: 50%;
            }
    #listCell0-3 {
            width: 20%;
            }
    Quote Originally Posted by freecat View Post
    Hi I am trying to change the width of the product list columns, product image, item name and price. I am using the blue_ r theme and zencart version 1.5.5. So far I have tried to change the price column from the admin panel from 125 to 25px but this had no effect on the column but did show in the html using firebug. Firebug also shows

    <div id="productListing">
    <div id="productsListingTopNumber" class="navSplitPagesResult back">
    <div id="productsListingListingTopLinks" class="navSplitPagesLinks forward"> </div>
    <br class="clearBoth">
    <table id="cat65Table" class="tabTable">
    <tbody>
    <tr class="productListing-rowheading">
    <th id="listCell0-0" class="productListing-heading" align="center" scope="col">Product Image</th>
    <th id="listCell0-1" class="productListing-heading" scope="col">
    <th id="listCell0-2" class="productListing-heading" width="25" align="right" scope="col">

    so i tried adding

    #listCell0-1 { width: 30%; }
    #listCell0-2 {width: 50%;}
    #listCell0-3 {width: 20%;}
    and different combinations there of to the stylesheet.css for my theme this had no effect either. Developer tools search could not find any reference to listcell0 at all.

    Can anyone tell me how to change these widths or at least what file defines listcell0

    Link to one of the pages in question
    http://www.pappyjames.com/shop/index...index&cPath=65

    Thanks in advance
    Freecat

  3. #3
    Join Date
    Dec 2012
    Posts
    11
    Plugin Contributions
    0

    Default Re: Can I change the width of the product list columns? Using blue_r theme

    I finally got things working for PC browsers (had to define the width of the add to cart button) but still can not figure out where to add
    #listCell0-0 {width:30%;}
    #listCell0-1 {width:50%;}
    #listCell0-2 {width:20%;}
    for mobile devices since the developer tools are no help
    Any ideas on where to look
    template is blue-r
    Thanks

  4. #4
    Join Date
    Aug 2005
    Location
    Arizona
    Posts
    27,755
    Plugin Contributions
    9

    Default Re: Can I change the width of the product list columns? Using blue_r theme

    for mobile devices since the developer tools are no help
    Where did you get the template "blue_r"
    You have no responsive css files and your template is not responsive
    Zen-Venom Get Bitten

  5. #5
    Join Date
    Dec 2012
    Posts
    11
    Plugin Contributions
    0

    Default Re: Can I change the width of the product list columns? Using blue_r theme

    The template is this one https://www.zen-cart.com/downloads.php?do=file&id=1893 I posted the template folder name not the "official" template name sorry about that. I did get the problem fixed however by adding

    @media only screen
    and (min-device-width : 320px)
    and (max-device-width : 480px) {
    #listCell0-0 {width:50%;}
    #listCell0-1 {width:30%;}
    #listCell0-2 {width:20%;}
    }

    To the main style sheet now everything is working on PC, tablet and mobile
    Thanks for the help everyone

 

 

Similar Threads

  1. v150 How can I increase the width of the display so my text area has more width.
    By westdh in forum Templates, Stylesheets, Page Layout
    Replies: 1
    Last Post: 28 Aug 2012, 12:50 PM
  2. How can I change the width where all the products are listed?
    By sharontan in forum Setting Up Categories, Products, Attributes
    Replies: 15
    Last Post: 20 Nov 2010, 03:53 PM
  3. change the 'Sort By' drop down menu that appears at the top of the product list page?
    By autoace in forum Templates, Stylesheets, Page Layout
    Replies: 6
    Last Post: 26 Sep 2009, 03:41 AM
  4. How can I change the product list style?
    By waterlin in forum Setting Up Categories, Products, Attributes
    Replies: 0
    Last Post: 20 Mar 2009, 10:07 AM
  5. Using a Dropdown List to Sort the Product List
    By innovafire in forum General Questions
    Replies: 2
    Last Post: 29 Feb 2008, 09:29 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