WordPress.org

Ready to get started?Download WordPress

Plugin Directory

Modal Links

This is NOT just another modal plugin. Its much more. With this plugin you add modal functionalities to your wordpress.

This is NOT just another modal plugin. Its much more. With this plugin you add modal functionalities to your wordpress. Go to Settings->Modal Links and check the options.

We appreciate any bug report. Thank you
SEE THE PLUGIN AND THE EXTENSIONS IN ACTION ON OUR TEST SITE

Important Things!

1) This plugin is being developed with the latest wordpress version, PHP 5.5.8 and MySQL 5.6.12
2) Before posting an issue to the support forum make sure that:
- you use a valid shortcode or html link as modal links plugin expects.
- you have checked the issue by disabling all the others plugins you have on your wordpress.
3) If an update includes new settings options, disable and re-enable the plugin in order to let them be initialized.

News:

  • NEW options added in version 1.8.0...
  • Shortcode validation system is now fixed...
  • All donatable extensions have new version uploaded. We have added a "New Version Notice" system on them, so from now and on you will be notified in the admin panel if new version found. Please all owners download the new versions from the plugin's url using your existing credentials. Thank you
  • The free extensions Read More, Meta Widget Login Register and Shortcode Validation now have been merged into the basic plugin.
  • You can now select a pre-loading image for the modal. Select the color and the size of the image.

Basic Features:

  • Create modal link of post/page using shortcode or plain html link.
  • Use of posts/pages as modals. No need to create new content somewhere else.
  • Use id or permalink to target the post/page. Id is recommended.
  • Use of special category "Modals" for different mechanism behaviour.
  • Hide or Show post's/page's title in modal window using the shortcode attribute "title".
  • Open wp's Login/Logout and Register form (in beta).
  • Many options to adjust the modal to your own needs.
  • Option to use Login/Register links of Meta Widget as "Modal Links".
  • Option to use Read More Links as "Modal Links".
  • It is multisite ready.
  • Translation ready.
  • It IS flexible.
  • Add extensions to expand functionality.
  • Check the FAQ.

Options:

  • Width : Choose the width of dialog. Leave empty or '0' for auto.
  • Width Type : Choose between fixed and fluid type. (fixed/fluid)
  • Responsive Width : Choose true if you want the width to be re-calculated on window resize. Will work only for fluid width type. (true/false)
  • Height : Choose the height of dialog. After that value dialog goes scrollable.
  • Height Type : Choose between fixed and responsive type. (fixed/fluid)
  • Max Height : Choose the max height of dialog. After that value dialog goes scrollable.
  • Max Height Type : Choose between fixed and responsive type. (fixed/fluid)
  • Responsive Height : Choose true if you want the height to be re-calculated on window resize. Will work only for fluid height type. (true/false)
  • Draggable : Choose if the dialog will be draggable. (true/false)
  • Resizable : Choose if the dialog will be resizable. (true/false)
  • Show Title : Choose to show or hide the title, global option overrides title attribute in shortcodes or the data-title attribute in "modal" links. (true/false)
  • Show Date : Choose to show the date of the post/page. (true/false)
  • Show Author : Choose to show the author of the post/page. (true/false)
  • Animate on Show : Choose if the dialog will animate on opening. (true/false)
  • Animate on Hide : Choose if the dialog will animate on hiding. (true/false)
  • Dialog is Modal : Choose if the dialog will behave as modal or no. (true/false)
  • Close Icon : Choose false to hide close (X) icon. (true/false)
  • Close on Escape : Choose if the dialog will close using esc key. (true/false)
  • Loading Image : Switch off or select the pre-loading image. (off/images)
  • CSS Class : Enter any additional class that you want to attach to the dialog.
  • Position : Choose the position of the dialog. (left, center, right, top, bottom)
  • Responsive Position : Choose true if you want to re-position the dialog on window resize. (true/false)

Donatable Extensions:

  • Shortcode GUI (adds a GUI way to insert easily the shortcode into the wp editor. No need to know or remember the id or permalink of the post/page.)
    download | donate

  • Auto Open (opens a post/page in modal window automatically. Selectable option for every post/page and front page)
    download | donate

  • Menu Item (adds the ability to put a post/page as a menu item into navigation menus. Post's/Page's title becomes the menu item name.)
    download | donate

  • Category Carousel (adds the ability to open all the posts of a category in modal window as carousel using left and right arrows to change post. Use the shortcode attribute category="catID" or the html link attribute data-category="catID")
    download | donate

