Lightbox the base image of a product

there are many lightbox css free codes on web, i would freely assign it to joomla or stuff but what should i do or where to change the code so that i can lightbox the base images of a product?

Attachment 35192

14 answers

Profile photo of Sherlock 0.00 $tone March 26, 2014
Public

Have you tried to find a magento extension for this purpose? If you are familiar with programming, you edit this app\design\frontend\default\jm_megamalltemplate\c atalog\product\view\media.phtml file to implement the lightbox.

#1
Profile photo of Alexandru Gorbenco 240.00 $tone March 26, 2014
Public

Have you tried to find a magento extension for this purpose? If you are familiar with programming, you edit this app\design\frontend\default\jm_megamalltemplate\c atalog\product\view\media.phtml file to implement the lightbox.

Ofcourseni am not just familiar cause otherwise i would post much more questions ))) i know how to implement codes the problem is i do not know yet magento and it’s templates files yet. Thank you very much for the directory i’ll do it with out any extension and i’ll post the result

#2
Profile photo of Alexandru Gorbenco 240.00 $tone March 28, 2014
Public

Have you tried to find a magento extension for this purpose? If you are familiar with programming, you edit this app\design\frontend\default\jm_megamalltemplate\c atalog\product\view\media.phtml file to implement the lightbox.

this is a bit harder then i thought…. even if i manage to make the light-box work correctly there is no use of it. Cause when uploading hte image it will resize it automatically to the 370×370 size…

#3
Profile photo of Alexandru Gorbenco 240.00 $tone March 28, 2014
Public

Have you tried to find a magento extension for this purpose? If you are familiar with programming, you edit this app\design\frontend\default\jm_megamalltemplate\c atalog\product\view\media.phtml file to implement the lightbox.

Sherlock could you please tell me where and what files to edit in order to introduce everything.

As for css files i put them in to skin/frontend/default/_jm_megamall/css/

As for js files i put them in to js/

i call for these files in the page.xml file located in the app/design/frontend/default/jm_megamall/layout/

i add the
Code:

<action method="addJs"><script>mylightbox.js</script></action>

and
Code:

<action method="addCss"><stylesheet>css/myclass.css</stylesheet></action>

Now the last final thing i have to do is add my JS script… where do i do that?

Code:

$(document).ready(function() {
	$(".mylightbox").lightbox({
		openEffect	: 'none',
		closeEffect	: 'none'
	});
});
#4
Profile photo of Alexandru Gorbenco 240.00 $tone March 28, 2014
Public

Have you tried to find a magento extension for this purpose? If you are familiar with programming, you edit this app\design\frontend\default\jm_megamalltemplate\c atalog\product\view\media.phtml file to implement the lightbox.

ok after i have made the changes something works and some not

http://v2.bicomplex.md/romanian/pard…style-214.html

i have started to have a bunch of error.. could you help me? thank you!

p.s. this si totaly not good taht it resizes images to 370.. cause it will lightbox the image and not make it bigger.

#5
Profile photo of Alexandru Gorbenco 240.00 $tone March 28, 2014
Public

It has no Background!!! i have just checked! maybe it’s cause i gave special size to the watermark!? how to set it up then?

emm no.. just tried it out.. The watermark has nothing to do with it. And it has no Background. Just it get’s resized to 370 and 370. And the background appears cause of it. It is not streched or Centered is just resized in that not good way..

#8
Profile photo of Alexandru Gorbenco 240.00 $tone March 28, 2014
Public

This issue is not with the resize property the image has white background at the top and bottom

here is the image on your site attached, see the watermark going outside.

Attachment 35314

yet all images are resized to 370-370 just as i upload them. If they are too tall then on left and right side white backroung appears. If too large then top and bottom White space appears..

Any idea how to fix it?

http://v2.bicomplex.md/romanian/pardoseli/laminat.html

#9
Profile photo of chavan 100.00 $tone March 28, 2014
Public

remove water mark setting and reupload a new image for this product alone. Again there is a white background on the image i have attached.

#10
Profile photo of Alexandru Gorbenco 240.00 $tone March 28, 2014
Public

remove water mark setting and reupload a new image for this product alone. Again there is a white background on the image i have attached.

It’s not cause of hte watermark. Cause i did not apply it to small images and thumbnails only to big ones… Any i removed the watermark completely and flushed the cache and uploaded the images again. Still no changes..

p.s. Either magento itself or the template when i upload the image it resizes it instantly. Cause even my lightbox when pops out the image it looks bad cause i force it to grow big from 370_370 to 600_600

#11
Profile photo of Alexandru Gorbenco 240.00 $tone March 31, 2014
Public

I have cropped the image for you and uploaded in the product, Wherever you find this crop the image for the thumbnail and upload it.

Thankbyou for the help. Thos solution i know i just thoight if i can makrle the crop function to work wiser so that i save time on so many products. But it seems i do not have other choise then do every single one manualy

#13

Please login or Register to Submit Answer

Written By

Comments