180 replies [Last post]
Ryan's picture
Offline
Joined: 08/07/2007
Juice: 15476
NecroHill wrote:Im using
NecroHill wrote:

Im using thickbox and this doesn't work for me. This is why I'm asking about the "core" layout.

What you're looking for doesn't exist yet. It wasn't possible to ship .tpl.php files with modules in Drupal 5, but it is in Drupal 6. This is one thing we plan to update during Drupal 6 development.

seutje's picture
Offline
Joined: 05/15/2008
Juice: 36
Ryan wrote:NecroHill
Ryan wrote:
NecroHill wrote:

Im using thickbox and this doesn't work for me. This is why I'm asking about the "core" layout.

What you're looking for doesn't exist yet. It wasn't possible to ship .tpl.php files with modules in Drupal 5, but it is in Drupal 6. This is one thing we plan to update during Drupal 6 development.

awesomeness!! guess it's starting to be about time that I update to D6 :$

mach5_kel's picture
Offline
Joined: 03/25/2008
Juice: 79
Using Tabs

Ive posted a little guide to making/ using your own tabs on node-product.tpl.php

http://www.ubercart.org/forum/theming_and_design/6373/here_are_some_prod...

I hope to post my next mini guide soon. Check it out.

fossie@drupal.org's picture
Offline
Joined: 11/20/2007
Juice: 48
Regarding to the images: if

Regarding to the images:

if you use:

<?php
$imagePath
= $node->field_image_cache['0']['filepath'];?>

<div id="image"><img src="/files/imagecache/product/<?php print $imagePath; ?>" alt="Title"></div>

and there is no image, no image is display at all and there will be the image not found symbol.

While using the foreach (I prefer this way), without checking if their is an image, you'll get an error in 'foreach'. I check if $node->field_image_cache is not NULL.

<?php
if (!$node->field_image_cache == NULL) {
foreach (
$node->field_image_cache as $image) {
// ... // display image
}
}
?>

Is their a better way to display images in custom node-product.tpl.php?

TIA,
Fossie

doomed@drupal.org's picture
Offline
Bug Finder
Joined: 04/05/2008
Juice: 334
fossie@drupal.org
fossie@drupal.org wrote:

Regarding to the images:

if you use:

<?php
$imagePath
= $node->field_image_cache['0']['filepath'];?>

<div id="image"><img src="/files/imagecache/product/<?php print $imagePath; ?>" alt="Title"></div>

and there is no image, no image is display at all and there will be the image not found symbol.

While using the foreach (I prefer this way), without checking if their is an image, you'll get an error in 'foreach'. I check if $node->field_image_cache is not NULL.

<?php
if (!$node->field_image_cache == NULL) {
foreach (
$node->field_image_cache as $image) {
// ... // display image
}
}
?>

Is their a better way to display images in custom node-product.tpl.php?

TIA,
Fossie

Fossie, your code is not working for me.

Would anyone help me improve the following code:
This is the way i'm currently showing my Lightbox images but I would like to make a check on the images, before showing them (to prevent the "image not found" on IE).

<!--show default image first, then others-->
<div class="product_image">
<?php $imagePath = $node->field_image_cache['0']['filepath']; ?>
<a href="<?=base_path()?><?=$imagePath?>" rel="lightbox[prod]"><img src="<?=base_path()?>files/imagecache/product/<?=$imagePath?>" alt="<?=$title?>" title="<?=$title?>" class="imagecache imagecache-product"></a>

<ul class="other_imgs">
<?php foreach ($node->field_image_cache as $images) { if ($images['filepath'] != $imagePath) { ?>
   <a href="<?=base_path()?><?=$images['filepath']?>" rel="lightbox[prod]" title="<?=$title?>">
   <img src="<?=base_path()?>files/imagecache/uc_thumbnail/<?=$images['filename']?>" alt="<?=$title?>" class="imagecache imagecache-uc_thumbnail"></a>
    <?php } } ?>
</ul>
</div>
<!--/show default image first, then others-->

This works perfectly btw, except when there are no images attached and you get the "image not found" .

doomed@drupal.org's picture
Offline
Bug Finder
Joined: 04/05/2008
Juice: 334
new code, working well!

Ok, with the following code i show the product's images thru Lightbox and they are checked first.
So, if you didnt attach any images to the product, there will be no "image not found" message on Internet Exploder.

<!--show default image first, then others-->
<div class="product_image">
<?php $imagePath = $node->field_image_cache['0']['filepath']; ?>