This is the proccess to get any of the donatable extensions:
step 1) Click on the donate link below of the extension.
step 2) Donate an amount of your decision.
step 3) We get an email notification from paypal about the donation.
step 4) We create an account based on the transaction details and we allow access to the download page. Username becomes the first part of your email and password the donation's confirmation number.
step 5) We email you the credentials

*** NOTE that this is not an automate proccess but we do it manually. Normally when the donation comes to us, we respond within 8 hours.

Check some screenshots for these extensions in Screenshots.

Shortcode Attributes:

  • id : The post's/page's id.
  • permalink : The post's/page's permalink.
  • title : To force the post's/page's title hide or show in modal window.
  • login : Use login="true" to show wp's login/logout or register form.
  • action : Use action="register" to show wp's register form.

Notes:
* id or permalink are required to open a post/page.
* login="true" is required to open login/logout or register form.
* action="register" is required to open registration form.
* title is optional in any case.
* if both id and permalink provided, id will be used.

HTML Link Attributes:

  • id : The post's/page's id.
  • href : The post's/page's permalink otherwise "#".
  • data-title : To force the post's/page's title hide or show in modal window.
  • data-login : Use data-login="true" to show wp's login/logout or register form.
  • data-action : Use data-action="register" to show wp's register form.

Notes:
* always provide target="_modal".
* href should be set to '#' or set the post's/page's permalink.
* data-login="true" is required to open login/logout or register form.
* data-action="register" is required to open registration form.
* data-title is optional in any case.
* if both id and href="PERMALINK" provided, id will be used.

Learn by example:

Playing with the link name

  • Normal usage of link name.
    Shortcode: [modalLinks id=“1”]link[/modalLinks]
    HTML: <a target="_modal" href=“#” id=“1”>link</a>

  • If you leave empty the link name in the shortcode dont worry, id/permalink or login/register form name will get in place.
    Shortcode: [modalLinks id=“1”][/modalLinks]
    Result: <a target="_modal" href=“#” id=“1”>1</a>

  • You can use unclosed shortcode, again we take care the link name.
    Shortcode: [modalLinks id=“1” /]
    Result: <a target="_modal" href=“#” id=“1”>1</a>

Referring to the post/page by id or permalink

  • Open post/page with id ‘1’.
    Shortcode: [modalLinks id=“1”]...
    HTML: <a target="_modal" href=“#” id=“1”>...

  • Open post/page with permalink ‘?p=1’.
    Shortcode: [modalLinks permalink=“?p=1”]...
    HTML: <a target="_modal" href=“?p=1”>...

  • If you provide both id and permalink in the shortcode, id will be used.
    Shortcode: [modalLinks id=“1” permalink=“?p=2”]...
    RESULT: <a target="_modal" href=“#” id=“1”>...

Showing or hiding the title of post/page

  • Title is NOT showing for post/page with id ‘1’.
    Shortcode: [modalLinks id=“1” title=“false”]...
    HTML: <a target="_modal" href=“#” id=“1” data-title=“false”>...

  • Title is showing for post with id ‘2’ which is in ‘Modal’ category.
    Shortcode: [modalLinks id=“2” title=“true”]...
    HTML: <a target="_modal" href=“#” id=“2” data-title=“true”>...

Open wordpress’s Login/Logout or Register form.

  • Opens login or logout according of user’s state.
    Shortcode: [modalLinks login=“true”]...
    HTML: <a target="_modal" href=“#” data-login=“login”>...

  • Opens registration form no matter of user’s state.
    Shortcode: [modalLinks login=“true” action=“register”]...
    HTML: <a target="_modal" href=“#” data-login=“login” data-action=“register”>...

Requires: 3.0.1 or higher
Compatible up to: 3.9.1
Last Updated: 2014-7-23
Downloads: 2,429

Ratings

3 stars
3.7 out of 5 stars

Support

14 of 15 support threads in the last two months have been resolved.

Got something to say? Need help?

Compatibility

+
=
Not enough data

0 people say it works.
0 people say it's broken.