Blog | WebRotate 360

Magento 2 Extension Is Now Available

by WebRotate 360 March 06, 2017 09:25

Finally, we have a hefty update for our Magento users.

Extension for Magento 2 has been released, incorporating some of the best features we have implemented in WebRotate 360 Product Viewer v3.6, including analytics, multi-row 3D product views, better responsiveness, API integration, and more.

Download

For those of you who are familiar with our Magento extensions, there has been always two integration modes you could use: Standard and Ad-hoc.

In Magento 1.x, the Standard integration overrides the default implementation of the product media block, disabling any previous customizations to this block. This downside was addressed in Ad-hoc, which embeds a 360 product view or a popup thumbnail to a selected html element on a product page, making it quite flexible and as a result quite popular as well.

So our new Magento 2 extension is essentially the Ad-hoc mode... We will be releasing an extra module for Magento 2 similar to the Standard integration mode (i.e with a product image gallery) sometime later this year.

PS: since we have learned first hand that a transition to Magento 2 is not a walk in the park (and a lot of companies are still waiting), we have also released a refresh of our original Magento extension for Magento 1.x. This refresh includes v3.6 scripts and minor fixes so you can now enjoy the full power of 2 years worth of the core viewer development (see product history).

A new dedicated page for all our recent Magento releases with detailed installation instructions and release history is now available on our website in the following link:

http://www.webrotate360.com/products/cms-and-e-commerce-plugins/plugin-for-magento.aspx

 

Bookmark and Share

Another Free Template to Launch Your WebRotate Inside a Lightbox

by WebRotate 360 February 09, 2017 10:53

It's true, SpotEditor still lacks a lightbox (popup) template and we will get to this soon... For now, if you need a quick "out of the box" solution to launch your 360 or 3D product views inside a lightbox popup (and you don't rely on WebRotate's CMS plugins that have it already integrated), use this template. It's simple!


Download


Here's how to get it up and running:

  • Create a new project in SpotEditor or use an existing one.
  • Publish it as usual.
  • Navigate to the "published" folder of your SpotEditor project.
  • Copy the contents of the template zip to the published folder except for 360_assets and imagerotator folders which you already have.
  • Open page.html and update the config parameter in the hyperlink to point to your published xml, i.e ...?config=360_assets/YourProject/YourProject.xml
  • Change popup dimensions as needed by updating height and width parameters accordingly.
  • If you need to change the viewer skin, open viewloader_basic.html and change basic.css to one of these: thin.css, empty.css, retina.css, round.css.
  • Open page.html in your browser and click "Test thumbnail" to see it in action. Simple!


PS: if you use Chrome or Opera, remember about this security issue when testing the template locally.


The template is based on the prettyPhoto library that has served us well over the years although we customized it slightly for a more responsive behavior on small mobile screens, etc. Also note that you can use it as a gallery of 360 or 3D product views which you can test by uncommenting the inactive section in page.html in the attached zip.

Just ping us here if you have any issues.

 

Bookmark and Share

Just in: WebRotate 360 Product Viewer for WordPress v3.1

by NewsMaster January 09, 2017 13:03

If you haven't noticed, we just quietly released a new version of our popular WordPress plugin.

The announcement was postponed a bit as we were worried it could bring a lot of unexpected customer support during the holidays in case something was overlooked during the release. Now that the holidays are over and we saw a few successful upgrades and new installations, we can finally announce this exciting new release. Why is it exciting?

First off, we have never really released or advertised v3.0 of the plugin. It has been a constant beta for almost a year. And while it packed the new WooCommerce integration and some of the original features of our core 3D product viewer, we never felt it was complete enough to call it a release..

So now with the battle-hardened 3d product viewing function, our brand new SVG skins and the long list of other major core improvements released in the past 12 months (as part of v3.6 core), it is finally a good time to get the new plugin out of the door.

Some of the notable plugin enhancements include:

  • API integration in wr360embed and wr360expand shortcodes.
  • wr360expand shortcode now allows full browser window mode instead of our usual full-screen.
  • Minimum viewer height property in shortcodes and global settings.
  • Viewer background color in shortcodes and global settings.
  • Full-screen support inside the popup shortcodes.
  • Custom path for your hotpot indicators (if you have them customized).
  • And a long long list of the core improvements and fixes.

