Zen Cart Logo

Product Info Page

Views: 2,118

Results 1 to 20 of 28
4 Mar 2011, 3:59 AM
#1
jenesaisquoi avatar

jenesaisquoi

New Zenner

Join Date:
Mar 2011
Posts:
65
Plugin Contributions:
0

Product Info Page

How can I add an image to my product info page?

I don't mean an addtional product image; this image is my logo to be on all the product info pages on the right side of the product since their is a blank space there.

I'm using the latest version

4 Mar 2011, 4:36 AM
#2
rbarbour avatar

rbarbour

Totally Zenned

Join Date:
Feb 2010
Posts:
2,159
Plugin Contributions:
10

Re: Product Info Page

it would be added in your:
l/includes/templates/CUSTOM_TEMPLATE/templates/tpl_product_info_display.php file:

to pull your logo with a link to home page add:

<?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">' . zen_image($template->get_template_dir(HEADER_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT) . '</a>'; ?>

to pull just your logo add:

<?php echo zen_image($template->get_template_dir(HEADER_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT); ?>

hope this helps!

4 Mar 2011, 5:17 AM
#3
jenesaisquoi avatar

jenesaisquoi

New Zenner

Join Date:
Mar 2011
Posts:
65
Plugin Contributions:
0

Re: Product Info Page

Great, thanks for the reply.

I see my logo displayed underneath the product image, but I would like it to appear on the right side of the image. Also, the logo I want to display is not the same one as in my header, but it is located in my images folder.

4 Mar 2011, 5:39 AM
#4
rbarbour avatar

rbarbour

Totally Zenned

Join Date:
Feb 2010
Posts:
2,159
Plugin Contributions:
10

Re: Product Info Page

to pull an image from images/ with a link to home page add:

<a href="<?php echo HTTP_SERVER . DIR_WS_CATALOG ?>"><?php echo zen_image(DIR_WS_TEMPLATE.'images/YOUR_IMAGE'); ?></a>

to pull just an image add:

<img src="<?php echo DIR_WS_TEMPLATE  ?>images/YOUR_IMAGE" />

I will need a link to site to make suggestion on moving image to right.

4 Mar 2011, 5:52 AM
#6
rbarbour avatar

rbarbour

Totally Zenned

Join Date:
Feb 2010
Posts:
2,159
Plugin Contributions:
10

Re: Product Info Page

1st. Wrap the following around the code for the image:

<!--bof Product Info MyImage--> <div class="productInfoMyImage"> </div> <!--eof Product Info MyImage-->
4 Mar 2011, 6:13 AM
#7
jenesaisquoi avatar

jenesaisquoi

New Zenner

Join Date:
Mar 2011
Posts:
65
Plugin Contributions:
0

Re: Product Info Page

Ok...I'm not sure what you mean by "wrap it around".

The url code for my image should go in the middle?

4 Mar 2011, 6:15 AM
#8
rbarbour avatar

rbarbour

Totally Zenned

Join Date:
Feb 2010
Posts:
2,159
Plugin Contributions:
10

Re: Product Info Page

<!--bof Product Info MyImage--> <div class="productInfoMyImage"> <img src="<?php echo DIR_WS_TEMPLATE ?>images/YOUR_IMAGE" /> </div> <!--eof Product Info MyImage-->
4 Mar 2011, 6:42 AM
#10
rbarbour avatar

rbarbour

Totally Zenned

Join Date:
Feb 2010
Posts:
2,159
Plugin Contributions:
10

Re: Product Info Page

wow, ok - need to trim the whitespace around actual image.

I see where you are going with this, really cool ideal but have to trim image down. I trimmed it, I sending it to you in a pm. upload it to replace current. I didn't change or alter just trimmed the white space.

4 Mar 2011, 6:53 AM
#11
jenesaisquoi avatar

jenesaisquoi

New Zenner

Join Date:
Mar 2011
Posts:
65
Plugin Contributions:
0

Re: Product Info Page

Thanks a lot.

It's a lot closer to the product now than before which is awesome but i'd still like it to be beside the dvd--if possible.

Can we use a float right or something like that on the image?

4 Mar 2011, 7:01 AM
#12
jenesaisquoi avatar

jenesaisquoi

New Zenner

Join Date:
Mar 2011
Posts:
65
Plugin Contributions:
0

Re: Product Info Page

Thanks a lot.

It's a lot closer to the product now than before which is awesome but i'd still like it to be beside the dvd--if possible.

Can I set the image to float right or something like that?

4 Mar 2011, 7:17 AM
#13
rbarbour avatar

rbarbour

Totally Zenned

Join Date:
Feb 2010
Posts:
2,159
Plugin Contributions:
10

Re: Product Info Page

in the beginning before I saw the image that is what I was going to do.

try this tell me what you think, will have to make logo image or prod image a little smaller tho.

in your stylesheet file:
find this:

/*.content,*/ #productDescription, .shippingEstimatorWrapper {
	/*font-size: 1.2em;*/
	padding: 0.5em;
	}