<?php if (!$node->field_image_cache == NULL) { ?>
<a href="<?=base_path()?><?=$imagePath?>" rel="lightbox[prod]">
<img src="<?=base_path()?>files/imagecache/product/<?=$imagePath?>" alt="<?=$title?>" title="<?=$title?>" class="imagecache imagecache-product">
</a>
<?php } ?>

<?php if (count($node->field_image_cache) > 1) { ?>
<ul class="other_imgs" style="list-style-type:none; margin-top:10px; text-align:center;">
<?php foreach ($node->field_image_cache as $images) { if ($images['filepath'] != $imagePath) { ?>
   <li style="display:inline; padding:0; margin-left:0;">
     <a href="<?=base_path()?><?=$images['filepath']?>" rel="lightbox[prod]" title="<?=$title?>">
     <img src="<?=base_path()?>files/imagecache/uc_thumbnail/<?=$images['filename']?>" alt="<?=$title?>" class="imagecache imagecache-uc_thumbnail">
     </a>
   </li>
<?php } } ?>
</ul>
<?php } ?>
</div>
<!--/show default image first, then others-->

This is working well afaik but I'm asking the PHP gurus to make any improvement possible.

The second part (the one that shows secondary images) was based on PlanBForOpenOffice's suggestion ( http://www.ubercart.org/forum/development/3868/nifty_products_tutorial_p... ). I'm not sure the checks are doing much... Can anyone confirm?

gizmatix's picture
Offline
Joined: 09/09/2008
Juice: 159
Re: new code, working well!

I've got a custom product page template made from pieces of code I've taken from the examples but what I haven't been able to grab or figure out is how to add custom attributes I've added to my products. For example I use ratio buttons, check boxes, and even drop down menu to pick what color t-shirt to purchase. Can anyone give me an example of these?

end user's picture
Offline
Joined: 01/11/2008
Juice: 1721
Re: Re: new code, working well!

I believe I use this which shows me the price and attribute info

<?php {print $node->content['field_price_block']['#value'];} ?>

adshill's picture
Offline
Joined: 07/24/2008
Juice: 30
About Thickbox intergration

I'm using the code:

<?php
    
// Grabs the firsts image path and sets $imagePath.
    
$imagePath = $node->field_image_cache['0']['filepath'];
?>
<?php
print l(
   
theme('imagecache', 'product', $field_image_cache[0]['filepath'], $field_image_cache[0]['alt'], $field_image_cache[0]['title']),
   
$field_image_cache[0]['filepath'],
    array(
'class' => 'thickbox', 'rel' => 'field_image_cache_1'), NULL, NULL, FALSE, TRUE);
?>

To try and get thickbox working with this... however its never actually linking to the image - I just get the "loading" bar. Everything worked fine before. The only thing I notice different to when I use the default node template is that I'm on a multilanguage site, so the URL includes a /en/ in it.

Could this be the problem as to why thickbox is not finding the images?! If so is there anything I can do?

Thanks.

adshill's picture
Offline
Joined: 07/24/2008
Juice: 30
Re: About Thickbox intergration

This is definitely the problem, as I disabled localisation and it works. Therefore advice would be to rewrite the code for international sites as it doesn't appear to function as it is.

However I'm now having other problems in seeing the multiple images attached using thickbox, despite the code being as specified above.

My desire would be that the first product image is displayed in the node (just that one) but then when you open up the thickbox, the other images are there using the next button. Does anyone have code to implement that? Sorry... I'm a bit new at this stuff so maybe this has been mentioned above but I followed the posts above and can't get it to work!

perfectmatch's picture
Offline
Joined: 05/30/2008
Juice: 77
Attributes working with node-product.

Hello,

Great job with the tutorial ... it's really helped me out so far ....

I've seen one of the posts above about getting attirbutes to work with node-product.

I currently get just the 'Title Attribute' with a text box and can't get radio buttons to work. I checked out the link posted about hook api's but i'm a complete numpty when it comes to coding.

Can anyone explain what code i add and where i put it to make this work?

Thanks in advance

acbmse's picture
Offline
Joined: 03/05/2009
Juice: 3
Page title

How do I remove the default page title (see image)? I am a beginner to Drupal and PHP.

Thank you.

AttachmentSize
pagetitle.jpg 110.24 KB
matshep1's picture
Offline
Joined: 02/08/2009
Juice: 22
Remove Title

I'm sure there are a few ways to do this, but here is how I would go about it. You can also refer to this page:

http://drupal.org/node/138910

If you go to your page.tpl.php (in your currently selected themes directory) and find the following code:

    <div id="middle-content">
      <div class="content-padding">
          <?php if ($tabs): print '<div id="tabs-wrapper" class="clear-block">'; endif; ?>
          <?php if ($title): print '<h2'. ($tabs ? ' class="with-tabs"' : '') .'>'. $title .'</h2>'; endif; ?>
          <?php if ($tabs): print $tabs .'</div>'; endif; ?>

          <?php if (isset($tabs2)): print $tabs2; endif; ?>

          <?php if ($help): print $help; endif; ?>
          <?php if ($messages): print $messages; endif; ?>
          <?php print $content ?>
          <span class="clear"></span>
          <?php print $feed_icons ?>

          <div style="clear:both;"></div>
      </div>
    </div>

The

<?php if ($title): print '<h2'. ($tabs ? ' class="with-tabs"' : '') .'>'. $title .'</h2>'; endif; ?>

is the line that prints out the title of your node, which you have to enter when creating the node.

Now you have two choices to stop that title from displaying. The first is to give the h2 tag (that wraps around the title) a specific class or ID and then use CSS on that class or id and set it to display: none.

Of course this may not be the most efficient way as we are printing the title and then just hiding it.

What you could do is add to the if argument in front of the print title statement, so that it checks to see if the current node is of a type that you don't want to print a title for. Looking at the image your provided you probably want to hide the title on all nodes of the type product?

How you can do this depends on whether you are using pathauto or not. I am going to assume you are. What you want to do is look at your page url and decide whether this page contains a node of type products. So if your url is:

http://www.mysite.com/products/coffeepress

We will check and see if arg(0), which is the Drupal constant/variable for the first argument of the url, is equal to 'products'. Now, I believe, if you do this and you are using pathauto this will not return the argument as you see it in the url, instead it will return something like 'node'. If so you can add the following code to the top of your page.tpl.php (courtesy of DrupalSN):

<?php
    $path
= drupal_get_path_alias($_GET['q']); //get alias of URL
   
$path = explode('/', $path); //break path into an array
    //user print_r($path); to see what the $path array looks like
?>

This takes the current url as it is displayed and makes the values in to an array. So now instead of checking the contents of arg(0) we check the contents of $path[0].

So now your code that prints the $title should be written like this:

<?php if ($title && $path[0]!='products'): print '<h2'. ($tabs ? ' class="with-tabs"' : '') .'>'. $title .'</h2>'; endif; ?>

So now we are checking the first argument of the current url. If it is equal to products we will not print the title but if it is not the title will print.

I have attached a sample page.tpl.php so you can see what it looks like.

I hope that helps. Again I am no expert, so if anyone has any other suggestions they are welcome.

Good Luck,
Mat

AttachmentSize
page.tpl_.php_.txt 4.4 KB
matshep1's picture
Offline
Joined: 02/08/2009
Juice: 22
Thickboc with Jquery Cycle

Hi all,

Thanks so much for this forum topic. It has helped me greatly in customizing my product page and still being able to use Thickbox with my product images.

I have attached a copy of my current node-product.tpl.php. My question is does anyone know of a way of using the Jquery cycle plugin with Thickbox images?

What I am trying to achieve is a display of my product images where one main image is displayed as a larger preview image and the others are displayed below as thumbnails (as set up in my current node-product.tpl.php)...but that will then cycle through which images are being previewed (larger image on top) and which are thumbnails (smaller images below preview image). All while still being able to view the full size image via Thickbox by clicking on it .

I have tried adding the Jquery cycle plugin to my page and then calling it to work on $('div.image')

e.g.

$('div.image').cycle('fade');

but this does not work, I have also been getting $cont.data is not a function error.

Does anyone have any suggestions or ideas of what I am doing wrong or how I can achieve this?

Thanks,

Mat

AttachmentSize
node-product.tpl_.php_.txt 4.64 KB
haggis's picture
Offline
Joined: 02/22/2009
Juice: 27
Great topic! However I

Great topic!
However I didn't find the solution of my problem:

I added some additional attributes and need to pass them into a table. The $node variable at myproduct.tpl.php contains only the fully rendered form so I'm not able to add a table there.

Please help..I'm searching and reading and try&error since more than 18 hours but didn't find anything that could help. Nor the Forms API neither custom themeing functions help...nothing! Sad

Any suggestions are welcome: adding code to my modul (would be my prefered solution for providing a default theme) or a way through the template-files.

