Back to Top

Magento 2 Multi Vendor Product 360 View

Updated 22 April 2024

Using Marketplace Product 360 view Add-on for Magento 2 (Adobe Commerce) gives the ability to the admin as well as the store sellers to add-up the products with a 360-degree view which displays product’s profile from every possible angle, which enriches the look of the product as well as of store.

Note – This is an Add-on of Magento 2 Multi-Vendor Marketplace, So in order to take benefits of Marketplace Product 360 View Add-on, you must have Magento 2 Multi Vendor Module installed in the first place.

Watch the video tutorial below to understand the extension workflow:

bBKzfyaNs-I

Features

  • Admin and seller can easily set the 360-degree view of a product.
  • Admin and seller can delete the images they added to a 360-degree product view.
  • The images supported format must be jpg, jpeg, PNG, gif only.
  • The add-on supports Simple & Configurable product types for admin products.
  • The add-on supports Simple & Configurable product types for sellers products.
  • With 360-degree product view, a customer can view every side of a product in a 360-degree rotating view.
  • Customer can pause or start again the 360-degree product view by clicking on the start/stop button.
  • In addition, to pause and start the rotation, the customer can also after stopping the rotation just slide the images with the mouse to view the slow movement of the product image from each angle.
  • The spin speed with which images rotate in a 360-degree view of a product can be managed by the admin.
  • Admin and seller can preview the product 360 views, before saving the product and can manage the images accordingly.

Installation

Customers will get a zip folder and they have to extract the contents of this zip folder on their system. The extracted folder has an src folder, inside the src folder you have the app folder.

You need to transfer this app folder into the Magento 2 (Adobe Commerce) root directory on the server as shown below.

Searching for an experienced
Magento 2 Company ?
Find out More
Installation Of Marketplace Split Order For Magento2

After the successful installation, you have to run these commands in the Magento 2 root directory:

First command –

1php bin/magento setup:upgrade

Second Command –

1php bin/magento setup:di:compile

Third Command –

1php bin/magento setup:static-content:deploy

After running the commands, you have to flush the cache from Magento admin panel by navigating through System > Cache management as shown below.

flush cache

Configuration For Multi-lingual Support

For the multilingual support, admin will navigate through Store > Configuration > General > Locale Options and select the locale as German (the language into which admin want to translate his store content).

Locale Configuration

Translation

If a user wants to translate their module from English to German then they need to follow the path /app/code/Webkul/MpProduct360view/i18n in their unzipped folder and will get a CSV file with name “en_US.csv”.

Now they will rename that CSV as “de_DE.csv” and translate all right side content after the comma in the German language.

After editing the CSV, save it and then upload it to the path /app/code/Webkul/MpProduct360view/i18n where they have installed Magento 2 on the server.

The module will get translated into the German Language. It supports both RTL and LTR languages.

Marketplace Split Order For Magento2 Translation
Marketplace Split Order For Magento2 Translation

The user can edit the CSV like the image below.

Marketplace Split Order For Magento2 Translation

Initial Add-On Configuration

After successfully installing the add-on, the admin will perform some basic steps to configure it.

The admin will navigate to Store> Configuration> Product 360 view configurations as per the snapshot below.

Admin Initial Configuration

From here, the admin will:-

  • Enable the add-on by selecting “Yes” or “No”.
  • Set 360 Frame Time: Admin can also set 360 Frame Times for rotation of the file.
  • It is in a millisecond if it is less in number then it rotates fast or if it is more in number then rotates slow.
  • Thumbnail Image: Admin can upload a thumbnail image of allowed file types: jpg, jpeg, gif, png. This image will be displayed at the start of the product 360 view images.

Admin Product End Management

In order to set the product 360-degree view for admins’ product, let us navigate to the Catalog->Products. Here the admin can create a new product as well as can edit an existing one to add the 360-degree view of a product.

Note:- The add-on supports Simple & Configurable product types for admin products.

Admin view all products

Now for instance lets take an example of product “Chair”, click on edit to make the product in edit mode.

After this scroll down to the Product 360 degree view option under it. From here the admin will firstly enable the option to use the 360 degree view feature on this product as shown below.

Create new product

The admin will now upload the images in such a sequence as per the product view which ultimately helps in creating a better 360-degree product view.

Admin upload multiple images

After uploading the images, the admin even can take a preview of the 360-degree product view in order to add or replace more pictures in order to improve the frame rate.

Product Image

After uploading the pictures, the admin needs to save the product so that the end customer can take a 360 degree product view.

FrontEnd View Of The Product

The customer needs to visit the product page to view the 360 degree product view. As shown below.

Product visibility on Customer page

Now clicking on the 360 degree image will open up the 360 degree product view which generally help out the customer to view the product from every possible angle.

product view from different angle

The customer in order to get a 360-degree view can just play the product rotation which generally showcases the 360 degrees of the product.

Also the customer can pause/stop the rotation by just a mouse click on the button available.

In addition, to pause and play the rotation, the customer can also after stopping the rotation just slide the images with the mouse to view the slow movement of the product image from each angle.

Product view

As this is a marketplace add-on, So it offers the same functionality of adding 360-degree product view experience for the seller’s product as well.

Seller’s Product End Management

In order to set the product 360-degree view for the product, the seller needs to login into their account. Here the seller can create a new product as well as can edit an existing one to add the 360-degree view to a product.

Note:- The add-on supports Simple & Configurable product types for sellers products.

Seller Account information

Seller, for instance, creates a new product & fill out all the necessary information in the concerned fields and will reach to the Product 360-degree view configuration setting.

seller enable status

Similarly, the seller for this product will add up the product images from Product 360 View setting for creating a 360 degree product view .

seller add multiple images

After uploading the images, the seller also takes a preview of the 360 degree product view in order to add or replace more pictures in order to improve the frame rate.

Product 360 preview

Now the seller needs to save the product so that the end customer can take a 360-degree product view.

Product 360 Degree View For Sellers Product

The customer needs to visit the product page to view the 360 degree product view. As shown below.

product view on customer page

Now in order to experience the 360 degree view of this product, the customer needs to click on the 360 degree thumbnail below.

And, finds the 360 degree view of the product. As shown below in the screenshot.

product preview

The customer in order to get a 360-degree view can just play the product rotation which generally showcases the 360 degrees of the product.

Also the customer can pause/stop the rotation by just a mouse click on the button available.

In addition, to pause and play the rotation, the customer can also after stopping the rotation just slide the images with mouse to take a slow movement of the product image from each angle.

multiple preview of product

In conclusion, that’s all for the Marketplace Product 360 View for Magento 2 (Adobe Commerce), in case of any query, you can create a ticket at webkul.uvdesk.com or contact us at store.webkul.com/contacts/ to let us know your views to make the plugin better.

Explore the Adobe Commerce Cloud development services by Webkul. You may also browse other Magento 2 marketplace addons. Also our quality Magento 2 extensions.

Current Product Version - 5.0.2-p2

Supported Framework Version - Magento 2.0.x, 2.1.x, 2.2.x,2.3.x, 2.4.x

. . .

Leave a Comment

Your email address will not be published. Required fields are marked*


Be the first to comment.

Back to Top

Message Sent!

If you have more details or questions, you can reply to the received confirmation email.

Back to Home