Popup Ts&Cs for a UDF

This How-To shows the steps to display a popup of your Terms and Conditions in a link below the UDF checkbox to 'Accept Terms'.

There are three steps involved:

  1. Create your Terms & Conditions content article
  2. Create a menu to display the Tc&Cs article
  3. Create a UDF help link to open them in a popup.


Step 1.

I will not cover how to create a content article as you already know how to do that.

Some points to consider while making it..

  • Do not have links inside your T&C article as it will be displayed in a modal popup.
  • Do not place large (or any) images in your article as the popup is a fix size.


Step 2.

Like step 1, you already know how to create a menu to display a content page in Joomla.

When you create the menu, turn off all display options so you get a plain window with your content.



Step 3.

In the UDF setup screen you will be entering the 'Help Text':



To make the link a modal popup in Joomla you add class="modal"

To make the popup not show the Joomla framework you add ?tmpl=component  
(if you are not using SEO and your URL already has a ?, add &tmpl=component)

The Help text added should be like this..

To view Terms <a class="modal" href="/terms-conditions.html?tmpl=component" rel="{handler: 'iframe', size: {x: 320, y: 480}, onClose: function() {}}">Click Here</a>

The 'handler' sets the popup size so you can adjust that as required.

The result is..




Displaying a modal popup in Joomla requires the template have that feature enabled. Most (all?) do, but if yours does not you will see a new page rather than a popup. 

You may need to add <?php JHTML::_('behavior.modal'); ?> to your template.