Advanced iframe pro 7.4 is online

Hi,

Advanced iframe pro 7.4 is now available on CodeCanyon.

The main new features are:

  • “Hide part of an iframe” is now also included to the area selector.
  • Post message communication is now default for the pro version
  • Improved documentation of the external workaround tab.
  • External workaround was improved at many places
  • Improved messages to improve configuration issues

For all new features please check: http://www.tinywebgallery.com/blog/advanced-iframe/advanced-iframe-history

There are 11 new features and 2 fixes in this release!

Best, Michael

Why you should not mix http and https when using iframes

In the administration of advanced iframe I have written the following note:

"Please do not use a different protocol for the iframe: Do not mix http and https if possible!".

What does this mean?

  1. If the protocol of your page is http than use a http page inside the iframe.
  2. If the protocol of your page is https than use a https page inside the iframe.

But why should you not do this?

1. https with http iframe

Lets start with the one you can not do:  Your page is https and your iframe page is http. This scenario is called "Mixed Active Content" and is blocked by all major browsers now. You can open this test page and check the browser console (F12) for the errors you get then!

-> HTTP pages cannot be included directly into HTTPS pages!

2. http with https iframe

-> HTTPS pages can be included into HTTP pages!

What you  can do is including an iframe with a https page into a http page. This not recommended as is generally bad practice to embed an iframe with content served over HTTPS within a page served over plain HTTP (or mix content). The reason for this is, that there's no good way for the user to check they're using the HTTPS site they intend (unless the user really wants to check the source of the page). They also don't know that e.g. their login credentials are sent over HTTPS as in the browser address only HTTP is visible.
Also you need to try if your pages are working on all major browsers. I already had users with side effects when it comes to cookies or session handling!

My recommendation is to upgrade your http page to https!

IF YOU STILL WANT TO DO THIS: The external workaround is by default NOT working in this setup as the Javascript is than loaded from an http domain which is blocked! To get this working in the pro version you need to

  1. Enable "Use post message for communication" on the "External workaround" tab.
  2. Copy the generated ai_external.js to a https domain and include it from there! Remember to copy the ai_external.js each time you change something with the "save" icon in the administration.

See a working example here: http://www.tinywebgallery.com/blog/advanced-iframe/advanced-iframe-pro-demo/external-workaround-with-post-message#e53

Have fun using advanced iframe (pro),
Michael

 

New advanced iframe pro demos

I have created 8 new demos for advanced iframe for existing and the new features that come with 7.3:

Hope this helps you to use advanced iframe even better.

Version 7.3 is now in the testing phase and will be released in a few days.

Have fun using advanced iframe,
Michael

 

Advanced iFrame pro 7.1 is online

Hi,

Advanced iframe pro 7.1 is now available on CodeCanyon.

The main features are:

For all new features please check: http://www.tinywebgallery.com/blog/advanced-iframe/advanced-iframe-history

There are 11 new features and 4 fixes in this release!

Best, Michael

Using Sub domains with Advanced iFrame

By default you can not execute Javascript on different domains because of browser cross domain security restrictions. Advanced iFrame does use Javascript a lot for features like auto height. As solution advanced iframe has the external workaround which enables most of the local features also on the remote page.

If your iframe is on a sub domain also an easier way is possible. You still have to include one line of Javascript but the whole configuration is than like you are on the same domain and all settings can be done by shortcode.

To enable this you need to set the value “document.domain” to your main domain with Javascript. The plugin does set this value on the parent (from version 7.0.2 on) if you enable this in the administration. You can also set this manually as this version is not released yet.

If your iframe is on subdomain.example.com and your WordPress site is on www.example.com you have to add

<script>
document.domain=’example.com’;
</script>

anywhere to the source code of your page of the iframe. On the parent page the plugin already does this for you.

After you have done this you can configure Advanced iFrame like you are on the same domain.

See https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy for the documentation of this setting.

See example 42 where this way is used. Example 6 shows the same example with the “old” external workaround.

Have fun using Advanced iFrame,
Michael

Advanced iFrame pro 7.0 is online

Hi,

Advanced iframe pro 7.0 is now available on CodeCanyon.

The main features are:

For all new features please check: http://www.tinywebgallery.com/blog/advanced-iframe/advanced-iframe-history

There are 27 new features and 4 fixes in this release!

Best, Michael

Advanded iframe pro 7.0 looking for testers

Hi,

I finally implemented all the features I have planned for the next major version.

Advanced iframe pro 7.0 is almost ready to be released. I’m looking for some testers who would like to get the cool new features before everyone else.
The new features already run on the demos now for a couple of weeks and they look really cool for me

The main features are:

  • The show iframe as layer feature has now a fullscreen mode with custom header and footer!
  • Scrolling on ipad and iphone is supported!
  • Show only a port of an iframe support now zoom.

For all new features please check: http://www.tinywebgallery.com/blog/advanced-iframe/advanced-iframe-history

there are 27 new features and 4 fixes in this release!

If you are a pro user please contact me through codecanyon to get this version first.

Best, Michael

Advanced iFrame Pro 6.5 is available

This release has many, many improvements of existing features and a improved administration!

The main new improvements are:

  • Administration with tabs, editor button, improved help and detection of wrong configurations
  • Browser detection uses much less memory and support additional devices
  • 15 new features and 8 fixes are part of this release.
  • Soon the free version will also get the improved administration also!

A full list is available on the history page.

Get this version from codecanyon.

Planned for the next version:

  • Scrolling of iframes with ipad and iphone
  • Additional header sections for the “show the iframe as layer”
  • Tutorial videos ;).

Have fun using Advanced iFrame Pro,
Michael

Using a reverse proxy to enable all features of advanced iframe pro

In the quickstart guide you have found out which setup you have and which features are available for you. If you are on a different domain and you cannot add the line of Javascript than you normally cannot use features like auto height, css modifications or auto zoom.

The last option you might have is that you setup a so called reverse proxy (http://en.wikipedia.org/wiki/Reverse_proxy). If you run your own server or your hoster does allow that you use mod_proxy (http://httpd.apache.org/docs/current/mod/mod_proxy.html) AND you have access to the server config you can map the page you want in the iframe to a url of your site. Proxypass is not supported when you can only use a .htaccess file!

There are many tutorials about this topic. In my example below I use Five b from the following page: http://serverfault.com/questions/561892/how-to-handle-relative-urls-correctly-with-a-reverse-proxy.
A more detailed tutorial can be found here: http://www.apachetutor.org/admin/reverseproxies. Details about proxypass and proxypassreverse can be found here http://httpd.apache.org/docs/2.4/mod/mod_proxy.html#proxypass

So a reverse proxy setup can be quite simple but also not working at all depending on the page you want to include. And it does require a lot of time and is really an advanced topic.

As example I show you how I setup a reverse proxy on my localhost for the main page of www.tinywebgallery.com.

1. Enable mod_proxy and mod_substitute in conf/httpd.conf
2. Add

<IfModule proxy_module>
    ProxyPass /twg/ http://www.tinywebgallery.com/
    ProxyPassReverse /twg/ http://www.tinywebgallery.com/
    <Location /twg/>
      AddOutputFilterByType SUBSTITUTE text/html
      Substitute "s|www.tinywebgallery.com/|localhost/twg/|i" 
    </Location> 
</IfModule>

to the Apache config (conf/httpd.conf or e.g. extra/httpd-proxy.conf).

3. Restart the server

www.tinywebgallery.com is now available at http://localhost/twg/ ;).

And now you would be able to use all features of Advanced iFrame Pro!

Best, Michael