Product Image & Description Position!!

[gjh42]

Red - This would basically be a matter of editing tpl_product_info_display.php, moving the code block marked with
<!--bof Additional Product Images -->
to above the product main image code

and in your stylesheet, styling the container
#productAdditionalImages {}
and the individual images
.additionalImages {}

[Redcinamn]

Is there a specific way I need to style the css to get the images there ? I am new to CSS and have played with it quite a bit but Im not knowledgeable enough to know off hand what to add?
~Red

[gjh42]

Try something like this:

#productAdditionalImages {
    width: 200px;
    float: left;
    clear: left;
    }

.additionalImages {width: 198px;}

Lots of other possibilities...

If #productMainImage has a clear: whatever; on it, you will need to remove that to get it on the same line as the additional images.

[Redcinamn]

Thank you at least that starts me off in the right direction!!!!
You have been so helpful I greatly appreciate it as I have jumped into a redesign on this cart and picking up pieces it seems.

Maybe you have some insight to another question I posted?


I am having an issue with the alignment of my products on the category pages: See here: http://www.tylerandtallulah.com/shop...mmer-2009-c-15

or here

http://www.tylerandtallulah.com/shop/val-max-c-147




If screen shot needed I can post.

Is there a file I need to edit to correct this problem?

It does not seem to like that I have two rows of text, as when added on any one line the shifting seems to begin.

1.3.8
Using columnar layout

[gjh42]

The alignment is different because cells in the top row of the table display are defined in the code as <th> instead of <td>, and the styling is different for heading elements. Add to your stylesheet

#productListing th {vertical-align: top;}


Ideally, the code should account for displays with actual headings and displays without, but you don't need to get into that.

[Redcinamn]

Awesome!! It seems to have worked for some pages put for page like this: http://www.tylerandtallulah.com/shop...tops-c-129_130

it is still off is there somewhere else I need to apply this bit as well?

Thanks!

[Redcinamn]

AHH!!! I took your direction and fixed it myself!

I added this as well :


#productListing td {vertical-align: top;}

and it seemed to force the other problem pages to the top as well.

You are a life saver we wont even go into how long I worked on this before you answered..lol


Thanks so much!!!

[Redcinamn]

Red - This would basically be a matter of editing tpl_product_info_display.php, moving the code block marked with
<!--bof Additional Product Images -->
to above the product main image code

and in your stylesheet, styling the container
#productAdditionalImages {}
and the individual images
.additionalImages {}

Hmm Did this but everything pushed right and the thumbnails lined horizontally.

This is the look I am(or client is) trying to achieve maybe that will help?

http://www.melijoe.com/63719-silhoue...wing-city.html

Also maybe there is a add on for this and I am just looking for the wrong name?



~Red

[gjh42]

Did this but everything pushed right and the thumbnails lined horizontally.

What styling did you use?

There are mods for the product info layout, but I don't think any of them have additional images to the left of the main image. You're probably just as well working from what you have.

[Redcinamn]

he pasted in this as above:


#productAdditionalImages {
width: 200px;
float: left;
clear: left;
}

.additionalImages {width: 198px;}

Red - This would basically be a matter of editing tpl_product_info_display.php, moving the code block marked with
<!--bof Additional Product Images -->
to above the product main image code