Popup window features with lightbox

[nikos]

In Elxis 4.x as known you can create a menu item link in a popup window where in parameters you can select Popup window -> Lightbox window and in Elxis interface -> Only component and shows the article in a popup window in lightbox style (effect).

In this case the url is: http://www.mysite.com/inner.php/article.html

Trying to display the same url in the same effect popup from a link into an article's word, is not possible and it can be shown only as a typical popup window.

So i would like to suggest, if it is possible to a next update, to include into popup window features and the option of lightbox apart the typical one.

[webgift]

Lightbox requires a javascript and css file be included at the head tag of the html document. Instead of that it requires the jQuery library. So it would be a very bad idea to include such a feature to a next update (each time we are on an article page). The best way is to create a content plugin for that purpose.

[nikos]

Webgift this very bad looks to me as very absolute from your part and i was expecting a more gentle answer in case that you have a different opinion. The solution of plugin i know.

[webgift]

e? Which type of answer do you consider as 'gentle'? I am really sorry that i answered you. It won't happen again anyway.

[datahell]

Calm down!

Nikos Elxis 4.x does support lightbox windows from menu for any type of menu. It is easy to add one. You don't have to load jQuery or lightbox, Elxis does everything automatically.

Instructions
1. Select your preferred menu collection from the top menu (eg Menu > Mainmenu)
2. Click New and select your preferred type (eg. Link)
3. On the next page type a title and provide your Elxis link (eg. content:something.html)
4. On Other options select these:
Elxis interface : Only component
Popup window: Lightbox
Width: 600 (or anything else you want)
Height: 450 (or anything else you want)

Save it and you are ready.

[datahell]

Ooops, I just noticed that you want to load the lightbox from the article. So my above answer is wrong, sorry.

You can bind any html element to a lightbox with many methods, you can for example use data-url attribute or a special css class. Off course you will need to have lightbox loaded before as Stavros previously said.

Final answer to your question.
1. Make sure lightbox is loaded. You can put this in your template, or in your extension (if any)
$eDoc = eFactory::getDocument();
$eDoc->loadLightbox();

2.Now bind all A elements with class "something" (you can change it to anything you want) to lightbox:
$eDoc->addDocReady('$(".something").colorbox({iframe:true, width:600, height:450});');

We are ready!
Now any link you add having a CSS class "something" will open as iframe in a lightbox window.

Note: You don't have to load jQuery. When you load lightbox, Elxis also loads jQuery.

Example for WYSIWYG editor (using eLink plugin for portable links)
<a href="#elink:content:article.html" class="something">Open article in lightbox window</a>

Example for WYSIWYG editor (for inner.php links - not portable)
Note that eLink does not support inner.php links, so if you want to open the link only in component view you should use the full article's url:
<a href="http://www.example.com/inner.php/article.html" class="something">Open article in lightbox window</a>

Example for extensions (standard portable links)
$elxis = eFactory::getElxis();
$link = $elxis->makeURL('content:article.html');
echo '<a href="'.$link.'" class="something">Open article in lightbox window</a>';

Example for extensions (component view - inner.php- portable links)
$elxis = eFactory::getElxis();
$link = $elxis->makeURL('content:article.html', 'inner.php');
echo '<a href="'.$link.'" class="something">Open article in lightbox window</a>';

[nikos]

Thank you very much datahell for the fully documented answer to my topic.

Much appreciated!!!

[michalis1984]

Ooops, I just noticed that you want to load the lightbox from the article. So my above answer is wrong, sorry.

You can bind any html element to a lightbox with many methods, you can for example use data-url attribute or a special css class. Off course you will need to have lightbox loaded before as Stavros previously said.

Final answer to your question.
1. Make sure lightbox is loaded. You can put this in your template, or in your extension (if any)
$eDoc = eFactory::getDocument();
$eDoc->loadLightbox();

2.Now bind all A elements with class "something" (you can change it to anything you want) to lightbox:
$eDoc->addDocReady('$(".something").colorbox({iframe:true, width:600, height:450});');

We are ready!
Now any link you add having a CSS class "something" will open as iframe in a lightbox window.

Note: You don't have to load jQuery. When you load lightbox, Elxis also loads jQuery.

Example (using eLink plugin for portable links)
<a href="#elink:content:article.html" class="something">Open article in lightbox window</a>

Example (for inner.php links - not portable)
Note that eLink does not support inner.php links, so if you want to open the link only in component view you should use the full article's url:
<a href="http://www.example.com/inner.php/article.html" class="something">Open article in lightbox window</a>

Answers like this worth more than gold and must be bookmarked 

[datahell]

Thanks, I updated my reply for links generated by third party extensions too.
Elxis libraries are easy to use. If you want to do something and you dont know how, or which is the best method to do it, just ask. We are here to help.

Note: Links portability is important in cases you want to move an Elxis installation (eg. from your local computer to an online site, or the opposite). Hard coded links are not portable. You will have to edit the SQL file to fix them before importing it in database. This is why you should use elink plugin in your articles for internal linking (if possible). Same is for images (use the Image plugin).