product detail page big image showing

[charles99]

I need to know how would I go about fixing the product image from showing?  I am attaching a image to show you the problem.  After upgrading to the current beta version 2.0.1.k the upgrading messed up my whole site!!!!!!!

All my products now have the big image showing right behind the small image.  What I don't understand is why would you guys mess up something that was working before the patches?  And Mib no more learning curves that you want people to learn!   Because every time you want to play teacher people like me end up losing money or losing a client because I have to push a project back just to find an solution for the problem you create.   And I read your post very careful and found it hard to believe that you would intendly  leave something out because you want people to not do something or learn how to do something.  No matter what a user does there are options for them.  Either they will pay for the problem to go away or search the forum for answers but people do not, and let me repeat this people do not come here to learn but to find the answer to the problem that they are having.   

For every problem you guys solve it seems you are creating new ones!  So will you please stop trying to play teacher!!!  Because in the process you are driving people to other eCommerce (AyelShop, HikaShop, JoomShopping, edwin and redSHOP)  programs!   And this is how a program slowly dies.   Especially when you are testing new features that all of the above programs already have!   It dos not matter how many people use VM 2.0 last week or 2 years ago its always about simplification!   And the dumb learning curves you place in front of your users and you guys have placed a lot of dumb curves in front of people by releasing a program that wasn't ready, now everyone is having problems and losing money!  Maybe I am wrong could the word Stable means something else other than STABLE?  No! Stable is Stable!  And VM 2.0 is nowhere near stable!  And trust me I am kicking myself in the ass for investing over 3 months of work on this program. 

Maybe someone should take a look at some of the other programs that have come online since you started your upgrade because they are the ones that will benefit from your bad teaching habits.   





And my mygruz fix does not work...So i don't feel that bad... If he's having problems fixing it  only god knows who can?  God I hope you are listening....












[attachment cleanup by admin]

[Bijou]

I have the same  problem in 2.0.1  , Did you solve the problem?

[d0ublezer0]

It's not Virtuemart problem. This is a problem with your layout. In the template, the default is to display the full image. Reduce the size of the full picture, if you do not know html + CSS to fix the template itself.

[Bijou]

How is the layout?  I used the sample data and only replaced the picture. The lightbox is supposed to show a bigger image, if i reduced is no sens have a lightbox to show a bigger picture, and this happens with any template use

[charles99]

Try this it should fix this problem.  And it is not  a layout problem but a virtuemart 2.0 problem or a learning moment Milbo created!

Milbo comment:
Thank you very much for this nice tutorial

Please be aware that we did that on purpose. We or better said I want to awake a recognition of the actual image size.

Frefel had the idea, that we should add a resize option also for the normal images, not only thumbs. When we added this, then we can add the fix in the css.

Milbo
Virtuemart Projectleader
Administrator
Hero Member





templates/YOURTEMPLATE/html/com_virtuemart/productdetails/default.php

Find code in line about 138



         <?php echo $this->product->images[0]->displayMediaFull('class="medium-image" id="medium-image"',false,"class='modal'",true); ?>
         </div>
      <?php } // Product Main Image END ?>

      <?php // Showing The Additional Images
      // if(!empty($this->product->images) && count($this->product->images)>1) {
      if(!empty($this->product->images) ) { ?>
         <div class="additional-images">
         <?php // List all Images
         if(count($this->product->images) >0){
            foreach ($this->product->images as $image) {
               echo '<div class="floatleft">'.$image->displayMediaThumb('class="product-image"',true,'class="modal"',true,true).'</div>'; //'class="modal"'





and replace this with code

         <?php /*##mygruz20120209121837 {
         It was:
         <?php echo $this->product->images[0]->displayMediaFull('class="medium-image" id="medium-image"',false,"class='modal'",true); ?>
         It became:*/
         //Enable FancyBox plugin
         $front = JURI::root(true).'/components/com_virtuemart/assets/';
         $document = JFactory::getDocument();
         $document->addStyleSheet($front.'js/fancybox/jquery.fancybox-1.3.4.css');
         $document->addScript($front.'js/fancybox/jquery.fancybox-1.3.4.pack.js');
         $js = 'jQuery(document).ready(function($) { $("a.gallery").fancybox(); });';
         $document->addScriptDeclaration($js);
         //output thumbnail
         echo $this->product->images[0]->displayMediaThumb('class="product-image"',true,'class="gallery" rel="'.$this->product->virtuemart_product_id.'"',true,true);
         //unset first image not to be show amont additional ones
         unset ($this->product->images[0]);
         /*##mygruz20120209121837 } */?>
         </div>
      <?php } // Product Main Image END ?>

      <?php // Showing The Additional Images
      // if(!empty($this->product->images) && count($this->product->images)>1) {
      if(!empty($this->product->images) ) { ?>
         <div class="additional-images">
         <?php // List all Images
         if(count($this->product->images) >0){
            foreach ($this->product->images as $image) {
               /*##mygruz20120209120919 {
               It was:
               echo '<div class="floatleft">'.$image->displayMediaThumb('class="product-image"',true,'class="modal"',true,true).'</div>'; //'class="modal"'
               It became:*/
               echo '<div class="floatleft">'.$image->displayMediaThumb('class="product-image"',true,'class="gallery" rel="'.$this->product->virtuemart_product_id.'"',true,true).'</div>'; //'class="modal"'
               /*##mygruz20120209120919 } */






it's better to reapply the code to the latest components/com_virtuemart/views/productdetails/tmpl/default.php after the VM update. I mean till VM is activelty developed.


Thanks should go to Gruz for fixing this problem Milbo created...

[dixonzhai]

Try this it should fix this problem.  And it is not  a layout problem but a virtuemart 2.0 problem or a learning moment Milbo created!

I cannot find templates/YOURTEMPLATE/html/com_virtuemart/productdetails/default.php in my FTP.

[alibak]

Hi, I had the same issues.  I was trying to find the default.php, and i've gone to views/productdetails/ 

Then WHERE?

/tmpl ? then default.php

or view.html.php?

But it is under /tmpl/   default_images.php

Ali

[Master_gray]

Hi

I had the same problem it's your Photo size you must re-size the Photo and it will fit,

1,)use Jruler  to measure the pixel height and withe you wan't the photo to be in your product detail page.

2,)use picmonkey to resize the photo,(it's a online program).

3,)remove the product's photo and save.

4,)then upload the re-sized photo.It should work.

TIP:upload the re-sized photo first and then upload the bigger photo secondly

P.S tell me if i should make a video on youtube.

[stefk]

Simple solution which i found on the forum:
If you need the main product image a certain size you add a descriptor for the class medium-image into the VM css file, vmsite-ltr.css or append it to your Joomla template css file so it does not get overwritten by an upgrade.
eg.
        .medium-image {
            width:350px;
        }