We also consolidated our WordPress downloads and installation instructions as well as the plugin history on a new page that is solely dedicated to the WordPress plugin. We encourage all our users to review the Installation notes that have the most comprehensive up-to-date details on the shortcode config and other related notes.


Take it away!

 

Bookmark and Share

Free Template With Custom Progress And Spinning Rollovers

by NewsMaster December 02, 2016 08:44

Ever since we launched our new website featuring the revised 3D product view of a Reebok shoe with a custom progress indicator and spinning rollovers, we have been receiving questions on how these customizations were accomplished. Today we would like to share some details as well as the working example!

Click on this image to see it in action:

SpotEditor project that was used to create this template is available here.

The actual template file with the customizations is located under the published folder in the linked archieve and it's called SiteCustomizationsDemo.html such that it's not overwritten should you re-publish the project. Note that the project requires WebRotate 360 Product Viewer v3.6 RC (free version can be downloaded here).

Let's start with the spinning progress indicator which is based on SVG Circle Progress by Jon Christensen.

The core of the customization is a new viewer initialization parameter in WebRotate 360 Product Viewer v3.6 RC called progressCallback. Now you can pass this callback upon the initialization so you can be notified on loading progress. This includes the loading of the 360 product images as well as the hotspot rollover images (if they are configured under Image Content on the Hotspot form in SpotEditor). When you supply the callback, we automatically turn off the built-in progress indicator, and it becomes your responsibility to present the progress information to your visitors.

So if you are using jQuery, here's how this callback can be setup:

    jQuery('#wr360PlayerId').rotator( {
        configFileURL: '360_assets/SiteCustomizations/SiteCustomizations.xml',
        ....
        progressCallback: function(isFullScreen, percentLoaded, isZoomLoading)  {
            // your custom progress logic
        }
    });


percentLoaded is a numeric parameter, representing the current state of the loader in percent.

isZoomLoading is a boolean parameter which is only passed to the callback on zoom-in when your 3d product view is configured to use high-resolution images for image zooming. High-res zooming triggers the same progressCallback twice to give you a chance to show (and then hide) some sort of a progress status while the high-res image is being loaded. This means that isZoomLoading is first set to true followed by false in the second call when the high-res image is finally loaded.

With this in mind, we simply center the SVG circle (as per the codepen example) by absolutely positioning it inside our viewer container via div.customprogress. We then update the offset of the animated stroke in incrementProgress upon every call to progressCallback and according to the value of percentLoaded.

Next up is the spinning hotspot rollover...

We started by creating a hotspot in SpotEditor with the Text Content tab set to the following html markup (on the Hotspot form):

<div class="spinningSpot"><span>Text Hotspot</span></div>


"Use custom styles" was also checked on the same tab to give us full control over the hotspot presentation. The rest was done in CSS by styling div.spinningSpot and the embedded span element accordingly.

You can see the CSS styling inline in SiteCustomizationsDemo.html located under the published folder of the supplied SpotEditor project. In short, we have the parent container div.spinningSpot with two absolutely positioned elements: 1) div.spinningSpot:before for the spinning background and 2) div.spinningSpot span for the text. The demo SVG image that we used as a spinning background is also located in the linked zip archieve next to SiteCustomizationsDemo.html.


To test this template with your own (published) 360 views, copy SiteCustomizationsDemo.html to your published folder and update configFileURL on line 165 to link to your xml config file which you can find under 360_assets/your-project-name. Remember that you would need to publish your project using the latest SpotEditor v3.6 RC (build 1367) to test these customizations with your own 360 or 3D product images.

 

Bookmark and Share

Interactive 3D Product Visualizations at Venues, Conferences and Trade Shows

by NewsMaster November 08, 2016 11:31

It's true, WebRotate 360 Product Viewer is primarily designed for the online world. This has been our objective from the start!

But the technology was developed to be flexible so you could test your work locally on your computer or take it to your customer and still be able to demo it while being offline. More so, we worked with several software companies to make sure their webrotate 3D product views could be incorporated into native mobile applications without relying on the Internet connection (using native web browser controls both iPhone and Android offer).

Now, in the advent of huge touch screen displays, these efforts proved to be even more valuable as some of our clients started using these displays at various venues by incorporating WebRotate 360 Product Viewer for super interactive digital presentations of their products. These interactive product tours range from simple 360 product photography to highly detailed 3D product visualizations sprinkled with interactive call-outs, animations and other cool effects.

