Results 1 to 7 of 7
  1. #1
    Join Date
    Jul 2007
    Location
    Chicago & Arkansas I split time LOL
    Posts
    149
    Plugin Contributions
    0

    Default Product Info Page What program controls the physical LAYOUT

    Hi All,

    I would like to change the configuration of my products info page.. I wish to center my attributes and have them line up with the the add to cart! I was playing with the TPL_PRODUCT_INFO program and was able to move the attributes up on the page below the main picture and this caused my add to cart to move down LOL. I also playes with the style sheet and seen that I can move the ADD TO CART anywhere but I have not found the place to adjust whree the attributes are located on the product info page. www.petesboots.com Anyone pointers would be great.

    Rich

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

    Default Re: Product Info Page What program controls the physiclal LAYOUT

    This is a combination of arranging the order in the tpl_product_info_display.php file and then using the css to finetune the alignment,

    The attributes tag is as follows and if you locate it in your style sheet or add it with this statement you will see that it moves it and there are many other things that you can add to modify the placement.
    Code:
    #productAttributes {
    float: right;
    }

  3. #3
    Join Date
    Jul 2007
    Location
    Chicago & Arkansas I split time LOL
    Posts
    149
    Plugin Contributions
    0

    Default Re: Product Info Page What program controls the physical LAYOUT

    Hi Cobra,
    Thanks for the reply. Yes I have moved things around on the tpl_product_info_display program the one thing I see right now is the box size that currently holds the attributes is to big and is forcing the Add to cart down a line.

    Attributes id = productAttributes
    Position
    Left: 158px Top: 546px
    Width: 843px Height: 130px
    Other
    Font Family: verdana,arial,helvetica,sans-serif
    Font Size: 10px
    Ancestors
    html
    body #productinfoBody
    div #mainWrapper
    table #contentMainWrapper
    tbody
    tr
    td
    div #productGeneral .centerColumn
    form
    Its goes from "columnone" all the way across the page? can I limit the size of this in the style sheet or am I not seeing that correctly. I moved the attributes moduel bekow the product details moduel is how it got to the state it is now? Your thoughts would be appreciated

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

    Default Re: Product Info Page What program controls the physical LAYOUT

    As I stated you can add many other valid settings to what I posted and to change the width try this adjusting as you want.
    Code:
    #productAttributes {
            float: right;
            width: 50%
            }
    You can obtain valid items at http://www.w3schools.com/ If you are unsure

  5. #5
    Join Date
    Jul 2007
    Location
    Chicago & Arkansas I split time LOL
    Posts
    149
    Plugin Contributions
    0

    Default Re: Product Info Page What program controls the physical LAYOUT

    Hi Cobra,
    After I made that post the other day I did go to the css site and looked at a bunch of examples for handleling text and objects. I was able to display it several diffrent ways! LOL I don't even know how I made some of them. I moved the attributes up and put them just below the product description info and before the add to cart info in the tpl_product_info_display.php program and then I adjusted the width again as you said. I can not figure out how it got to the right of the reviews and tell a friend buttons. I am trying to get it on the same line as the product description info that is just below the product image. I tried several diffrent combinations in the stylesheet to try and center the attribute and then have the add to cart to the right. I wanted it to have description, attributes and add to cart on one line from left to right with the reviews and tell a friend where they originally were one right and one left. I think my style sheet looks like a war zone

  6. #6
    Join Date
    Jul 2007
    Location
    Chicago & Arkansas I split time LOL
    Posts
    149
    Plugin Contributions
    0

    Default Re: Product Info Page What program controls the physical LAYOUT

    Kobra,

    I GOT IT I GOT IT

    www.petesboots.com

    I played with your % of the width and then I moved things around in the tpl_product_info_display program and it finally worked. thanks for the Help RICH

  7. #7
    Join Date
    Jul 2007
    Location
    Chicago & Arkansas I split time LOL
    Posts
    149
    Plugin Contributions
    0

    Default Re: Product Info Page What program controls the physical LAYOUT

    Ohhh and I had to add this to it as well

    #productDetailsList {

    float: left;

    width: 25%

    }

    I think it must have a default size that is very wide somewhere. It kept pushing things up or down and I never could get all 3 on one line until I added that. Again Thanks for the direction.

    Rich

 

 

Similar Threads

  1. How to layout the product info page from scratch? (anybody wanna help me???)
    By toomanyknots in forum Templates, Stylesheets, Page Layout
    Replies: 0
    Last Post: 20 Oct 2015, 06:00 AM
  2. what template controls the price display on the front page?
    By ian in forum Templates, Stylesheets, Page Layout
    Replies: 7
    Last Post: 25 Sep 2011, 12:38 PM
  3. which page controls the look of the product listings page?
    By what44 in forum Templates, Stylesheets, Page Layout
    Replies: 16
    Last Post: 29 Oct 2007, 10:09 AM
  4. Product Page? which page controls layout???
    By atracksler in forum Templates, Stylesheets, Page Layout
    Replies: 1
    Last Post: 10 Nov 2006, 06:24 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