Joomla rating: 100%

Modals

Make modal popups in Joomla!

Version: 5.4.0   Type: PS
Download Free
Buy Pro  25

Joomla rating: 100%

Do you like Modals?

Rate it!

Description

Modals is a Joomla plugin extension to help you create cool modal popup, like this!

You can make modal popups for texts, articles, other internal pages, external pages, images, videos, galleries , whatever you want.

Modal popup windows are fancy popup boxes also known as lightboxes.

Full control

Modals is packed with options to control the modal popups.

  • Full controll over styling (via some styling options and CSS)
  • Define dimensions and
  • Create image popups quickly and easily
  • Make galleries and slideshows automatically Pro only
  • Make popups open on pageload Pro only
  • And many more...

Activators

There are several ways Modals can covert links:

  • Via the special Modal tags {modal ...}...{/modal}
  • By class names (all links with defined class names)
  • All external links Pro only
  • By target="_blank" (all links with a target. Internal and/or external) Pro only
  • By filetypes (all links to given filetypes) Pro only
  • By url (also supports regular expressions) Pro only

Colorbox

Modals utilizes the fabulous modal script Colorbox by Jack Moore. Kudos to him!

Free vs Pro

Free

Free

Enough functionality for most websites!

Unlimited access to free updates and support.

Features

  • Create modal links anywhere
    • Modals gives you the power to create modal popup links anywhere you can enter text. So also in modules.
  • Different modal styles
    • You have to possibility to choose from different modal styles. You can choose the one that best fits your websites style.
  • Image & video popups
    • Make your images, videos and other media urls popup in a modal window.
  • Convert links by
  • Modal tag
    • Use a quick and easy modal tag anywhere in your content to create modal links. You can even use these to convert your menu items to modal links (with most menu modules).
  • Classname
    • Give links a user-defined classname and Modals will create a modal link from it.

Free support

  • Access to Free forum
    • Get support for the extension.
      Response time aim: within 72 hours. Usually within 24 hours.
  • Install on multiple domains
    • You can install the extension on any domain you want. No limitations. No domain checks.
  • Open Source code
    • The code is open source (GPL), meaning there is no form of code encryption. No use of Zend Guard or ionCube.

Professional

 25

Need more? Get all Pro features and support.

1 year access to Pro updates and support.

Pro features

  • All features available in the free version, plus:
  • Galleries & slideshows
    • Create complete galleries with just 1 tag. Add slideshow functionality to your galleries
  • Inline content
    • Create modal popups with content that is in your article. You do not need to create separate articles/urls. This is especially useful for short pieces of text.
  • Group links
    • Group any modal links (via the modal tag) on your page, so you can use the modal navigation to go to the next/previous link.
  • Open on pageload
    • Make Splash page modal popups that will show when you first load the page.
  • Convert links by
  • Modal tag
    • Use a quick and easy modal tag anywhere in your content to create modal links. You can even use these to convert your menu items to modal links (with most menu modules).
  • Classname
    • Give links a user-defined classname and Modals will create a modal link from it.
  • External Links
    • Let Modals open all external links in modal popups.
  • Target blank
    • Let Modals convert all links with a target=_blank to modal links.
  • Filetypes
    • Want to make all pdfs open in modal links? No problem with Modals. Or any other file types for that matter.
  • URLs
    • Specify certain urls to always open in modals. You can also use the powerful Regular Expressions to define urls.

Pro support

  • Access to Pro forum
    • Get faster support for the extension.
      Response time aim: within 48 hours. Usually within 12 hours.
  • Pro downloads & updates
    • Get access to the Pro downloads and updates for a full year.
  • Install on multiple domains
    • You can install the extension on any domain you want. No limitations. No domain checks.
  • 30 Day money back guarantee
    • Not happy with the extension? Or simply have no use for it after trying out the Pro version? Simply ask your money back!
  • Open Source code
    • The code is open source (GPL), meaning there is no form of code encryption. No use of Zend Guard or ionCube.

Bundle offer

Get ALL NoNumber Pro extensions worth 375

And save 60%

1 year access to Pro updates and support.

 150 Buy a Bundle

Lifetime Bundle

Get LIFETIME access to ALL NoNumber Pro extensions.

And save loads

LIFETIME access to Pro updates and support.

 500 Buy a Lifetime Bundle

Tutorial

There is a Free and a Pro version of Modals.
The parts in this tutorial that only concern the Pro version will be marked with: Pro only

Introduction

Modals is a Joomla plugin extension to help you create cool modal popup, like this!

Simple Modals

All you have to do to create a link is place the url inside the {modal} opening tag. Place the text of the 'link' you want people to click on between the {modal} opening and {/modal} closing tag.

{modal my/url}Click on me!{/modal}

Example: Internal url

{modal index.php/123-my-article}Internal url{/modal}

Example: External url