Problem by providing a default theme: the module just adds an additional product class so it doesn't provide an 'own content type'. mymodule_view()/theme() are totally ignored. Please don't referre me to any book (have the pro development book). I think I got lost in space cause I'm still a drupal noob.

Thx,
haggis

edit: got it working! see how 'admin/content/node' is rendered at ../modules/node/node.admin.inc

edit2: you can find a cleaner way using ubercarts tapir at http://www.ubercart.org/docs/developer/7512/tapir_tables_api

stasparshin's picture
Offline
Joined: 08/17/2009
Juice: 7
Thanks a lot!

I've solved my problem this way:

1. disable both thickbox and lightbox modules
2. try one by one all codes proposed by people in this thread.
3. only the code by matshep1 worked for me.
4. enable thickbox module and...yahhoo!!! It works!

Thank you all and matshep1 especially! Smiling

2 matshep1: if you mean that you need to show all images of a product in thickbox window (switching by 'next' button) then you should look to the thickbox module settings. There is an 'Image field gallery' option. If that's not a problem you mentioned sorry my stupidness Smiling

Steel Rat's picture
Offline
Joined: 07/19/2009
Juice: 51
Re: Thanks a lot!

My problem isn't that Lightbox or thickbox isn't working, it's that the thumbnail for the main image isn't displaying.

Drup-rider's picture
Offline
Joined: 06/14/2010
Juice: 6
Did you find a solution?

Hi Matshep1,

Di you ever get the jquery cycle to work with thickbox or lightbox??? I've been battling with this for like a week now.

Thanks

RidolfiDesigns's picture
Offline
Joined: 03/31/2009
Juice: 5
Re: Nifty Products Tutorial Part 1

Adding node-product.tpl.php to my theme directory isn't working. As far as I can tell, the default "product" content type is being used. I emptied the cache but that still has not fixed the problem. I am not really sure what to do.

Obviously I am doing something wrong because it is not working. Any help would be appreciated.

Thanks

Danny_Joris's picture
Offline
Joined: 05/09/2009
Juice: 200
RidolfiDesigns wrote:Adding
RidolfiDesigns wrote:

Adding node-product.tpl.php to my theme directory isn't working. As far as I can tell, the default "product" content type is being used. I emptied the cache but that still has not fixed the problem. I am not really sure what to do.

Obviously I am doing something wrong because it is not working. Any help would be appreciated.

Thanks

I have the exact same problem. I added node-product.tpl.php to my theme directory. I put the code in it. Emptied the cache. And i'm 100% positive that my node type is 'product'.

I'm working with a zen-subtheme if that info is of any help.

Can anyone help me/us out on this?

Danny_Joris's picture
Offline
Joined: 05/09/2009
Juice: 200
Danny_Joris
Danny_Joris wrote:
RidolfiDesigns wrote:

Adding node-product.tpl.php to my theme directory isn't working. As far as I can tell, the default "product" content type is being used. I emptied the cache but that still has not fixed the problem. I am not really sure what to do.

Obviously I am doing something wrong because it is not working. Any help would be appreciated.

Thanks

I have the exact same problem. I added node-product.tpl.php to my theme directory. I put the code in it. Emptied the cache. And i'm 100% positive that my node type is 'product'.

I'm working with a zen-subtheme if that info is of any help.

Can anyone help me/us out on this?

Ok, i'm getting very close here, but not just yet. So after more than a day (!) working on this and being on the edge of pulling out my hair, i discovered that apperantly putting node-product.tpl.php in my zen sub-theme folder did not work, but when i place it in the original zen-folder, it does work. So that's great! breaktrough! But i thought, now that it works by putting it in the zen-folder, i should be able to overwrite that template file in my sub-theme folder. But that does not work !

Does anyone have an idea why this is not working? If i can fix it, i will let you know.

-- EDIT: Oh my god, i found it! I did not add node.tpl.php to my sub-folder. There! Hurrah !! Smiling

-- EDIT 2: By the way, is there a template that gives the exact result as the original unmodified template? Because i'm building this node-product.tpl.php only because i wanted to add a div span around a few objects.

-- EDIT 3: I can see now that there is no 'original unmodified template' as every cck page is different of course. I fixed what i needed by looking in the var_dump. Amazing how simple it was. I used only 8 lines. Very simple...

gberm's picture
Offline
Joined: 05/27/2009
Juice: 7
Re: Danny_Joris