change to:

/*.content,*/ .shippingEstimatorWrapper {
	/*font-size: 1.2em;*/
	padding: 0.5em;
	}

and add this:

#productDescription {
padding: 9.0em 0.0em 0.0em 0.0em;
background-image:url(../zencart/includes/templates/custom/images/thespecs.jpg);
background-repeat:no-repeat;
background-position:right top;
height:300px;
}
4 Mar 2011, 7:47 AM
#14
jenesaisquoi avatar

jenesaisquoi

New Zenner

Join Date:
Mar 2011
Posts:
65
Plugin Contributions:
0

Re: Product Info Page

Hmm.. it didn't seem to do anything.

4 Mar 2011, 7:53 AM
#15
rbarbour avatar

rbarbour

Totally Zenned

Join Date:
Feb 2010
Posts:
2,159
Plugin Contributions:
10

Re: Product Info Page

it did, I am getting an error when I right click where the image should be. check to make sure the path is correct in your css file

it pulling image from /zencart/includes/templates/custom/zencart/includes/templates/custom/images/thespecs.jpg

so change image path to /images/thespecs.jpg

also at the end of your css file:
#seShipTo {
padding: 0.2em;
}
} <----------------Remove this

also check pm for new image

4 Mar 2011, 8:00 AM
#16
haredo avatar

haredo

Totally Zenned

Join Date:
Apr 2006
Location:
Texas
Posts:
6,180
Plugin Contributions:
0

Re: Product Info Page

@rb,
Use this for the correct path:

background-image:url(../images/thespecs.jpg);

4 Mar 2011, 8:03 AM
#17
jenesaisquoi avatar

jenesaisquoi

New Zenner

Join Date:
Mar 2011
Posts:
65
Plugin Contributions:
0

Re: Product Info Page

Nice:D

Now how do I remove the extra one

4 Mar 2011, 8:05 AM
#18
rbarbour avatar

rbarbour

Totally Zenned

Join Date:
Feb 2010
Posts:
2,159
Plugin Contributions:
10

Re: Product Info Page

if you like that look we can get rid of the coding in your tpl_product_info_display.php, i also uploaded a smaller image, use the same link as before.

& thank you haredo

4 Mar 2011, 8:19 AM
#19
jenesaisquoi avatar

jenesaisquoi

New Zenner

Join Date:
Mar 2011
Posts:
65
Plugin Contributions:
0

Re: Product Info Page

I like this look, and the smaller file I noticed is a bit blurry. It seems the more resizing that's done the blurry it gets.

What file should i be deleting from tpl_product_info_display.php

4 Mar 2011, 8:20 AM
#20
jenesaisquoi avatar

jenesaisquoi

New Zenner

Join Date:
Mar 2011
Posts:
65
Plugin Contributions:
0

Re: Product Info Page

the one i added earlier, i assume