livechat

Plugin for Joomla

Our free Joomla! content plugin was recently revamped based on the feedback we have been receiving from our Joomla users since its original release in 2014. It now features the latest v3.6.2 core, analytics, APIs and updated shortcodes for greater flexibility.

  • For a quick youtube-style integration using iFrame, please refer to our user guide under Web Integration -> Embed via iFrame.
  • Features
  • Installation
  • Download
  • History

Features

  • Add 360 or 3D product views anywhere in your Joomla content.
  • Use the "best of breed" 360 & 3D product viewing engine that WebRotate has been perfecting since 2009.
  • Three simple shortcodes for embedded, popup and full-screen presentation.
  • Includes simple yet powerful software to quickly publish interactive product views on your computer.
  • Configure skins, track analytics or customize further via advanced APIs.
  • Super responsive to look good on any device.
  • Supports Custom HTML modules, K2 content extensions, VirtueMart and HikaShop product descriptions.
  • 'Master' configuration is available to simplify deployment of a large number of product views.
  • Continuously tested on all major browsers and devices.
  • No recurring fees. Free version is available and both PRO and Enterprise editions is just a one-time payment if you decide to upgrade.

To see a live Joomla demo with some of these capabilities, please follow this link:

Installation

Use the Download tab to get the latest plugin (.zip) for your Joomla installation. Then navigate to Extensions -> Manage -> Install in your Joomla admin and select "browse for file" to upload and install the plugin or use drag and drop the plugin onto the designated area. Enable the plugin under Extensions -> Plugins upon successful installation.

