Hello, I would like to implement this lightbox to K2 Item Images.
dimsemenov.com/plugins/magnific-popup/documentation.html

I already have it implement on my site for a form link.

Is there anyway that I can have an implementation that will not get crushed on the next build update?

Could you help me out?

Thank you
Regards

After you have downloaded the lightbox's files you need to do the following.

Paste the css file in your template's stylesheet.
Paste the js file in your template's js file or include it (docs.joomla.org/JDocument/addScript) at the end of your scripts queue.

Then:
Paste this code in your item.php override. Preferably inside the image's block.
Then locate and change:
to:

In order to override or locate the item.php file read this post:
www.joomlaworks.net/blog/item/194-k2-inheritance-sub-templating

Thank you very much!

Regards

Hi Krikor, I am trying to enlarge the height of the lightbox when under @media 400px class I can't reach through CSS.

Could you give me a hand?

-http://www.quebecguitare.ca/professeurs/quebec/simon-mart
-Click on the booking link under the Item Title "Disponible pour Réservations"
-Minimize the browser under 400px.

Expected result:
The height of the lightbox should be 80%.

Thank you
Regards

The height is always set to 100%.

The actual height of the contents is proportional to the width of the image. If the height is changed then the image will be distorted.

Unfortunately this is the lightbox's default behaviour and it cannot be changed.

This is for a form not an image. So the height can be overriden without distorting it.
Otherwise, at smaller resolution the lightbox for the form is too small.

Thank you
Regards

Oh I see,

Check the ..mfp-iframe-scaler class.
This is what gives the proportions for the iframe.

You can change the padding-top: to eg: 80% for smaller viewports.

It worked great! Brilliant!

Have a nice weekend Krikor.
Regards

Thanks mate :)
Always happy to help.

Hi Krikor,

I've got this new lightbox installed on the website for K2 item images.

I've added a link at the bottom of the K2 Image with a term substitution using no!number ReReplacer.

The problem is that I want to open the link in the modal as well:

Ref.: www.quebecguitare.ca/administrator/index.php?option=com_rereplacer&view=item&layout=edit&id=19
If "Cliquez pour prévisualiser l'image" (default lightbox text for K2 Image lightbox)

Replace with:

&lt;a class=&quot;booknow popup-link&quot; href=&quot;www.quebecguitare.ca/admissions"><i class="fa fa-envelope-o"></i>Disponible pour Réservations - cliquez ici pour contacter ce professeur</a>

(<, >, " become &gt; &lt; &quot;)

So this works going to the link "www.quebecguitare.ca/admissions"

However I would like to open this link in the modal, just like a booking link on the K2 Item custom template.
www.quebecguitare.ca/admissions?tmpl=component

Here is the link for the K2 Item modal and this problem:
www.quebecguitare.ca/professeurs/montreal/daniel

Any clues?
Thank you
Regards

Here is the link for the K2 Item modal and this problem:
www.quebecguitare.ca/professeurs/montreal/daniel

Step to reproduce problem:
-Click on this link: www.quebecguitare.ca/professeurs/montreal/daniel
-Click on the K2 Image
-Look at the link at the bottom of the image
-Voilà

Regards.

This title is generated from the link's title attribute. You can change this to the item's title or something custom.

Hi Krikor, I do not understand your last reply.

Could you give more details?
Thank you
Regards

Open the item.php of that subtemplate. and locate title="<?php echo JText::_('K2_CLICK_TO_PREVIEW_IMAGE'); ?>"

This is what generates this title. You can change this to the item's title or a custom search.