I inserted doomed@drupal.org lightbox code, everything works but I cant get the thumbnails on the product page to display.

Any help would be appreciated.

Zalatar's picture
Offline
Joined: 01/27/2009
Juice: 86
Thickbox and themed product page

Does anyone have Thickbox images working on their site?
If so, can you post your node-product.tpl.php? Specifically the image part?
I have tried to get this to work using suggestions from above, but haven't got it to work.
Thx,
Z

EDIT: Using code in #91 post and not getting thumbnail on product page but it does open the preview large window.
Anyone have any thoughts?

end user's picture
Offline
Joined: 01/11/2008
Juice: 1721
Re: Re: Danny_Joris

I inserted doomed@drupal.org lightbox code, everything works but I cant get the thumbnails on the product page to display.

Any help would be appreciated.

You need to make sure that the File System Path under > admin/settings/file-system reflects that you have here

<img src="<?=base_path()?>files/imagecache/product/<?=$imagePath?>" alt="<?=$title?>" title="<?=$title?>" class="imagecache imagecache-product">
</a>
<?php } ?>

I think in D6 the default is sites/default/file/etc... and not system/files/etc...

This was my problem with not being able to see the images on the product page. Once I changed the File System Path and re uploaded the images it all worked fine.

dontpanic's picture
Offline
Joined: 04/05/2009
Juice: 40
almost working...

I am new to drupal and ubercart, but I have read through this whole thread, and somehow i managed to get it to mostly work.

however, I am still having an issue with the thumbnail image not displaying on the product page.

I am using this piece of code

<div class="product-image" style="width:210px; float:left;">
<?php $imagePath = $node->field_image_cache['0']['filepath']; ?>
              
                <a href="<?=base_path()?><?=$imagePath?>" rel="lightshow[prod]">
                    <img src="<?=base_path()?>files/imagecache/product/<?=$imagePath?>" alt="<?=$title?>" title="<?=$title?>">
                </a>
                <ul class="other_imgs" style="list-style-type:none; margin-top:10px; text-align:center;">
                    <?php foreach ($node->field_image_cache as $images) { if ($images['filepath'] != $imagePath) { ?>
                    <li style="display:inline; padding:0; margin-left:0;"><a href="<?=base_path()?><?=$images['filepath']?>" rel="lightshow[prod]" title="<?=$title?>">
                    <img src="<?=base_path()?>files/imagecache/uc_thumbnail/<?=$images['filename']?>" alt="<?=$title?>"></a></li>
                    <?php } } ?>
                </ul>
            </div>

the thumbnail image is just showing up as a text link.

when i view the source, it's obvious that the link to the thumbnail isn't being generated correctly... but the lightbox link is. any help is greatly appreciated!

<a class="lightbox-processed" href="/sites/default/files/100_3021.jpg" rel="lightshow[prod]">
                    <img src="/files/imagecache/product/sites/default/files/100_3021.jpg" alt="Pendant" title="Pendant">
                </a>
adrianmak's picture
Offline
Joined: 05/28/2008
Juice: 312
Re: almost working...

I studied this product node template has no attributes printing. How to print attributes for a product class ?
I read the attributes is an array of array and so on structures. How to print out these information efficiency

adrianmak's picture
Offline
Joined: 05/28/2008
Juice: 312
Re: Re: almost working...

To make lightbox effect works, besides adding rel=lightbox in the anchor image tag, does any setup required on lightbox module after enabled?

PepeMty's picture
Offline
InternationalizationizerNot Kulvik
Joined: 11/26/2007
Juice: 159
Re: Nifty Products Tutorial Part 1

susbcribing.

cfab's picture
Offline
Joined: 06/30/2009
Juice: 70
For images, I don't think this is the right way...

For the image part, at least, you should use api instead of managing pathes by yourself (which is non only ugly but dangerous : what if you change your imagecache preset? or your filesystem architecture?).

For instance, that's my version (I think the good way is to do it entirely with a theme function, but it's easier to begin this way) :

<!-- Start Product  -->

<!-- Start Prices section -->
<?php
       
// maybe there's a better way to do this part, using theme functions
        // but I've only found individual formatting, with "theme_uc_product_price" function
        // here I use Ubercart Discounts (Alternative)
       
$sell_price=$node->sell_price;
       
$reduced_price=$node->field_product_reduced[0]["discounted_price"];
       