IMPORTANT: the entire contents of any previous webrotate plugin installation in your Joomla may be removed upon updating the plugin (unless you manually copy the new plugin files and folders to your FTP). If you have any webrotate assets (360 or 3D product images and configuration files), a license file, etc that you keep in the webrotate plugin folder, make sure you backup the existing plugin folder (/plugins/content/webrotate360) before proceeding with the plugin update.

  • 1Plugin defaults

    Expand Extensions -> Plugins -> WebRotate 360 Product Viewer to access the default plugin configuration. If there will be many product views in your Joomla that will use the same dimensions, configure the default viewer width, height, base width and minimum height as desired (to save time when adding shortcodes for each product view). You can always override these values in your shortcodes. Review the rest of the default options on the plugin page.

    Enable WebRotate 360 Product Viewer under PluginsConfigure plugin defaults
  • 2Embed shortcode

    There are currently three types of shortcodes that you can use in Joomla: 1) wr360embed, 2) wr360popup and 3) wr360expand.

    wr360embed creates a 360 product view that is embedded inside a page as per the dimensions you specify in the plugin settings in admin or via the shortcode itself.

    Example of embed shortcode inside a test article

    To test this shortcode, add the following line in your article content (double check that it's copied in plain text). Change name, width, height and the config parameter as needed. To load a demo product view that was packaged with the plugin, set the config parameter to /plugins/content/webrotate360/360_assets/sampleshoe/config.xml

    [wr360embed name="view1" width="100%" height="500px" config="url-of-the-viewer-config.xml"]
  • 3Responsive height and custom background

    There are three optional shortcode parameters for wr360embed:

    • basewidth - if the width parameter is relative (%), setting basewidth will force viewer to scale its height responsively (viewer width is always responsive as long as the shortcode width is relative). Basewidth usually represents the width of the viewer on a fully expanded page when viewed via a desktop browser, i.e before responsive rules are applied to the page.
    • minheight - if basewidth is set, this setting makes sure the viewer height doesn't go below a certain value such that the 360 product images have enough room on small mobile screens.
    • background - hexadecimal color (e.g #000000) of the viewer background for this shortcode. You can use it to match the viewer background color with the background of the Joomla page and/or the background of your 360 degree product images.

    Note that you can configure the default values for these parameters under the plugin settings such that you don't have to do this for every shortcode.

    [wr360embed name="view2" width="100%" basewidth="620px" height="500px" minheight="300px" background="#000000" config="url-of-the-viewer-config.xml"]
  • 4Popup shortcode

    Use wr360popup to load the viewer inside a popup when user clicks on some image, a hyperlink, etc. that is wrapped inside the shortcode. The width parameter can't be relative and have to be configured in pixels - the popup will scale automatically if a browser window is not large enough (e.g when viewed on a small mobile screen).

    There are four optional shortcode parameters that can be used with wr360popup:

    • gallery - multiple popup shortcodes with the gallery parameter set to true (gallery="true") are combined into a popup gallery with the navigation.
    • background - hexadecimal color (background="#000000") of the viewer background for this shortcode.
    • viewerskin - configurable skin of the 360 product viewer. Supports empty, retina, basic, thin, round, zoom_light and zoom_dark viewer skins (viewerskin="round").

    To test this shortcode, add the following line in your article content. Change name, width, height and the config parameter as needed. To load a demo product view that was packaged with the plugin, set the config parameter to /plugins/content/webrotate360/360_assets/sampleshoe/config.xml

    [wr360popup name="view3" width="650px" height="550px" config="url-of-the-viewer-config.xml"]thumbnail or text[/wr360popup]
  • 5Expand shortcode (PRO)

    Similar to the popup shortcode, wr360expand activates via a click or tap on some text or image that is wrapped inside the shorcode. It makes the viewer open up in the full-screen mode or take the entire browser window (browserfs="true"). wr360expand ignores all dimensional shortcode properties such as width or height.

    Note that if a 360 or 3d product view has dynamic hotspots, you need to uncheck "Create an extra set of fitted images..." on the Publish form in SpotEditor to use it with this shortcode in Joomla. Otherwise, the hotspot indicators will not be correctly positioned when this shortcode is activated.

    To test this shortcode, add the following line in your post or page in your article content. Change name and the config parameter as needed. To load a demo product view that was packaged with the plugin, set the config parameter to /plugins/content/webrotate360/360_assets/sampleshoe/config.xml

    [wr360expand name="view4" browserfs="false" config="url-of-the-viewer-config.xml"]thumbnail or text[/wr360expand]
  • 6Publish and upload your 360 product views

    Download our desktop software and publish a 360 product view using your own product images or use our sample images that are linked under additional resources. FTP upload is available inside the software or you may upload the published assets manually (via FileZilla, etc). You only need to upload a single folder located under published/360_assets of your published SpotEditor project for each product view. You may also publish multiple 360 product views into a single 'published' location and upload all product views at once.

    Once uploaded, note the URL of the configuration file (.xml) in the uploaded folder and then enter a relative URL of the configuration file on your server in the config field of your shortcode.

  • 7Load images from CDN or use master config (PRO)

    All shortcodes also support the rootpath parameter that can be used to specify an alternative location of your 360 product images. When it's set in the shortcode, the viewer will prepend rootpath to the relative image location stored in the viewer config xml for each image. This is valuable when you need to host image assets on a dedicated file server or CDN.

    The rootpath feature can be also used to load multiple shortcodes via a single (master) config xml that you can set under the plugin settings via Master Config URL, assuming the number of images and their file names are the same across multiple shortcodes. If Master Config URL is configured, you don’t need to specify the config parameter in the shortcodes that share the same config, i.e you would only use the rootpath parameter pointing to the image assets.

    [wr360embed name="view5" width="100%" height="500px" rootpath="http://mycdn.com/360_assets/product1/" config="/360_assets/product1/config.xml"]
  • 8API integration

    WebRotate 360 Product Viewer includes powerful APIs that can help with various viewer customizations. You can see and test all currently available APIs by publishing your SpotEditor project via the JavaScript API template which you can select on the Publish form.

    The API can be integrated with wr360embed and wr360expand shortcodes either by configuring a global callback in the plugin settings in admin or by specifying the callback parameter inside a shortcode itself. The callback receives three parameters: API object, isFullScreen flag and a shortcode name, i.e function myCallback(api, isFullScreen, name){}

    [wr360embed name="view6" width="100%" height="500px" callback="myCallback" config="url-of-the-viewer-config.xml"]

Download

Download WebRotate 360 Product Viewer for Joomla:

IMPORTANT: the entire contents of any previous webrotate plugin installation in your Joomla may be removed upon updating the plugin (unless you manually copy the new plugin files and folders to your FTP). If you have any webrotate assets (360 or 3D product images and configuration files), a license file, etc that you keep in the webrotate plugin folder, make sure you backup the existing plugin folder (/plugins/content/webrotate360) before proceeding with the plugin update.

History

Version history for older releases as well as the version history of the core viewer and publishing software can be found here.

WebRotate 360 Product Viewer for Joomla [v1.3.0] *15-May-2018

  • [+] Updated to the latest v3.6.2 viewer core (release version).
  • [+] Added new wr360expand shortcode.
  • [+] Integrated Google Analytics tracking (for 11 viewer events).
  • [+] Added viewer API integration for wr360embed and wr360expand shortcodes.
  • [+] Added background color property.
  • [+] Added minimum height property for wr360embed shortcodes.
  • [+] Added graphics path option in plugin settings for custom hotspot indicators.
  • [+] Added browserfs shortcode parameter to allow full browser window mode in wr360expand.
  • [+] Updated all shortcodes to use data-imagerotator, eliminating script duplication and initialization issues.
  • [+] Made full-screen work when launched from popups.
  • [+] Added configurable titles in wr360popup shortcodes in gallery mode.
  • [+] Added support for height config in % in wr360embed shortcodes.
  • [+] Added new popup skins with vector graphics (light_clean, dark_clean).
  • [+] Added viewerskin parameter in popup shortcodes.
  • [+] Added two new viewer skins (zoom_dark, zoom_light).
  • [+] Added two new popup skins (clean light, clean dark).
  • [+] Added custom viewer cursors, support for pause viewer on load, zoom on single click, and more.
  • [+] Integrated Joomla! Update System.
  • [!] z-index was lowered across viewer elements to work better with Joomla themes.
  • [!] Added dummy license.lic to prevent 404 errors from slowing down loading of the 360 product viewer.
  • [!] Lightbox popups now correctly re-center upon browser resize via window maximize & minimize.

WebRotate 360 Product Viewer for Joomla [v1.2.2] *18-November-2014

  • [+] Two types of shortcodes for embedded, popup and gallery views.
  • [+] Master settings for 360 product viewer defaults, skins, config and CDN.
  • [+] K2 content extension integration.
  • [+] VirtueMart content integration.
  • [+] Custom HTML modules.

Subscribe to our newsletter

Sign up to our newsletter to keep a pulse on our latest developments, informative posts and beta releases. We don't abuse it!

Signup