Currently, iframes are the only possible solution to use AJAX-ZOOM "cross-domain" or "cross-origin". However, because AJAX-ZOOM regular licenses include only one domain or subdomain name, cross-origin embedding does not work out of the box and is forbidden by the standard license terms. Nevertheless, in case that within your technical environment, it is not possible to integrate AJAX-ZOOM regularly (e.g., Node.js, Java, or SaaS Solutions like Shopify) and embedding over iframe from your own server(s) (e.g., LAMP) to your owned domain(s) is an acceptable solution for you or your customer, we can technically enable this specific "cross-domain" case. For more details and licensing options, please contact AJAX-ZOOM support.
Also, please note that while the iframes in example13 point to one specific file, which is prepared to accept few query string parameters to load content depending on these parameter values, any other example is adjustable to behave in the same way. Therefore, you do not have to pass full or explicit paths to 360 images or images in general via query string parameters. You could also provide a numeric ID and request information about the content from a database or other sources using server-side code.
If any questions remain, contact us, we are pleased to advise you.
Using iframes is a quick and straightforward way when you want to place many 360 rotary views or several images with the deep zoom simultaneously on one page or just do not want to modify any codes of your CMS system.
Among many other options, you can configure the 360 / 3D product views to load instantly or start preloading single images after the user clicks on the viewer. Inside the responsive iframe, the AJAX-ZOOM player adjusts its size automatically whenever the dimensions of the iframe change.
Please note that provided you are following the proposed way of integration in example13, "fullscreen view" will also work in IOS Safari without opening a new window. Usually, this is only possible for videos inside an iframe. Thus, embedding this 360 product viewer or plain image zoom viewer via iframe will lead to no noticeable difference compared to regular integration. You can confirm this also on the desktop by clicking on the fullscreen button at the brown shoes 360-view example below.
Open AJAX-ZOOM in a lightbox / modal window from a link (click event) within an iframe.
The content can be a 360-degree product spin, 3D product view, a gallery or one plain image. The example uses the new APP container, a Fancybox and the Colorbox jQuery extension to illustrate the procedure.
Responsive inline images with hover zoom effect and progressive zoom feature on click. The AJAX-ZOOM viewer with progressive zoom feature opens in responsive lightbox or at fullscreen.
You can also configure the extension to replace the entire image with AJAX-ZOOM viewer on click. The viewer fills the space of the image. The user can close the viewer and restore the inline image.
In the example, you can switch between these diverse opening modes.
It is great for editorial content because the HTML essentially consists out of an "img" tag. Editors can easily insert this tag into text via WYSIWYG editor of any CMS.
Load AJAX-ZOOM viewer inside an iframe. This is the simplest way to put in place AJAX-ZOOM anywhere.
You can place as many instances on one page as you like. Full-screen views work on desktop and mobile devices as well. Using "lazyload" to postpone loading of the content inside the iframe is possible and the example demonstrates how to implement it.
The content of the viewer inside iframe can be an image gallery, a 3D / 360 product rotation or one high-resolution image with progressive zoom. Since AJAX-ZOOM viewer is responsive, it will adjust to the size of responsive iframe automatically.
In this example, AJAX-ZOOM loads into responsive Fancybox by a click.
For invoking AJAX-ZOOM with Fancybox in such a way, we have created a wrapper extension.
$.openAjaxZoomInFancyBox plugin triggers and manages the AJAX-ZOOM viewer inside the Fancybox.
It also makes the first generation Fancybox responsive.
This example can also serve as a tutorial about defining the content that you want to load into AJAX-ZOOM viewer! It lists by example all possible query string parameters (zoomData, zoomDir, 3dDir, zoomFile, and zoomID). These are the parameters AJAX-ZOOM supports out of the box to define flat images and paths for the 360 viewer. The example also explains how you can compress the parameter values. Compressing helps to hide direct image paths from exposing them to the public and shorten the length of the query string.
Using the modules/plugins is optional! It is not required to use them. You can use AJAX-ZOOM as a stand-alone application or integrate it manually into nearly all systems.
However, if a module for your CMS or e-commerce/shopping cart system is available, it tremendously facilitates and speeds up the integration. Provided that your server meets technical requirements, you can have AJAX-ZOOM up and running within a few minutes. You can install and configure these AJAX-ZOOM modules with just a few clicks and without writing a single line of code.
Available are modules for Magento, Prestashop, WooCommerce (WordPress), Opencart, Shopware, and Oxid. The last two are commonly used in German-speaking countries.
The license price primarily depends on the number of different images that display in the AJAX-ZOOM image viewer on a domain. Unlimited options are available. The costs for the regular licenses are one-time payments! You can find the complete license agreement and price list on the download page. Before ordering, we advise you to download and test the demo (light) version within your development environment.
If necessary, we can issue time-limited license keys free of charge. However, AJAX-ZOOM and AJAX-ZOOM modules / plugins for diverse CMS and shopping carts should work with few restrictions without entering any licensing data! If something does not work as expected, there must be a different reason than missing license. Do not hesitate to contact AJAX-ZOOM support if you encounter any technical difficulties.
To use live-support-chat, you need to have Skype installed on your device. In case live support over Skype is not available immediately, please leave us a message or send an email by using the contact form.
We answer every inquiry or question that relates to the AJAX-ZOOM software!