How to Display a Joomla Login Form in a Popup Window

Display a Joomla Login Module in a Popup Box with Shack Toolbox

One question we had this week was from a Joomlashack customer who wanted to display a login module in a popup window. The idea is that visitors can log in without leaving the page they are on.

Our Shack Toolbox Pro extension is the perfect tool for this job. You will have a ton of design options to customize your popup.

In this guide, I'll show you how to display a login module inside a lightbox popup with Shack Toolbox Pro.

This image shows the end result after you've finished this guide:

final result

Let's take a look at how to set it up.

In your Joomla administrator panel, go to "Extensions" > "Modules":

go to extensions modules

This will bring you to the list of the modules installed on your Joomla site. You want to find the "Shack Toolbox Pro" and open it up for editing.

First, you need to tell "Shack Toolbox Pro" that you would like to display a module. Then you need to tell it exactly which module you'd like displayed.

  • Under the "Module" tab, click the "Any Module" box.
  • Select the "Login" module inside the "Choose module" option:

Click Any Module and select the Login

  • Set the "Position" option to the "debug" position of your Joomla template:

Set the Position to debug

Then you need to tell Shack Toolbox Pro how to open the popup with the "Login" module:

  • On page load or
  • On page scroll or
  • On page exit

For this blog post, I selected to display the Login popup on page load.

  • Go to the "Location & Effects" tab and set the position of the module to "Hidden":

Select the Hidden

  • Click the "Advanced" button and set the "Auto-open" parameter to "On load":

Click On load

At this point, you are done with the initial setup. You can click "Save" or "Save & Close" and you are done.

If you visit your Joomla site frontend, you will see your "Login" module popup, just as displayed in the image at the top of the post. But you don't have to stop here. 

"Shack Toolbox Pro" offers you a ton of options to fine-tune the design of your login popup box. You have 17 preset design themes on the "Theme" tab at your disposal:

choose this theme

Each of them offers you the "Theme customizer":

the theme customizer

Inside the "Theme customizer" you will find settings to fine-tune the following:

  • The popup box size
  • The popup box text
  • The popup box background
  • The box background image
  • The box toggler button and tab
  • Vertical toggler tab
  • Toggler size
  • Lightbox backdrop

Take a look at my screenshot with some of those customization options:

some design options

Additional Reading

What's Next?

Save $1000's when you sign up to Joomlashack's Everything Club.

You will get access to all our extensions, templates, and Joomla training.

Click here to join the Everything Club