Create Lightboxes in Joomla with Modals

Are you looking to create a popup effect or turn a link into a popup window? These are also known as modals or lightboxes.

In this tutorial, I’ll show you how to create a modal effect in Joomla.

We’re going to use the NoNumber extension called Modals.

This tutorial will work with Joomla 2.5 and 3.

Install Modals

You can find Modals on the Joomla! Extensions Directory at this link.

Go to Extensions -> Extensions Manager -> Install

After installation this plugin is automatically set to enabled and ready to be used!

Use the {modal} tag

Use the {modal} {/modal} tag to create the popup effect. You can also use the class name = “modal” to have this lightbox effect as well.

media_1375161903752.png

If you want to test it out first, you can use this code:

1.{modal http://www.youtube.com/embed/tENZDoj5MTg|width=560|height=315|title=Learn all about What? Nothing!}Youtube video{/modal}

Now test it out and click on the “Youtube video” link. Viola!

Create a menu modal

You can also create the popup effect by putting the {modal}{/modal} tag.

Place it around a menu title located in your Menu Manager and the page or module will open up as a lightbox.

media_1375162850536.png

Viola! You have made a menu popup.

media_1375162969537.png

Gửi phản hồi

Please log in using one of these methods to post your comment:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Log Out / Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Log Out / Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Log Out / Thay đổi )

Google+ photo

Bạn đang bình luận bằng tài khoản Google+ Log Out / Thay đổi )

Connecting to %s

%d bloggers like this: