Advanced iFrame Pro v 6.2
Include content the way YOU like in an iframe that can hide and modify elements and forward parameters. You can also embed content directly or show a part of an iframe.
Please check the quickstart section! There you find out which features are available for you!
Features of Advanced iFrame Pro v 6.2
By entering the shortcode ‘[advanced_iframe securitykey=”your key”]’ you can include any webpage to any page or article. The following cool features compared to a normal iframe are implemented:
- New: Pro demo with the most important pro features. Please allow the demo to load because there are 10 different iframes on this page which takes a while to load.
- New: Graphical interface to select the area you want to show: See area selector.
- Hide areas of the parent layout to give the iframe more space
- Show only specific areas of the iframe even when the iframe is on a different domain (see the FAQ for limitations) or include parts directly (same domain) by jQuery
- Hide areas of an iframe
- Modify css styles in the parent and the iframe to e.g. change the width of the content area
- Forward parameters to the iframe
- Resize the iframe to the content height (same domain or with the external workaround) or width (same domain) on loading, AJAX or click
- Scroll the parent to the top when the iframe is loaded
- Hide the content until it is fully loaded
- Add a css and js file to the parent page
- Security code: You can only insert the shortcode with a valid security code from the administration.
- Widget support
- Browser detection: browser dependent iframes are possible
- Modify link targets on the parent and in the iframe (external workaround)
- Url forward parameter mapping
- Redirect direct access of the iframe page to the parent page.
- Zoom iframe content
- Iframe loading icon
- Accordion admin menu
- Map parameter/value pairs to urls
- Support for auto resize of hidden iframes.
- Responsive iframes – *See this blog entry
- Read only iframes
- New 5.8: Shortcode generator
- New 5.8: Open parameter url in iframe
- New 5.8: Responsive video iframes
- New 5.9: Lazy load of iframes
- New 5.10: Write css directly
- New 5.10: Resize iframe on element resize
- New 5.10: Write css as script directly to the header
- New 5.10: Add a css style to each parent element of the iframe
- New 5.10: Dynamic src parameter + support of shortcodes
- New 5.10: Include additional js to the iframe
- New 6.0: Auto zoom
- New 6.0: Lazy load with hidden elements
- New 6.0: Support for the BBCode iframe
- New 6.x: Many small new improvements and fixes…
See the full feature list on the comparison chart:
Please note: Modification inside the iframe and auto height are only possible if you are on the same domain or use a workaround like described in the settings.
All settings can be set with shortcode attributes as well. If you only use one iframe please use the settings in the administration because there each parameter is explained in detail and also the defaults are set there.
Quick start guide
To include a webpage to your page please check the following things first:
- Check if your page page is allowed to be included:
- Check if the iframe page and the parent page are one the same domain. www.example.com and text.example.com are different domains!
- Can you modify the page that should be included?
Most likely you have one of the following setups:
- iframe cannot be included: You cannot include the content because the owner does not allow this.
- iframe can be included and you are on a different domain: You are not allowed to modify the content of the iframe but you can show it or a part of it. To resize the content to the height/width you need to modify the remote iframe page to enable the provided workaround.
- Iframe can be included and you are on the same domain: All features of the plugin can be used.
- Upload the folder ‘advanced-iframe’ from the zip file to the ’/wp-content/plugins ’ directory. Make sure the file advanced-iframe.php is in the directory /wp-content/plugins/advanced-iframe
- Activate the plugin through the ‘Plugins’ menu in WordPress
- Place ‘[advanced_iframe securitykey=”“]’ in your pages or posts. the security key can be found at Settings -> Advanced iFrame Pro
Simply overwrite all files from your previous installation. This is also the case if you have used the personal version you can get on wordpress.org. If you have some radio elements empty after the update simply select the one you like and save again.
Please save the configuration to update the generated ai_external.js to the latest version! On production systems you should add a version counter to the ai_external.js to avoid caching if you use the external workaround e.g.: .../ai_external.js?version=6
AdministrationGo to Settings -> Advanced iFrame Pro
Advanced iFrame Pro attributes
Below you find all possible shortcode attributes. If you only use one iframe please use the settings in the administration because there each parameter is explained in detail and also the defaults are set there. Setting an attribute does overwrite the setting in the administration.
[advanced_iframe securitykey=”” src=”” width=”” height=”” scrolling=”” marginwidth=”” marginheight=”” id=”” name=”” frameborder=”” content_id=”” content_styles=”” hide_elements=”” class=”” style=”” url_forward_parameter=”” onload=”” onload_resize=”” onload_scroll_top=”” additional_js=”” additional_css=”” store_height_in_cookie=”” additional_height=”” iframe_content_id=”” iframe_content_styles=”” iframe_hide_elements=”” onload_show_element_only=”” include_url=”” include_content=”” include_height=”” include_fade=”” include_hide_page_until_loaded=”” onload_resize_width=””, resize_on_ajax=”” resize_on_ajax_jquery=”” resize_on_click=”” resize_on_click_elements=”” hide_page_until_loaded=”” show_part_of_iframe=”” show_part_of_iframe_x=”” show_part_of_iframe_y=”” show_part_of_iframe_width=”” show_part_of_iframe_height=”” show_part_of_iframe_new_window=”” show_part_of_iframe_new_url=”” show_part_of_iframe_next_viewports_hide=”” show_part_of_iframe_next_viewports=”” show_part_of_iframe_next_viewports_loop=”” hide_part_of_iframe=”” change_parent_links_target=”” change_iframe_links=”” change_iframe_links_target=”” iframe_redirect_url=”” browser=”” show_part_of_iframe_style=”” map_parameter_to_url=”” iframe_zoom=”” tab_visible=”” tab_hidden=”” enable_responsive_iframe=”” iframe_height_ratio=”” enable_lazy_load=”” enable_lazy_load_threshold=”” enable_lazy_load_fadetime=”” pass_id_by_url=”” enable_lazy_load_manual=”” resize_on_element_resize=”” resize_on_element_resize_delay=”” add_css_class_parent=”” auto_zoom=”” enable_lazy_load_manual_element=”“]
Example: [advanced_iframe securitykey=”123451234512345” src=”http://www.tinywebgallery.com” width=”100%” height=”500”]
Frequently Asked QuestionsFind the latest FAQ here: http://www.tinywebgallery.com/blog/advanced-iframe/advanced-iframe-faq/ Please go there if you e.g. want to include several iframes on the same page.
You also find the documentation included in the download on the FAQ page.
Rate Advanced iFrame Pro
Please feel free to leave an item rating from your items download page if you haven’t already done so.Please get in contact with me before giving a bad rating because most of the problems are easy to solve. Also make sure that you took a look at the quick start guide to make sure the feature you like can be used!