$codeless_discount=$node->field_product_codeless[0]["codeless_discounts"];
       
        if (
$reduced_price){
            print
'<div class="product-info product display">';
            print
'<span class="uc-price-product uc-price-display uc-price original-sell-price">'.t("Original price")." : ".uc_currency_format($sell_price).'</span>';
            print
'<span class="uc-price-product uc-price-display uc-price ">'.$codeless_discount." : ".$reduced_price.'</span>';
            print
'</div>';
        }else{
            print
'<div class="product-info product display">';
            print
'<span class="uc-price-product uc-price-display uc-price">'.uc_currency_format($sell_price).'</span>';
            print
'</div>';
        }
       
// Feel free to add other prices here
       
?>

<!-- End Prices section -->

<!-- Start Main informations -->
<?php
       
// product title
       
print "<h2>$title</h2>";
       
// product description
        // if you want to customize how your fields are rendered, use $node->content['YOUR_FIELD_NAME'][0]['#view'];
       
print $node->content['body']['#value'];
       
?>

<!-- End Main informations -->

<!-- Start Images section -->
<?php
       
// if you need a more advanced customization, override the themeable "theme_uc_product_image" function (uc_product.module)
       
if ($node->content['image']['#access']==1)  print $node->content['image']["#value"];
       
?>

<!-- End Images section -->

<!-- Start Weight section -->
<?php
       
// again, if you need a more advanced customization, override the themeable "theme_uc_product_dimensions" function (uc_product.module)
       
if ($node->content['weight']['#access']==1)  print $node->content['weight']["#value"];
       
?>

<!-- End Weight section -->

<!-- Start Dimensions section -->
<?php
       
// again, if you need a more advanced customization, override the themeable "theme_uc_product_dimensions" function (uc_product.module)
       
if ($node->content['dimensions']['#access']==1)  print $node->content['dimensions']["#value"];
       
?>

<!-- End Dimensions section -->

<!-- Start Button section -->
<?php
       
// there's a themable function theme_uc_product_add_to_cart, and I think you still can alter uc_product_add_to_cart_form function
       
print $node->content['add_to_cart']["#value"];
       
?>

<!-- End Button section -->

<!-- End Product  -->

melanie_me's picture
Offline
Joined: 03/29/2009
Juice: 109
Re: Nifty Products Tutorial Part 1

Thanks!! Just what I was looking for!

Ms_Kristina's picture
Offline
Joined: 04/05/2009
Juice: 63
This is really useful. I've

This is really useful. Smiling I've bookmarked this. Smiling

I'm working on themeing the pages now for a client. Smiling I am pretty sure I have the HTML and the css written up so I just need to throw in the PHP and test basically. Mind you waiting for client approval.

I have confused as to how to deal with the images css wise since the client wants a very specific setup for the product pages. He only wants to... additional images displayed. So the main image, then 2 smaller ones. What do I have to do to stop it from displaying more if he's been dumb and uploaded more. Eye-wink

Danny_Joris's picture
Offline
Joined: 05/09/2009
Juice: 200
Re: This is really useful. I've

Edit the cck-type 'product' so that he cannot add more than a specific amount of images.

You'll find it here in the middle of the page. ('number of values')
admin/content/node-type/product/fields/field_image_cache

Danny

Ms_Kristina's picture
Offline
Joined: 04/05/2009
Juice: 63
How do I do the images...

Fantastic. Smiling Now just to figure out how to get the main image, and two smaller images and I should be set... I think. XD

I attached the style, and the product node code. Any recommendations on how to do the images code? I'm not sure how to do it.

AttachmentSize
node-product-page.tpl_.php_.txt 1.04 KB
style.css_.txt 51.21 KB
stasparshin's picture
Offline
Joined: 08/17/2009
Juice: 7
Re: Nifty Products Tutorial Part 1

Thanks for all the work you've done, guys!

I'm currently trying to show my images using lightbox and only get a link to the main image. That's probably a path problem. I'll post my code when get it right.

Steel Rat's picture
Offline
Joined: 07/19/2009
Juice: 51
Hello All, I've read through

Hello All,

I've read through much of this thread trying to suss out how to theme the product detail to my liking. There are a lot of code snippets, but I can't seem to get one working that shows the main image for the product. All it shows is the link as text. I made sure the images are actually there (checked the path, and when editing the product, the image thumb is showing.)

Here's a link to the site/a product to show what I mean: http://thymeforrosemary.com/store/node/7

I'm using the following code for my node-product.tpl.php

<div class="node-<?php print $node->nid; ?><?php if ($sticky) { print " sticky"; } ?><?php if (!$status) { print " node-unpublished"; } ?>">
    <?php if ($picture) {
      print
$picture;
    }