{modal https://goo.gl/5r5faj}External url{/modal}

Add a Title

You can add a title by adding a title attribute in the {modal} opening tag, like:

Example: I've got a title

{modal https://goo.gl/5r5faj|title=That's my place :)}I've got a title{/modal}

Link to an Image

You can also link to images. Modals will recognise links to images and adjust the styling of the modal window a bit to accommodate this.

Example: Image

{modal images/fruit/bananas.jpg|title=Totally bananas}Image{/modal}

Add link to an Image

To add a modal link to an image, simply place the {modal} tags around the image.

Example:

{modal index.php/123-my-article}{/modal}

Link to a Video

Example: Youtube video

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

Example: Vimeo video

{modal https://player.vimeo.com/video/32823876|width=500|height=409|title=Whaah! That's me}Vimeo video{/modal}

Quick link to an article Pro only

With the pro version of Modals you can link directly to a Joomla article without having to know the exact url. You can simply place the article's title, alias or id after the article= attribute.

Examples:
Link using article title
Link using article alias
Link using article id

{modal article=My Article}Link using article title{/modal}
{modal article=my-article}Link using article alias{/modal}
{modal article=123}Link using article id{/modal}

Width & Height

By default the modal window will auto size for internal urls and will open in the maximum size for external urls.

You can overrule the width and/or height by setting these to a fixed pixel or percentage value.

Example: 500 x 500px

{modal index.php/123-my-article|width=500|height=500}500 x 500px{/modal}

Example: 60% x 40%

{modal index.php/123-my-article|width=60%|height=40%}60% x 40%{/modal}

Open menu items in modals

To make a menu item open in a modal popup, simply surround the menu title in {modal} tags.

So if your menu item title is Click here!, change it to {modal}Click here!{/modal}.

You can also pass extra variables in the tag as described earlier, like: {modal title=My Page}Click here!{/modal} or {modal width=600|height=400}Click here!{/modal}.

If for some reason you don't want to use the {modal} tags (or it doesn't work), you can also give the menu item a custom classname (works with most menu modules) and set Modals up to convert by that classname.

Galleries & Slideshows Pro only

Auto galleries

You can very easily create a gallery by a single modal tag with a gallery attribute (which holds the folder containing of your images).

You can tell Modals to show special thumbnails images in your content, by adding image files that have the thumbnail suffix added to them (default: _t).
So the thumbnail for image apples.jpg should be apples_t.jpg.

Example:

{modal gallery=images/gallery}{/modal}

Custom link

If you place anything between the modal tags, that will be used as link to open the gallery. This can be text or an image or basically anything you want.

Example: Click here

{modal gallery=images/gallery}Click here{/modal}

Different first image

The first image (thumbnail) in the folder will be shown in the content. If you want to show a different image instead, add a first attribute.

Example:

{modal gallery=images/gallery|first=bananas.jpg}{/modal}

Show all thumbnails

By default only the thumbnail of the first found image in the folder will show (you can change this default setting).
To make the thumbnails of all the images show,add showall=1 to the modal tag.

Example:

{modal gallery=images/gallery|showall=1}{/modal}

Slideshow

To create a slideshow, simply add slideshow=1 to the modal tag.

Example:

{modal gallery=images/gallery|slideshow=1}{/modal}

Filtered

You can overrule the default filter with your own. This example only shows images form folder images/fruit that end in _x (just before the file extension).

Example:

{modal gallery=images/fruit|filter=_x\.}{/modal}

Custom images and thumbnails

You might want to define your own specific images, because they are not in the same folder, or because you don't want all images in the folder to show.
To create a gallery with custom image paths, create a modal tag for every image and add a group attribute to the modal tags.

Example:

{modal images/fruit/bananas_x.jpg|group=mygallery}{/modal} {modal images/fruit/limes_x.jpg|group=mygallery}{/modal} {modal images/fruit/strawberries_x.jpg|group=mygallery}{/modal}

Slideshow

To create a slideshow on these custom galleries, you need to add slideshow=1 to every modal tag in the group.

Example:

{modal images/fruit/bananas_x.jpg|group=mygallery2|slideshow=1}{/modal} {modal images/fruit/limes_x.jpg|group=mygallery2|slideshow=1}{/modal} {modal images/fruit/strawberries_x.jpg|group=mygallery2|slideshow=1}{/modal}

Inline content Pro only

Content in tag

You can place content straight into the modal tag. This is great for when you don't want to create a separate article just for one link.

For short pieces of custom text you can use the html attribute:

Example: Show some inline text

{modal html=This text is entered right inside the modal tag.|title=Hello!}Show some inline text{/modal}

Content in separate content tag

For larger content blocks pieces of custom text you can use the content attribute in combination with modalcontent tags

You can choose an alias for the modalcontent tag and you need to place that alias as value in for the content attribute.

Example: A lot more inline content

{modal content=mycontent|title=Fully styled inline content}A lot more inline content{/modal}
{modalcontent mycontent}
... your fully styled content...
{/modalcontent}

By using the modalcontent tags, you can place entire content blocks into the modal without the need of creating separate articles/urls.

You are also free to place fully whatever style and type of content you want in here:

Lorem Ipsum

applesPellentesque habitant morbi tristiquesenectus et netus et malesuadafames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis.

Header Level 2

  1. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
  2. Aliquam tincidunt mauris eu risus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.

Header Level 3

  • Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
  • Aliquam tincidunt mauris eu risus.
#header h1 a { 
	display: block; 
	width: 300px; 
	height: 80px; 
}

Grouped mixed content Pro only

You can group different types of links by adding a group attribute to the modal tag.
This will give you arrow navigation to the different links inside the modal popup.

  1. Internal url
  2. External url
  3. Inline content
  4. Image
  5. Video
{modal index.php/123-my-article|group=mygroup}Internal url{/modal}
{modal https://goo.gl/5r5faj|group=mygroup}External url{/modal}
{modal html=This text is entered right inside the modal tag.|group=mygroup}Inline content{/modal}
{modal images/fruit/bananas.jpg|group=mygroup}Image{/modal}
{modal https://www.youtube.com/embed/tENZDoj5MTg?wmode=transparent|width=560|height=315|title=Learn all about What? Nothing!|group=mygroup}Video{/modal}

Auto-close Pro only

You can make a modal window auto-close after a given amount of time using the autoclose attribute.

To make the modal close after the default amount of time set in the Modals plugin settings, simply add the autoclose=1 attribute:

Example

{modal my/url|autoclose=1}...{/modal}

But you can also set a different time in milliseconds. So if you want to auto-close the modal after only 2 seconds, do:

Example

{modal my/url|autoclose=2000}...{/modal}

Splash pages : Open modal on pageload Pro only

To make modal popup on pageload, simply add the open=1 to the {modal} tag, like:

{modal my/url|open=1}...{/modal}

If you do not want to show the actual link to the page, then simply don't place any text between the {modal} tags, like:

{modal my/url|open=1}{/modal}

The syntax for modal popup you can see on the demo page looks like:

{modal html=Yes, you can also make modal popups show on page load!|title=Welcome to the Modals Demo|open=1|autoclose=5000}{/modal}

Show only once

To make a modal popup only show once, you can use open=once, like:

{modal html=This modal will only show once|open=once}{/modal}

  By default, Modals will keep track of the count via a site wide cookie. If you want this count to be based on the individual page visits, then you can change that in the Modals system plugin settings. You can also choose to base the count on the site wide session count instead.

Show on specific page loads

You can also tell Modals to show the modal on a specified range of visits, using the open attributes. For instance, to show a modal on the second, third and fourth page load, you can do:

{modal html=This modal will only show once|open=2-4}{/modal}

This way you can have one modal for first page load, and another for the second.

  By default, Modals will keep track of the count via a site wide cookie. If you want this count to be based on the individual page visits, then you can change that in the Modals system plugin settings. You can also choose to base the count on the site wide session count instead.

Settings

These options that can be overrules inside the {modal} tag like you can see in above examples.

So the syntax for overruling settings in the {modal} tag is:

{modal my/url|setting_name=setting_value|setting_name=setting_value|etc}...{/modal}

The settings marked with a * can be set to a different default value in the Modals system plugin settings.

The Free version ONLY allows these settings: url, title, width, height, iframe.

NameDefault valueDescription
url / href   The url or element to open in the modal. You do not have to use the setting name in the {modal} tag if the url is defined as first parameter. So these all work:
{modal my/url}...{/modal}
{modal url=my/url}...{/modal}
{modal href=my/url}...{/modal}
content   The id of the content (set by the {modalcontent} tag) to open in the modal:
{modal content=mycontent}...{/modal}
{modalcontent mycontent}This text appears inside the modal!{/modalcontent}
html   For displaying a string of HTML or text:
{modal html=This text appears inside the modal!}...{/modal}
title   This can be used as an anchor title alternative for the modal.
className   Adds a given class to the modal and the overlay.
iframe false If true, specifies that content should be displayed in an iFrame. For external urls this is automatically set to true.
photo false If true, this setting forces the modal to display a link as a photo. Use this when automatic photo detection fails (such as using a url like 'photo.php' instead of 'photo.jpg')
scrolling true If false, the modal will hide scrollbars for overflowing content. This could be used on conjunction with the resize method (see below) for a smoother transition if you are appending content to an already open instance of the modal.
open true If true, the modal will immediately open on pageload.
transition * elastic The transition type. Can be set to "elastic", "fade", or "none".
speed * 350 Sets the speed of the fade and elastic transitions, in milliseconds.
scalePhotos * true If true, and if maxWidth, maxHeight, width, or height have been defined, the modal will scale photos to fit within the those values.
returnFocus * true If true, focus will be returned when the modal exits to the element it was launched from.
fastIframe * true If false, the loading graphic removal and onComplete event will be delayed until iframe's content has completely loaded.
opacity * 0.8 The overlay opacity level. Range: 0 to 1.
overlayClose * true If false, disables closing the modal by clicking on the background overlay.
closeButton * true If false, removes the close button.
escKey * true If false, will disable closing the modal on 'esc' key press.
arrowKey * true If false, will disable the left and right arrow keys from navigating between the items in a group.
Dimensions
width *   Set the fixed dimension. In pixels (ie 500) or percentage (ie 80%).
height *   Set the fixed dimension. In pixels (ie 500) or percentage (ie 80%).
externalWidth *   Set the fixed dimension for external urls. In pixels (ie 500) or percentage (ie 80%).
externalHeight *   Set the fixed dimension for external urls. In pixels (ie 500) or percentage (ie 80%)./td>
initialWidth * 600 Set the initial dimension, prior to any content being loaded. In pixels (ie 500) or percentage (ie 80%).
initialHeight * 450 Set the initial dimension, prior to any content being loaded. In pixels (ie 500) or percentage (ie 80%).
maxWidth * 95% Set the maximum dimension for loaded content. In pixels (ie 500) or percentage (ie 80%). Set to 0 for no maximum.
maxHeight * 95% Set the maximum dimension for loaded content. In pixels (ie 500) or percentage (ie 80%). Set to 0 for no maximum.
Positioning
fixed * false If true, the modal will be displayed in a fixed position within the visitor's viewport. This is unlike the default absolute positioning relative to the document.
reposition * true Repositions the modal if the window's resize event is fired.
top *   Accepts a pixel or percent value (50, "50px", "10%"). Controls the modal's vertical positioning instead of using the default position of being centered in the viewport.
bottom *   Accepts a pixel or percent value (50, "50px", "10%"). Controls the modal's vertical positioning instead of using the default position of being centered in the viewport.
left *   Accepts a pixel or percent value (50, "50px", "10%"). Controls the modal's horizontal positioning instead of using the default position of being centered in the viewport.
right *   Accepts a pixel or percent value (50, "50px", "10%"). Controls the modal's horizontal positioning instead of using the default position of being centered in the viewport.
Groups / Slideshows
group / gallery   This allows the user to group any combination of elements together for a gallery.
preloading * true Allows for preloading of 'Next' and 'Previous' content in a group, after the current content has finished loading. Set to false to disable.
loop * true If false, will disable the ability to loop back to the beginning of the group when on the last element.
slideshow * false If true, adds an automatic slideshow to a content group / gallery.
slideshowSpeed * 2500 Sets the speed of the slideshow, in milliseconds.
slideshowAuto * true If true, the slideshow will automatically start to play.
Auto-Gallery
showall * false If selected, all thumbnails in the given gallery folder will be automatically shown.
thumbSuffix * _t The suffix to identify the thumbnail to show as the link. Example with default value '_t': if the main image is 'apple.jpg', then the thumbnail image is 'apple_t.jpg'.
thumbWidth *   Set the thumbnail dimension in pixels (ie 80). Leave empty to not force a specific size.
thumbHeight *   Set the thumbnail dimension in pixels (ie 80). Leave empty to not force a specific size.
separator * (space) Set the separator html for the images in the gallery. By default this is a space. Enter {none} to have no spacing between images.
filter * \.(png|jpg|gif|eps) The filter (Regular Expression) used to find the image files in the given gallery folder.
Retina Images
retinaImage * false If true, the modal will scale down the current photo to match the screen's pixel ratio
retinaUrl * false If true and the device has a high resolution display, the modal will replace the current photo's file extention with the retinaSuffix+extension
retinaSuffix * @2x.$1 If retinaUrl is true and the device has a high resolution display, the href value will have it's extention extended with this suffix. For example, the default value would change 'my-photo.jpg' to ''

Installation

You can either install Modals by using the core extension manager available in the Joomla! Administrator Control Panel, or by using the powerful NoNumber Extension Manager.

Note: When updating Modals, you do not need to uninstall it first. The package will update all the files automatically.

Keep in mind that when you update to a major new version (or uninstall first), you might lose some configuration settings.

NoNumber Extension Manager

It is very easy to install/update any NoNumber Extension using the NoNumber Extension Manager.

Please see the User Guide for the NoNumber Extension Manager for more detailed information...


Joomla! Extension Manager

To install via the Joomla! Extension Manager, just follow these steps:

  1. Log into your Joomla administrator;
  2. In the menu, choose: Extensions >> Extension Manager;
  3. Choose the tab: Install from Web (or enable it if you haven't done so yet);
  4. Select the search field and enter Modals and hit enter;
  5. Click on the Modals listing;
  6. Click on Install;
  7. Click on Install to confirm.
Joomla! Installer - Install from Web

Or if you need to install the Pro version or cannot install via the 'Install via Web' method for some reason:

  1. Download the extension install file (.zip);
  2. Log into your Joomla administrator;
  3. In the menu, choose: Extensions >> Extension Manager;
  4. Choose the tab: Upload Package File;
  5. Click on the Choose File button and select the extension zip;
  6. Click on Upload & Install.
Joomla! Installer - Upload Package File

If you have problems installing Modals, please try the manual installation process as described here: docs.joomla.org/Installing_an_extension

FAQs

The {modal} tags are not being converted

The Modals plugin is not published

Check if the Modals plugin is published. Go to Extensions >> Plugin manager and search for the system plugin System - NoNumber Modals. Then publish it.

There is markup on the {modal} tags

If you have copy/pasted code directly into your editor, you might also have copied along hidden HTML tags. So this will also cause the {modal} tags to break:

{<span>modal</span> ...}

Remove the extra styling or other html tags around and in the {modal} tags that might cause problems.

The modal redirects to a white page with an email address

This is caused by the Joomla core "Content - Email Cloaking" plugin.

I recommend you use Email Protector instead, or disable the core plugin.

The modal does not have the correct styling

Modals uses the sub-template modal by default (which you can change in the Modals plugin settings).

This means that Modals will tell Joomla to show the page using the modal template view.
Joomla will look in your templates folder for a modal.php file, and if there is none, it will use the modal.php file from the system template.

If you want to customize this sub-template, you can copy that modal.php file to your templates folder, or copy your templates component.php (if available) and name it to modal.php.
Then you can change it to how you want, like adding stylesheets.

The page in the modal window won't load

This could have a few reasons:

  • The url is not correct. Double check if the url loads the page when placed directly in your browser.
  • You are linking to an external site which doesn't allow you to open it inside your site. Some (usually larger) sites have a protection script which prevents it from being opened inside iframes in other sites. Sites like Google, Youtube, Facebook. See if they offer an 'embed' url for the page you are trying to link to.
  • You are trying to open a non-SSL url in an SSL site. If you are running your page in HTTPS mode (SSL), you cannot open any HTTP (non-SSL) pages with Modals. This is a protection on browser level.

Installation

How can I install/upgrade Modals?

You can either install Modals by using the core extension manager available in the Joomla! Administrator Control Panel, or by using the powerful NoNumber Extension Manager.

Note: When updating Modals, you do not need to uninstall it first. The package will update all the files automatically.

Keep in mind that when you update to a major new version (or uninstall first), you might lose some configuration settings.


Modals won't install...

If you have problems installing Modals, please try the manual installation process as described here: docs.joomla.org/Installing_an_extension

How can I uninstall Modals?

You can either uninstall Modals by using the core extension manager available in the Joomla! Administrator Control Panel, or by using the powerful NoNumber Extension Manager.

If you no longer use any NoNumber extensions, you can also uninstall the NoNumber Framework plugin by using the Joomla! core extension manager.

What are the minimum requirements?

Modals will only work correctly if your setup meets these requirements:

  • Up-to-date version of Joomla:
    • Joomla 3.4.1 or higher
  • PHP 5.3.13 or higher
  • PHP mbstring (Multibyte String) functions enabled
  • MySQL 5 or higher

Important: I can only provide support for setups that:

  • meet the above requirements;
  • do not have extension files or Joomla! core files which have been altered in any way.

Where can I download earlier versions?

You have access to all previous free versions of all extensions on this website.

If you have a subscription to an extension, you can also download any previous pro version of any extension on this website.

If you do not have a valid subscription, you can download any pro version that is older than 1 year.

You can find old versions in the changelog.

Note: Please note that I am unable to provide support on old versions! (whether you have a subscription or not).

How can I downgrade to an earlier version of Modals?

If for some reason you need to install an older version, it is best to uninstall the extension first.

You will also have to uninstall the NoNumber Framework system plugin.

After that you can simply install the older version zip file using the Joomla! installer.

Note: Please note that I am unable to provide support on old versions!

How can I upgrade from Joomla 2.5 to Joomla 3?

The upgrade of Joomla itself is a one-click process. But that just takes care of Joomla.

Many templates and extensions will not work the same or at all after upgrading to Joomla 3.

I personally advise against using the built-in upgrade process, and advise starting from scratch by installing a fresh copy of Joomla 3.

If you do want to upgrade Joomla 2.5 to Joomla 3, you will need to do this with regards to the NoNumber extensions you have installed:

  1. Disable or uninstall all NoNumber extensions.
    (Uninstalling NoNumber extensions will make you lose any global configuration settings for that extension. You will not lose any saved items)
  2. Upgrade Joomla 2.5 to Joomla 3.
  3. Re-install all NoNumber extensions you want installed.

For a detailed step-by-step migration process, see: https://docs.joomla.org/Joomla_2.5_to_3.x_Step_by_Step_Migration

Licensing

Under what license are NoNumber extensions released?

All free and paid NoNumber extensions are released under the Open Source GNU GPL v2.0 license.

See the Terms & Conditions for additional terms.

NoNumber Framework

What is the NoNumber Framework?

The NoNumber Framework is a Joomla! system plugin that is installed along with every NoNumber extension.

This plugin contains all the common functions and language strings that the NoNumber extensions use.

If you use any NoNumber extensions, this plugin must be installed and published. They will not function correctly or they will not function at all without it.

What is the NoNumber Elements plugin?

The NoNumber Elements system plugin is no longer used and has been replaced by the NoNumber Framework.

If you have been using NoNumber extensions for a long time you may still have this Elements plugin installed.

The NoNumber Elements plugin can safely be uninstalled IF your NoNumber extensions are up-to-date.

More Questions

I cannot find an answer to my question

Is there no answer to your question in this list, please try out these options:

  • General FAQs
    For general questions see the Pre-Sale Questions & Answers.
  • Tooltips
    All settings/options for the installed extensions have tooltips that explain what that setting is for. That should give you enough information to know how to use it.
  • Google
    Google is your friend! If you have some problem, get an error, have a question, try out Google. It usually gives you enough feedback to find an answer.
  • Forum
    For more specific questions or feedback, please use the Forum.

Changelog

+ Added   - Removed   ^ Changed   # Fixed

18-May-2015 : v5.4.0

Download Free

 # Added ability to give links an id
 # PRO Added ability to open modals on page load via the url (modal=modalid)
 # PRO Fixed issue with hidden gallery links getting styling when using custom classes
 # PRO Fixed issue with images with uppercase extensions not being included in gallery
 # J3FREE Fixed issue with error about undefined property disable_components

04-Apr-2015 : v5.3.0

Download Free

 + Added ability to ignore urls when using auto-convert options
 ^ Updated translations: id-ID, sv-SE, uk-UA
 ^ J3 Improved rendering speed on pages with large contents
 # PRO Fixed issue with components select list only saving one value

31-Jan-2015 : v5.2.1

Download Free

 # FREE Fixed issue with undefined property $tag_content

30-Jan-2015 : v5.2.0

Download Free

 + Added translations: uk-UA
 + PRO Added ability to base the open count on website wide cookies
 + PRO Added ability to overrule the open count based on setting via the opentype parameter
 + PRO Added ability to set the lifetime of the open count cookie
 + PRO Added ability to set the open min and max via open=x-x, like open=1-3
 + PRO Added ability to set the open once via open=once
 # Fixed issue with url parameters in youtube/vimeo urls being lost

14-Jan-2015 : v5.1.2

Download Free

 + J3PRO Added option to remove/keep plugin syntax on disabled components
 # FREE Fixed issue with styling of title bar not being adjusted when title is empty
 # PRO Fixed issue with disable on components option not working

08-Jan-2015 : v5.1.1

Download Free

 ! Removed compatibility for php versions under 5.3.13
 ! J3 Removed compatibility for Joomla 3 versions under 3.3.0
 ^ Updated translations: id-ID
 # Fixed issue with Free version being able to be installed over the Pro version
 # PRO Fixed issue with current active item id being added to article links instead of default
 # PRO Fixed issue with open as iframe setting also affecting inline content links

18-Nov-2014 : v5.1.0

Download Free

 + PRO Added ability to set onOpen, onLoad, onComplete, onCleanup, onClosed functions via tag
 + PRO Added ability to switch off the close button in the settings
 # Fixed issue with error about nnFile on installation on some setups
 # Fixed issue with javascript error about modal_defaults in some cases using gzipping
 # PRO Fixed issue with autoclose timeout not being cleared when window is closed manually

11-Nov-2014 : v5.0.6

Download Free

 ^ Moved modals scripts to self-contained function which can be triggered by initModals()
 # PRO Fixed issues with duplicate rows in update_sites table

03-Nov-2014 : v5.0.5

Download Free

 # Fixed issue with internal modal window breaking on some setups when redirect script is placed
 # PRO Fixed issue with youtube/vimeo urls using http instead of https

01-Nov-2014 : v5.0.4

Download Free

 # Fixed issue with form elements not getting unprotected (remaining encoded) in some cases

28-Oct-2014 : v5.0.3

Download Free

 # Fixed issue with {modal} tags around menu items not working in some cases

22-Oct-2014 : v5.0.2

Download Free

 # Fixed issue with jQuery not getting loaded on some setups

22-Oct-2014 : v5.0.1

Download Free

 # FREE Fixed issue with Undefined property $autoconvert_classnames_images

22-Oct-2014 : v5.0.0

Download Free

 + Added ability to place own styles in the css folder (file will show up in selection)
 + Added extra yes/no select fields for auto-convert options
 + Improved handling of non-embed versions of youtube/vimeo urls
 + PRO Added ability to create a link to an article with the title or alias of the article using the article= attribute
 + PRO Added ability to create galleries via image classnames
 + PRO Added ability to set an auto close in milliseconds with parameter autoclose=
 + PRO Added ability to set gallery titles and descriptions for individual images via a data.txt
 + PRO Added ability to set link to youtube/vimeo videos by tag parameter youtube= and vimeo=
 ^ Changed styling of title bar if title is empty
 ^ Improved handling of tags inside links
 ^ Improved styling and display of the description
 ^ Updated ColorBox to version 1.5.14
 # Fixed issue with modal window being tiny when width/height are not set in iframe mode on internal urls
 # Fixed issue with php warning about Unknown modifier '.' in protect.php
 # Fixed issue with plugin not being run over introtext/fulltext on onContentPrepare event
 # Fixed issue with plugin not working on jDownloads frontend view
 # Fixed issue with quotes in titles and descriptions
 # Fixed issue with redirect script not working when not in iframe mode
 # Fixed issue with scripts/styles not being removed when no modal links are found
 # PRO Fixed issue with modal tag with html= parameter sometimes pushing text to new line

26-Aug-2014 : v4.12.3

Download Free

 # FREE Really, really, really fixed issue with code being messed up and breaking the page (argh!)

26-Aug-2014 : v4.12.2

Download Free

 # FREE Really fixed issue with code being messed up and breaking the page

26-Aug-2014 : v4.12.1

Download Free

 # FREE Fixed issue with code being messed up and breaking the page

26-Aug-2014 : v4.12.0

Download Free

 + PRO Added ability to set the closeButton value in the tag
 + PRO Added option to set the open count (used with openOnce, openMin and openMax attributes) to page instead of website
 ^ Updated translations: id-ID
 # PRO Fixed issue with gallery not handling UTF-8 characters well in file names

19-Aug-2014 : v4.11.1

Download Free

 # PRO Fixed issue with all images in gallery getting the same title

15-Aug-2014 : v4.11.0

Download Free

 + PRO Added ability to create a link to an article with only the article id using the article= attribute
 + PRO Made title overridable with a fixed title for galleries via the tag
 ^ Refactored code
 ^ Updated ColorBox to version 1.5.13
 ^ Updated translations: es-ES, lt-LT
 # Fixed issue with lowercase option missing from title case option
 # Fixed issue with tags being converted in com_myjspace edit forms
 # J2 Added missing jQuery.noConflict()
 # J2 Fixed issue with errors after upgrade to Joomla 3
 # J3 Fixed issue with tags not being handled in search results

26-May-2014 : v4.10.1

Download Free Download Pro (older than 1 year)

 ! J3 Removed compatibility for Joomla 3 versions under 3.2.2
 # PRO Fixed issue with error about in_array

22-May-2014 : v4.10.0

Download Free Download Pro (older than 1 year)

 + Added options to control auto title casing
 ! Removed incorrect translations of the URL field description
 ^ Updated translations: id-ID
 # Fixed issue with links with a target inside the modal window having the ml and iframe url variables

13-May-2014 : v4.9.0

Download Free Download Pro (older than 1 year)

 + PRO Added ability to set delay in modal popups that open on page load
 ^ Updated ColorBox to version 1.5.9
 ^ Updated translations: lt-LT, nl-NL
 # Fixed issue with mobile setting not working
 # PRO Fixed issue with modals losing settings (like title) when multiple on page (in some cases)

29-Apr-2014 : v4.8.0

Download Free Download Pro (older than 1 year)

 + Added option to load scripts/styles in inline modal again (disabled by default)
 + Added translations: fr-FR, id-ID, nl-NL
 + PRO Added option to disable modals on mobile (narrow) screens
 ^ Improved load speed of internal pages when not using iframe mode
 ^ Made file type detection case insensitive
 # Fixed issue with html structure issues when tags are directly inside html 5 elements

05-Apr-2014 : v4.7.4

Download Free Download Pro (older than 1 year)

 # Fixed issue with Modals not working on AcyMailing frontend views

05-Mar-2014 : v4.7.3

Download Free Download Pro (older than 1 year)

 # J2 Added option to load jQuery v2.1.0 instead of v1.11.0

27-Feb-2014 : v4.7.2

Download Free Download Pro (older than 1 year)

 ^ Updated translations: sv-SE
 ^ J2 Downgraded jQuery from version 2.0.3 to 1.11.0 to restore IE8 compatibility
 # Fixed issue with some missing language strings in some occasions
 # PRO Fixed issue with gallery showing last image first when tag has content

02-Jan-2014 : v4.7.1

Download Free Download Pro (older than 1 year)

 ^ Improved some code in NoNumber Framework which improves page load speed
 ^ Updated translations: nl-NL
 # Fixed issue with tags being encoded in frontend edit views

06-Dec-2013 : v4.7.0

Download Free Download Pro (older than 1 year)

 + Added ability to set a description
 + Added ability to set onSomething triggers in the {modal} tags
 ^ Updated ColorBox to version 1.4.33
 # Fixed installation error about duplicate entry on some MySQL 5.6 setups
 # Fixed issue with frontend edit form not working when Modals plugin is enabled

07-Nov-2013 : v4.6.1

Download Free Download Pro (older than 1 year)

 ^ Updated translations: lt-LT
 # Fixed issue with multiple image galleries sometimes being grouped together
 # Fixed issue with tags in Sourcerer code being converted
 # Fixed issue with tags in some text and textarea fields being converted

22-Oct-2013 : v4.6.0

Download Free Download Pro (older than 1 year)

 + Added option to make modals open as iframe by default
 + Added option to set the sub template
 ^ Updated translations: sl-SI

18-Oct-2013 : v4.5.0

Download Free Download Pro (older than 1 year)

 + Added translations: pt-PT
 + PRO Added ability to load modal on page load only once using openOnce or use openMin and openMax
 ^ Changed javascript minification to use Google Closure
 ^ Updated ColorBox to version 1.4.32
 ^ Updated translations: ca-ES, de-DE, el-GR, es-ES, hi-IN, it-IT, ja-JP, nb-NO, nl-NL, pl-PL, ru-RU, sl-SI, sv-SE, th-TH, uk-UA, zh-TW
 # PRO Fixed issue with first image showing as last number in gallery mode

26-Sep-2013 : v4.4.1

Download Free Download Pro (older than 1 year)

 ^ Updated ColorBox to version 1.4.31
 ^ Updated translations: de-DE, lt-LT
 # Fixed issue with tags not being handled when site has invalid html structure
 # PRO Fixed issue with slideshow not working when using the open=1 attribute

23-Aug-2013 : v4.4.0

Download Free Download Pro (older than 1 year)

 + PRO Added option to disable on selection of components
 ^ Made texts previous, next and close translatable via language files
 # Fixed issue with AcyMailing pages opened by Modals breaking
 # Fixed issue with opening tags not being converted on some setups
 # Fixed issue with tags sometimes appearing in title tags and title attributes

13-Aug-2013 : v4.3.1

Download Free Download Pro (older than 1 year)

 ^ Updated ColorBox to version 1.4.27
 ^ Updated translations: es-ES, lt-LT
 # Fixed issue with links being handled on AcyMailing pages
 # Fixed issue with relative internal links not being handled correctly

05-Jul-2013 : v4.3.0

Download Free Download Pro (older than 1 year)

 + Added option to redirect script in case link is not loaded in modal window (on by default)
 + Added setting to always open given filetypes in iframe mode (fixes issue with pdfs)
 ^ Updated ColorBox to version 1.4.26
 ^ Updated translations: es-ES
 ^ J2 Updated jQuery to version 2.0.3
 # J2 Fixed issue with jQuery script not running in noConflict mode

27-Jun-2013 : v4.2.0

Download Free Download Pro (older than 1 year)

 ! J2 Removed compatibility for Joomla 2.5 versions lower than 2.5.10
 ! J3.0 Removed compatibility for Joomla 3 versions lower than 3.1.0
 # Fixed issue with Modals' scripts and styles sometimes not being loaded
 # Fixed issue with internal links inside iframed modal loading entire template

25-Jun-2013 : v4.1.2

Download Free Download Pro (older than 1 year)

 + Added ability to override auto_titles setting
 # Fixed issue with converting links by custom classname not working
 # Fixed issue with iframe attribute in tag not working correctly
 # FREE Fixed issue with notices about undefined properties tag_content

19-Jun-2013 : v4.1.1

Download Free Download Pro (older than 1 year)

 # Fixed issue with links with empty classname being modalized (regardless of settings)
 # FREE Fixed issue with notices about undefined properties external and target

18-Jun-2013 : v4.1.0

Download Free Download Pro (older than 1 year)

 + PRO Added Auto Group option
 # Fixed issue with some settings only working on tag sytax link
 # Fixed issue with true/false values in default settings not having effect
 # Fixed issue with width/height in tag settings not working correctly

12-Jun-2013 : v4.0.1

Download Free Download Pro (older than 1 year)

 # Fixed issue with scripts not loading when using only non-tag activators on page

11-Jun-2013 : v4.0.0

Download Free Download Pro (older than 1 year)

 ^ First release (a continuation and replacement of Modalizer)

Reviews

Post a review

Functionality

Pop-up option works well,exactly what I needed for my project.
Thank you.

Ease of use

Very easy to use and lots of examples.

Support

Always the best support.

Documentation

The extension is well documented with examples.

Functionality

Pop-ups for images, links, menu items, you name it. Fully responsive when done correctly w/Bootstrap.

Ease of use

Easy! I had to read a bit, of course, but the forums are manned and questions are answered. Easy if you understand ANY HTML/CSS at all.

Support

Very good. I'm using the PRO version, paid, but the support looks good for free, too. Peter pops up on the forums + answers questions fast.

Documentation

Fair-to-middling. The FAQ's are pretty good. Tutorials better than most free extensions. I could wish for a LITTLE more documentation.

Functionality

The code works as expected when the user doesn't forget to code properly and leaves out } | and code tags.

Ease of use

It loads and codes as advertised

Support

I use all of the NoNumber extensions for Joomla and have not had to submit a support ticket for any of their extensions

Documentation

The documentation is good but for these old eyes the contrast colors make it a little hard to read.

Functionality

Has lots of features but is misleading because it is not responsive. This is a must for modern web design.

Ease of use

Simple and easy to use just like any other extension.

Support

This was the only place I was able to find out that the modal was not responsive, and could not be over written with css to be responsive.

Documentation

No where do they list that the modal is not responsive. This is poor documentation.

Functionality

Modals image pop ups work perfectly, with exactly the options I need.

Ease of use

The choice of defaults is good. It is easy to specify options if the user wants something other than the defaults.

Support

The developer is very quick to respond on his support forum.

Documentation

The documentation is complete and easy to understand.

Functionality

Incorporates the popular Colorbox seamlessly into Joomla and makes it effortless to use all the plugin has to offer.

Ease of use

Couldn't be any easier, really. The site has many examples to use and learn from.

Support

Support forum professionally managed with same-day answers and pro-active follow-up.

Documentation

Everything you need to be successful with the extension is on developers site with easy access.

Functionality

I use this to display all sorts of content. Text, images, videos all work fine.

Ease of use

Works very well

Functionality

There are a lot of applications for this plugin. It's really flexible.

Ease of use

It's really straight forward on how to add simple modals and there are a lot of options, especially in the pro version.

Support

I've gotten quick and courteous responses from nonumber. They've help solve any issues I've come across.

Documentation

great documentation on how to apply the different uses of this.

Functionality

Advanced functions are very slick.

Ease of use

Very simple coding.

Support

Very rapid support. I had one issue which was my fault and they directed me in about two minutes.

Documentation

Easy to follow.

Functionality

great

Ease of use

yes

Support

I had a problem when updating to modal 5.2 on one site and Peter give a quick and accurate analyse and answer to what I had to do. Thanks

See more reviews

Post a review

Reviews are taken from the Joomla Extensions Directory website.

Translations

Modals comes packed with the following languages:

English (United Kingdom)
100%
Catalan (Spain)
12%Translate
German (Germany)
16%Translate
Spanish (Spain)
85%Translate
French (France)
18%Translate
Hindi (India)
12%Translate
Hungarian (Hungary)
12%Translate
Indonesian (Indonesia)
98%Translate
Italian (Italy)
12%Translate
Japanese (Japan)
10%Translate
Lithuanian (Lithuania)
85%Translate
Dutch (Netherlands)
85%Translate
Portuguese (Brazil)
36%Translate
Russian (Russia)
12%Translate
Slovenian (Slovenia)
23%Translate
Swedish (Sweden)
98%Translate
Thai (Thailand)
12%Translate
Ukrainian (Ukraine)
98%Translate
Chinese (Taiwan)
12%Translate

No language pack for your language?