Open Iframe from Menu

Sometimes you want to trigger FooBox to open an iframe from your WordPress menu. This is possible with a bit of tweaking to the menu and adding some custom JS code.

1. When editing your menus from Appearance -> Menus, you need to click the "Screen Options" tab on the top right just under the admin bar. Then check "CSS Classes" under "Show advanced menu properties".

2. Then scroll down to the menu item and expand it. You can add the class "fooboxmenu".

3. Now navigate to FooBox Settings page.

Under the JS & CSS tab, add the following code to the Custom Javascript (PRE) setting:

$('.fooboxmenu a').attr('target', 'foobox');

Your menu item will now load the URL within FooBox

You can also restrict the width and height of the Lightbox by using the following code instead:

$('.fooboxmenu a').attr('target', 'foobox').data({ 'width': '300px', 'height' : '300px' } );

Just alter the 300px to the sizes you require.