?>

    <?php if ($page == 0) { ?><h2 class="title"><a href="<?php print $node_url?>"><?php print $title?></a></h2><?php }; ?>
    <div class="content">
<table cellpadding="0" cellspacing="0"  class="product">
  <tr>
     <td align="center" class="product_image">
     <?php

   

// Grabs the firsts image path and sets $imagePath.
    
$imagePath = $node->field_image_cache['0']['filepath'];
?>

     <br /><?php print l(
   
theme('imagecache', 'product', $field_image_cache[0]['filepath'], $field_image_cache[0]['alt'], $field_image_cache[0]['title']),
   
$field_image_cache[0]['filepath'],
    array(
'class' => 'thickbox'), NULL, NULL, FALSE, TRUE); ?>

   </td>
   <td  class="product_info">
<div id="node">
<?php // product title  ?>
<p class="product-title"><?php print $title ?></p>
<p class="product-titles">Product Details</p>
<?php print $node->content['weight']["#value"]; ?>
<?php print $node->content['dimensions']["#value"]; ?>
<p class="product-titles">Product Rating</p>
<?php print $node->content["fivestar_widget"]["#value"];  ?>
<p class="product-titles">Product Reviews:</p>
Product Reviews <?php print $node->comment_count?> | <a href="/<?php print $node->links['comment_add']['href']; ?>#comment-form">Review Product</a> | <a href="#read_reviews">Read Reviews</a>
</div>
<br />
<div id="cartContainer">
<div id="cartAdd">
<?php // add to cart buttons ?>
<?php print $node->content['add_to_cart']["#value"]; ?>
</div>
<div id="cartPrice">
<?php  // list price and sell price display  ?>
<p class="product-titles">PNW Everyday Low Price</p>
<p id="productPrices" class="productGeneral"><?php print uc_currency_format($node->sell_price); ?></p>
</div>
<div id="spacer"><!-- nothing --></div>
</div>
</td>
</tr>
</table>
<hr />
<?php print $productupsell ?>
<br />
<p class="product-titles">Description:</p>
<?php // product description  ?>
<?php print $node->content['body']['#value'];  ?>
<br />
<a href="/<?php print $node->links['comment_add']['href']; ?>#comment-form" name="read_reviews">Review Product</a>
</div>
    <?php if ($links) { ?><div class="links">&raquo; <?php print $links?></div><?php }; ?>
  </div>

Any ideas?

Thanks!

Steel Rat's picture
Offline
Joined: 07/19/2009
Juice: 51
Re: Hello All, I've read through

I've solved part of my own problem. The code I was using relied upon thickbox, I'm using lightbox2. I installed thickbox just to see if it would work, nothing changed at all. So I found some code above to use lightbox, and it's working in that if you click the link to the image it will display with lightbox, but the thumbnail isn't showing for the product detail... Is there something with Imagecache I need to change? This was all working before I created my node-product.tpl.php.

Thanks

Foaman's picture
Offline
Joined: 10/16/2009
Juice: 33
Why?

Can you please turn the comments into "why" comments instead of "what" comments. What things do is obvious by the code, but why you are doing them is what confuses me. For example, I'd like to put float right in my product.tpl file because I want to see a 400x400 proof of my image on the upper right-hand part of my product page.

rhysemt's picture
Offline
Joined: 01/17/2010
Juice: 7
Product Attributes

Hi all, thanks for the helpful thread.

I currently have a lot of products that contain attributes, like size and colour and I would like to begin customising my pages, but am not sure how to print out attributes using hooks or the likes.

Can someone please explain with examples, how I go about adding attributes to my custom product pages?

Any help would be much appreciated.
Cheers
Rhys

rhysemt's picture
Offline
Joined: 01/17/2010
Juice: 7
Adding Attributes

Hi again,

Have sorted this out, I didn't realise that to get the attributes in there, it is a matter of adding the "Add to Cart" button. As all the attribute fields and option 'come attached' to that.

Using this in Contemplate does the trick...

<?php print $node->content['add_to_cart']['#value'] ?>

Hope this helps others Smiling
Cheers
Rhys

mad-joe's picture
Offline
Joined: 12/20/2009
Juice: 45
Show discounted price by uc_discount module

How would I show the discounted price within my template by using a predicate (uc_discount module):

OLD PRICE: [original SELL PRICE]
NEW PRICE: [discounted SELL PRICE]