Today we are showcasing one such example expertly developed by SINCITYMADMEN for Telsmith and BTI. These companies manufacture mining equipment and their machines are so large and complex, it's hard to imagine a better technology than the oversized touch-screen displays you can see in the video and the photos below (courtesy and copyright by SINCITYMADMEN):

These interactive kiosks make it easy to create the wow factor you need by taking the wealth of your product information and the sales pitch and compressing it into a sophisticated high-tech digital presentation.

Mike Hopper, the CEO of SINCITYMADMEN whose team has developed the kiosk presentations was very kind to say this:

"Our client represents large mining equipment. Not only it's physically difficult to display in a live setting - but it's even more challenging to demonstrate the features inside. Our 3D development skills paired with WebRotate 360's software turned out to be the perfect combination. Allowing us to virtually show the heavy equipment from all sides on 55" giant touch screens."


PS: we haven't tested any of the large touch-screen panels ourselves so far, so can't recommend a particular brand yet. It seems that there're a lot of choices though from companies such as 3M, Planar, Elo, Ideum, Nec, Samsung, etc.

Below you can see some of the related links we found while researching the subject. We strongly recommend to test the webrotate viewer on a selected platform before purchasing the expensive equipment to ensure that the multi-touch capability some of these displays offer will work with your 3D product views and hotspot design, or simply contact SINCITYMADMEN and they will make it work for you!

http://www.touchwindow.com/c/60inchLCDTouchscreenMonitors.html
http://ideum.com/touch-tables/
http://www.planar.com/products/large-format-displays/ps/ps5561t/

 

Bookmark and Share

WebRotate 360 Product Viewer Integration for OpenCart 2.2.x and 2.3.x

by NewsMaster September 22, 2016 15:28

Announcing the release of v1.6 of our OpenCart integration. This one took some time as OpenCart had some major changes starting with version 2.2.0.0. We also wanted to incorporate all of the latest features that we have been releasing this year as part of v3.6 (version history).

So now you can enjoy multi-row 3D product views, Google Analytics integration, new styling with svg skins, new hotspot modes and various other improvements and fixes. This also allowed us to take some time to polish up our admin dashboard to look good and consistent with the rest of the OpenCart admin eco-system.

Folder structure of the module was re-worked to comply with the new OpenCart guidelines, so if you are on OpenCart 2.2.0.0 or 2.3.x and upgrading from the previous version of the webrotate plugin, it's best to remove the old plugin files first and then re-install using the new download links.

To remove old plugin files, please delete these files and folders fist:

  • admin\controller\module\wr360
  • admin\controller\module\webrotate360.php
  • admin\model\catalog\webrotate360.php
  • admin\view\template\module\webrotate360.tpl
  • admin\language\english\module\webrotate360.php
  • catalog\controller\module\wr360

You will also have to delete this webrotate vQmod file as it has changed as well:

  • vqmod_webrotate360_header.xml

Good news is that the database structure hasn't changed, so all your existing 360 product view configurations will remain intact and will still work with the latest version of the core 360 product viewer.

We now also have a dedicated page for the OpenCart plugin where you can find the latest downloads and instructions as well as the version history:


WebRotate 360 Product Viewer Integration for OpenCart


 

If you have any issues with the installation or upgrade, please let us know.

 

Bookmark and Share

Shopify Integration for WebRotate 360 Product Viewer Released

by NewsMaster September 01, 2016 11:07

Happy to announce that the first version of WebRotate 360 Product Viewer for Shopify has been released.

This time it's a full blown web application that neatly hooks into your Shopify dashboard while providing all latest features we released so far in v3.6. It's quite flexible too and should work with pretty much any Shopify theme or fine-tuned further by a Shopfiy theme developer as needed. And it's free!

Note that Shopify doesn't allow uploading folders to their file hosting yet which is required for WebRotate 360 and 3D product views to operate, so a separate hosting account is necessary. You may use any existing FTP account, setup an Amazon S3 account, etc.


Read more and install the app


 

Bookmark and Share

Version 3.6 Release Candidate Is Available For Download (Build 1367)

by NewsMaster July 27, 2016 11:17

v3.6 Release Candidate is now available for download! It includes a long list of improvements, new features and fixes that you can review here. These changes and updates were mostly driven by the work we have done on our new website in the last 6 months.

It could have been the final v3.6 release, but we still have to update the user guide and the info tooltips inside SpotEditor and it takes somes time.. Otherwise, it's a solid release that we recommend to all our users.

