Magnifying Glass

  • Posts: 21
  • Thank you received: 0
13 years 6 months ago #16281

i would love to put beside or under knee the product-pics on the product-page a magnifying glass icon, customer would use more the integrated shadowbox function...but i don't have a clue how to do it...any suggestions?

Please Log in or Create an account to join the conversation.

  • Posts: 82868
  • Thank you received: 13378
  • MODERATOR
13 years 6 months ago #16292

You should be able to use something like LV image zoomer: www.hikashop.com/en/support/forum/4-how-...image-zoom.html#1654

Please Log in or Create an account to join the conversation.

  • Posts: 21
  • Thank you received: 0
13 years 6 months ago #16294

ohhh nooo, that's not what i meant, the zoom function is there and works brilliant with that shadowbox effect..just wanted a "click here to enlarge" symbol to make understandable to the customer ther is the possibility of a enlarged product view...

Please Log in or Create an account to join the conversation.

  • Posts: 82868
  • Thank you received: 13378
  • MODERATOR
13 years 6 months ago #16298

You need to create the file templates/YOUR_TEMPLATE/html/hikashop_image.php and put that code in it:

<?php
function hikashop_image_link_render(&$obj,$path,$addpopup,$optionslink,$html){
$html.='ADD YOUR HTML THERE';
return '<a rel="{handler: \'iframe\', size: {x: '.$obj->width.', y: '.$obj->height.'}}" target="_blank" href="'.$obj->uploadFolder_url.$path.'" onclick="SqueezeBox.fromElement(this,{parse: \'rel\'});return false;" '.$optionslink.'>'.$html.'</a>';
}

Please Log in or Create an account to join the conversation.

  • Posts: 21
  • Thank you received: 0
13 years 6 months ago #16299

wow...now i own ur one! ;-)
thanks a lot...i just give it a try and it works fine...just need to finde a better Magnifying Glass...bit this is perfect!

Please Log in or Create an account to join the conversation.

  • Posts: 82868
  • Thank you received: 13378
  • MODERATOR
13 years 6 months ago #16300

This is a code override so you will be able to update HikaShop without loosing your modification.

Please Log in or Create an account to join the conversation.

  • Posts: 21
  • Thank you received: 0
13 years 6 months ago #16302

yeah i figure that the moment as i stuffed it in my template folder...;-)
but anyway thank you very much...it looks good now and is a good "UI"add to the shop...
take care its friday 9pm here..i finish now..and will have a beer..cheers!

Please Log in or Create an account to join the conversation.

  • Posts: 138
  • Thank you received: 1
9 years 2 months ago #215155

HI we did ad this code to the website but the image is showing o the smaller images. we want it to show on the main image on the productpage. What should we change?

<?php
function hikashop_image_link_render(&$obj,$path,$addpopup,$optionslink,$html){
$html.='<img src="imagesblablabla.png" alt="" width="5" height="5" TOP:35px; LEFT:170px; />';
return '<a rel="{handler: \'iframe\', size: {x: '.$obj->width.', y: '.$obj->height.'}}" target="_blank" href="'.$obj->uploadFolder_url.$path.'" onclick="SqueezeBox.fromElement(this,{parse: \'rel\'});return false;" '.$optionslink.'>'.$html.'</a>';
}

Please Log in or Create an account to join the conversation.

  • Posts: 138
  • Thank you received: 1
9 years 2 months ago #215156

Also maybe not the same topic but we want an image below the "put in shoppingcard button". On the productpage. This image we need on every page. It is saying that deliviry costs are free. Any way we can do this?

Please Log in or Create an account to join the conversation.

  • Posts: 26158
  • Thank you received: 4028
  • MODERATOR
9 years 2 months ago #215159

Hi,

That thread is more than 4 years old ; HikaShop have evolve a log since that day and we extracted the display of images from that helper to put a maximum directly in the view (show_block_img).

Regards,


Jerome - Obsidev.com
HikaMarket & HikaSerial developer / HikaShop core dev team.

Also helping the HikaShop support team when having some time or couldn't sleep.
By the way, do not send me private message, use the "contact us" form instead.

Please Log in or Create an account to join the conversation.

  • Posts: 138
  • Thank you received: 1
9 years 2 months ago #215233

OK. I dont get what you are saying? How do we insert a glass into our images now?

Please Log in or Create an account to join the conversation.

  • Posts: 82868
  • Thank you received: 13378
  • MODERATOR
9 years 2 months ago #215237

Hi,

What jerome means is that it is now simpler. You can go in the menu Display>Views, edit the file "show_block_img" and add your img tag in there with custom CSS in order to display your magnifiying glass image on top of the product image. You don't need to know PHP or javascript anymore.

Please Log in or Create an account to join the conversation.

  • Posts: 138
  • Thank you received: 1
9 years 2 months ago #215328

Ok that is more clear. :) So we got to the file and i gues what we see is the code to show the productpage image. So where and how do we insert this img tag in there? We just put on the bottom something like:

<img src="imagesblablabla.png" alt="" width="5" height="5" TOP:35px; LEFT:170px; />

Please Log in or Create an account to join the conversation.

  • Posts: 12953
  • Thank you received: 1778
9 years 2 months ago #215335

Hello,
You'll just have to add it on the "show_block_img" file of the "product" view, of your front-ent template via "Hikashop->Display->Views".

Please Log in or Create an account to join the conversation.

  • Posts: 138
  • Thank you received: 1
9 years 1 month ago #215797

So i went to show_block_img and inserted this code:

<img src="images/blbla.png" alt="Smiley face" height="42" width="42" align="right">

And the image is showing up. But it is below the main image. M i missing something? Adapting the height etc is not working.

Please Log in or Create an account to join the conversation.

  • Posts: 82868
  • Thank you received: 13378
  • MODERATOR
9 years 1 month ago #215806

Hi,

Yes, you're missing something. As I said in my first message to you, you need to

add your img tag in there with custom CSS in order to display your magnifying glass image on top of the product image

So far, you only did half of what I said and only added the img tag. Next, you need to add custom CSS to have your image overflow on top of the main image.

Please Log in or Create an account to join the conversation.

  • Posts: 19
  • Thank you received: 3
8 years 11 months ago #224793

For all of you beginner with css and who don't have hours to spend on design, here just an example on how to get it work entirely :
- go to Hikashop->Display->Views
- click on "show_block_img"
- on line 76 after

echo $this->popup->image($html, $img->origin_url, null, $attr);
								}
							}
						?>

insert
<img style="position:absolute;bottom:5%;left:45%;" alt="" width="20" height="20" src="images/zoom-img.png">

where "zoom-img.png" is your img, in that case i just took the magnifying glass image of jcemediabox and put it in "images"
After you can decide where to put exactely your image by adjusting "bottom:5%" and "left:45%"

The following user(s) said Thank You: nicolas

Please Log in or Create an account to join the conversation.

Time to create page: 0.121 seconds
Powered by Kunena Forum