OLD PRICE could be shown like this:

<?php
print uc_currency_format($node->sell_price);
?>

How to show the discounted (NEW) price in a theme?
I assume I should use uc_price($price_info, $context) function, but I don't think it's accessible in my tpl.php file.

dresimple's picture
Offline
Joined: 07/16/2012
Juice: 10
uc_discount amount

how do I print the uc_discount amount field for drupal 7 in my uc-order--customer.tpl.php

Unarmed's picture
Offline
Joined: 08/07/2009
Juice: 139
Re: Nifty Products Tutorial Part 1

Great this topic has exactly what i was looking for =D

Scott J's picture
Offline
Joined: 04/25/2010
Juice: 23
mykz- wrote: In my next
mykz- wrote:

In my next tutorial I will be showing you how to style the mark-up (HTML) with CSS.

Did part 2 ever happen?

kristin.e's picture
Offline
Joined: 06/01/2010
Juice: 35
Image display problems

Hi, thanks for this great thread and tutorial. I have been oscillating between the image display methods used by Futurist in post no. 49 (using thickbox) - which displays the main image and thumbnails on the product page BUT does not open thickbox beyond the dark screen and loading bar - it gets stuck there.

The other method I am using is domed@drupal's default ubercart product display for node-product.tpl.php which uses lightbox - this doesn't display image and thumbnails on the product page but when you click on the image text lightbox opens fine.

I have trawled through this thread and related threads on node-product.tpl.php. I can't seem to find a suitable solution for either problem. Has anyone had these issues and sorted them out? If yes, please advise if you can.

many thanks

kristin.e's picture
Offline
Joined: 06/01/2010
Juice: 35
image display fixed for thickbox

I went for the thickbox option in the end. I reverted to the default ubercart display by removing the node-product.tpl.php file. I then cleared the cached and uploaded the node-product.tpl.php file again and viola it now works! seems I had to refresh everything. Smiling

kirlisakal's picture
Offline
Joined: 08/06/2010
Juice: 5
Re: Nifty Products Tutorial Part 1

hey there.. thnx for your instruction..
i do it as you explain, i put it my current theme folder, that is sites/all/themes/cicekbakkali/
i named it as node-product.tpl.php, and checked that the content type is "product" as default, actually there are three story, page and product types, i need product...
however it does not work...
could u help me?

kirlisakal's picture
Offline
Joined: 08/06/2010
Juice: 5
Re: Re: Nifty Products Tutorial Part 1

i fixed my problem as said above
in zen theme, there is main "zen" folder different than your main theme folder.. you must put it in the main zen folder...
that way it works... thnx

ubzub's picture
Offline
Joined: 06/18/2010
Juice: 42
Hi, I created

Hi,
I created node-product.tpl.php with your code and saved it into the active theme's folder. But It did not made any changes in the display. Can you tell what is the problem?

ubzub's picture
Offline
Joined: 06/18/2010
Juice: 42
Re: Hi, I created

got it fixed somehow.Thanks

jlyndesyn's picture
Offline
Joined: 09/20/2010
Juice: 9
Thank you for this!

This post, and the many comments, has been so useful. I'm using lightbox for the images and used code from your comments. I just had to change the 
<?= to <?php print from the code that was posted in order for the images to show up.

The resulting code is attached:
<?php $imagePath = $node->field_image_cache['0']['filepath']; ?> <?php if (!$node->field_image_cache == NULL) { ?><a href="<?php print base_path()?><?php print $imagePath?>" rel="lightbox[prod]"><img src="<?php print base_path()?>/sites/default/files/imagecache/product/<?php print $imagePath?>" alt="<?php print $title?>" title="<?php print $title?>" class="imagecache imagecache-product"></a><?php } ?>
<?php if (count($node->field_image_cache) > 1) { ?><ul class="other_imgs" style="list-style-type:none; margin-top:10px; text-align:center;"><?php foreach ($node->field_image_cache as $images) { if ($images['filepath'] != $imagePath) { ?>   <li style="display:inline; padding:0; margin-left:0;"><a href="<?php print base_path()?><?php print $images['filepath']?>" rel="lightbox[prod]" title="<?php print $title?>"><img src="<?php print base_path()?>/sites/default/files/imagecache/uc_thumbnail/<?php print $images['filename']?>" alt="<?php print $title?>" class="imagecache imagecache-uc_thumbnail"></a>   </li><?php } } ?></ul><?php } ?>

AttachmentSize
product node lightbox.txt 1.1 KB