There're two major additions that most users will notice:

1. Vector SVG images are now used across all of viewer resources (no more raster graphics!). This ensures that your viewer skins and hotspots look sharp on any device. We also completely restyled two existing skins (thin and round) to look modern and usable with a greater variety of website designs out there. Also, all of the skins finally have the row navigation buttons for your multi-row 3D product views.

2. There's a new "shortcode" integration mode and publishing template which removes the viewer script snippets from your pages completely. This can drammatically simplify your website integration with various CMS platforms, especially when there're multiple 360 product views on the same page. Documentation is still in the works but you can simply select Shortcode template on the Publish form in SpotEditor and see it in action.

If you are a developer, this release adds a good number of API improvements, giving you more options for major viewer customizations. All new APIs are listed in the JavaScript template that you can select on publish in SpotEditor (and then explore the source html for additional bits and pieces as needed). Not to mentioned the long awaited support for jQuery 3.0!


DOWNLOAD v3.6 RC


Previously released features and fixes in v3.6:

 

PRO & Enterprise customers can request the commercial version of v3.6 RC via support. If you received v3.6 beta download URL from us before, it still works! And if you already have a previous build of v3.6 beta installed, you can simply download the new update via Check Updates on the About form in SpotEditor.

If you need any help applying this update to any of WebRotate 360's plugins (i.e, WordPress, Joomla, PrestaShop, Magento, OpenCart, BigCommerce), just let us know and we would be happy to assist.

 

Bookmark and Share

New WebRotate 360 Website Launched

by NewsMaster June 20, 2016 12:41

Happy to announce the launch of our new company website. It's built by us from scratch in-house based on years of hard work, helping our clients with their website needs. It's CMS driven, which will help us keep it always up to date with latest news, examples, releases and more.

Maybe even more importantly, it's fine-tuned to work nicely on modern mobile phones and high pixel density displays. It's super responsive and the demo 3D product views are optimized for mobile viewing so you can see the difference! More examples will be released soon and we will gradually move this blog onto the new platform as well.

The new website also represents the change in our vision after almost 7 years of delivering the most advanced 360 product viewer, related tools, software and services. Finally, we narrowed down our message to a few clear terms and examples that most of our users can relate to.

Also, starting from June 2016, we will be donating 5% of all product sales to selected charities that work in wildlife conservation and animal welfare which is one of the global issues all of us at WebRotate 360 are concerned with.

Stay tuned for more updates!

 

Bookmark and Share

Multi-row 3D Product View With Automatic Hotspot Labels

by NewsMaster May 23, 2016 12:38

Here's an interesting demo we did a few days ago of one of the cool features in v3.6 that allows combining multi-row 3d product views with image labels. These labels can be assigned to hotspot actions to produce pretty impressive product tours that can guide users from one product feature to another. Possibilities are endless, considering that you can have these hotspots and / or label actions in any form or fashion (lightboxes, custom popups, you own page content, apps, etc).

All of this is already available in the latest v3.6 beta that you can download here (it's stable and has been used in production by many companies for the last 6 months).

 


Final v3.6 release is right around the corner (and our new website undergoes the final preparations for going live!).

 PS: the excellent 3D product photography was produced for JVC by our friends at Flipside Studios in Berkeley, CA.

 

Bookmark and Share

Powered by BlogEngine.NET 2.0.0.36
Theme by Mads Kristensen | Modified by Mooglegiant

About this Blog

WebRotate 360 are specialists in interactive e-commerce solutions, web and software development for Internet retailers, product manufacturers, and marketing agencies.

We're a team of great individuals who bring our commitment, passion and skills to help you showcase your products online.


Follow on Twitter  Follow on Facebook  Join us on Google plus  Follow on YouTube  Subscribe to this blog  

Back to WebRotate360.com »

360 Photography Articles

Browse our 360 product photography articles and tutorials

Find us on Facebook

Newsletter, November 2016

WebRotate 360 spin newsletter

Newsletter Signup

Subscribe to our regular newsletter updates and keep current with WebRotate 360 news, including our latest tips and tricks, new equipment guides, promotions, coupons, product releases and more.

Featured Product

Browse 360 photography equipment on photogear360

DIY 360 Photography Turntable

Our Latest Video

360 Product Viewer PRO

Download our 360 product photography software

Follow on Twitter