Home » Forums » Ubercart » Support

Help: Modify Product Page

Submitted by jasonruyle on Thu, 01/31/2008 - 15:21
jasonruyle

Posts: 78
 Joined: 01/18/2008

I've searched around a little bit for an answer, but didn't' find anything. I figured I would post here for help.

I need to modify my product pages and how they are displayed. I'm comfortable with html/php/css, but am relatively new to drupal. I'm porting over a website from Joomla to Drupal, all because of Ubercart.

Our current product pages look like this:
http://www.magicbutter.com/animal_face.html

My drupal installation looks like this:
http://beta.magicbutter.com/store/animal-face

I'm not sure where I make modifications to the core code. I would prefer to do everything through CSS, but realized that my first image needs to be full size, not thumbnail. Also, when you click the full size image, I would like the second thumbnail image to popup as the primary image.

It doesn't seem like a huge stretch. I guess I need to know, do I have to modify a core piece of code and which file is it?
permalink #1 Thu, 01/31/2008 - 15:50
kcoworks
Posts: 46
 Joined: 11/22/2007

You shouldn't need to get to the core code. If you create a node-product.tpl.php, drupal will use that. It's for every node-CONTENTTYPE.tpl.php, so if you create other product classes, you need node-CLASS.tpl.php

The image setting is done through the imagecache administration. I broke down most of the other things to this (on my node-product.tpl.php):

echo "nid: ".$node->nid."";
echo "title: ".$node->title."";
echo "sell_price: ".$node->sell_price."";
echo "list_price: ".$node->list_price."";
echo "number of comments (string): ".$node->comment_count."";
echo "recupel:".$node->field_recupel[0]['value'].""; // this is a CCK field
echo "taxonomy: ";
foreach ($node->taxonomy as $tid=>$obj){
echo "$tid: ".$obj->name.""; // you can create links with this
}
echo "image:".$node->content['image']['#value']."";
echo "body:".$node->content['body']['#value']."";
echo "cartlink:".$node->content['add_to_cart']["#value"]."";
echo "rating:".$node->content["fivestar_widget"]["#value"].""; // using the drupal fivestar module
echo "links: ";
#var_dump($node->links);
echo $node->links['forward_links']['title'].": ".url($node->links['forward_links']['href']).""; // using the drupal forward module
echo $node->links['comment_add']['title'].": ".url($node->links['comment_add']['href']).""; // link to add comment.

if you use php's var_dump() or var_export(), you can get most of what you need right there...
I hope this gets you going!

permalink #2 Thu, 01/31/2008 - 15:54
TR
Posts: 924
 Joined: 11/05/2007
Bug FinderFAQ ModeratorGetting busy with the Ubercode.

Can do this via node-product.tpl.php in your theme. Go to your theme directory and copy node.tpl.php to node-product.tpl.php, then somewhere in there insert

<?php
echo '<pre>', print_r($node), '</pre>'
?>
so the next time you view a product you will be able to see all the variables available to you. Then, modify the markup in node-product.tpl.php to display the contents of these variables how you want, where you want. Also make a file uc_styles.css where you can override styles and include that in the header inside page.tpl.php

More info at http://drupal.org/phptemplate

--

<tr>.

permalink #3 Thu, 01/31/2008 - 17:51
jasonruyle

Posts: 78
 Joined: 01/18/2008

Wow, I would have hacked this thing to little bits. I'm going to read through more of the handbooks for drupal. I've glanced over them several times, but I missed a lot of stuff.

I have one more question regarding ubercart. In my previous cart I have a related/recommended modules (joomla). Is this possible in Ubercart. Not only on my products pages, but as a block? Is this going to require custom php on my end? If its not specifically "related", how might I go about doing it randomly?

Do I need to call the database when I'm not in a product/cart type page or can I use the array information?

I'll post anything I get and/or figure out for others looking for similar looks/styles.

Addition: I'm trying to call a specific image from one of my arrays.

    [field_image_cache] => Array
        (
            [0] => Array
                (
                    [fid] => 17
                    [title] =>
                    [alt] =>
                    [nid] => 73
                    [filename] => animalfacelarge.jpg
                    [filepath] => files/animalfacelarge.jpg
                    [filemime] => image/jpeg
                    [filesize] => 174731
                )

            [1] => Array
                (
                    [fid] => 49
                    [title] =>
                    [alt] =>
                    [nid] => 73
                    [filename] => animalface.jpg
                    [filepath] => files/animalface.jpg
                    [filemime] => image/jpeg
                    [filesize] => 59913
                )

        )

I want to display the first image as full size and have my a href link around it to the second image. I tried to pull the php from the uc_product area, but it did not work. I also tried transforming the taxanomy example from above to call my images intead, but was only given 0, 1.

permalink #4 Thu, 01/31/2008 - 18:46
agilpwc
Posts: 73
 Joined: 12/10/2007

I been really happy with the http://drupal.org/project/relatedlinks Related Links module for doing both products that I say are related and it also has a separate 'discovery' mode with tons of settings to fine tune what is considered related.

permalink #5 Thu, 01/31/2008 - 18:51
jasonruyle

Posts: 78
 Joined: 01/18/2008

Thank you. I will most likely use this product.

I wanted to update the forum with my image code from the arrays.

<?php
$imagePath = $node->field_image_cache['0']['filepath'];
$imageBox = $node->field_image_cache['1']['filepath'];
echo "<a class=\"thickbox\" href=\"http://beta.magicbutter.com/$imageBox\">\n";
echo "<img src=\"http://beta.magicbutter.com/$imagePath\" />\n";
echo "</a>\n";
?>

This picks from my cached images specified above and then uses the 0 image as my main one and the 1 image as my thickbox popup.

Most important for myself, I figured out how to call arrays.