Visual Intelligence Shopware Plug-in Manual¶
- Visual Intelligence Shopware Plug-in Manual
Shopware version supported: from 5.3.7 and higher
This manual shows you step by step on how to install and use the plug-in in your online shop.
Please test the installation and the configuration of the plugin on a test system before
installing it in your live shop.
The plug-in Visual Intelligence from Mediaopt supports the integration of the Visual-Product-Recommendation (VPR)
In your online shop and provides image synchronisation for Visual-Product-Search (VPS) too.
VPR is a cross-selling campaign on your product page, which generates recommended products based on their visual similarity to the source product.
VPS allows your customer to search not only by text but to find products based on images or the input of the camera on their (mobile) device.
Plugin Installation ¶
Before you start with the installation process, backup your database and your online shop.
If you have concerns about installing the plugin, let this job be done by a professional, or feel free
to contact us for help.
Please, follow this instruction carefully for an undisturbed use.
The official Visual Intelligence Shopware plug-in is provided by Mediaopt. If you are a customer of our service please ask
firstname.lastname@example.org for the latest plug-in version. If you are interested to test the plug-in,
use the contact on the following link: https://www.mediaopt.de/visual-product-recommendation
If you received the plug-in in a zip-file, go to your Shopware backend and Configuration > Plugin Manager > Installed.
Click on the "Upload plugin" button, choose the zip-file and start the installation.
In the future, it will be possible to download the plug-in in the Shopware online shop backend or the Shopware store too.
Activate the plugin in Configuration > Plugin Manager > Installed > Click on the pencil image to the
right of the plugin name > Activate plugin button. Fill in your credentials and security data, choose
your configuration and save the plugin settings.
- Enable in this subshop: [Yes/No] - You may enable/disable the plugin for each of your subshops individually.
- API Key: [string] - Type in your API-User. Check your last Mediaopt infomail.
- Your API Password: [string] - Type in your API-Password. Check your last Mediaopt infomail.
- Environment: [one of the options] - Choose Productive for shop deployment, change to Stage for testing mode.
- Enable article auto indexing: [Yes/No] - If this option is enabled, the plug-in will re-index an article each time it is updated.
- Username for the Basic Auth(htaccess): - Give in HTACCESS username if you have Basic Auth enabled. The advanced setting, usually only for test environments.
- Password for the Basic Auth(htaccess): - Give in HTACCESS password if you have Basic Auth enabled. The advanced setting, usually only for test environments.
Article image to Index: [one of the options] - Choose which images you would like to index. More information on this
point follows below.
- Log level: [one of the options] - Choose Debug for a test installation, change to Error on a live site.
- Log rotation days: [integer] - How many days to keep logs.
Indexing of images¶
According to data security concerns, all images of products, which are sent to be indexed, will not be stored on our services.
Our AI system analysis the image and stores just the resulting description.
In order to have a better image analysis result, it is important to send well-prepared images. The photo
should contain an isolated product, in best case without containing any complex background or other
objects or persons.
Pick "first and second" in the Article image to Index configuration option if you have a good overview
photo of your product on the first and second image, but have a close look/documentation/use case image
on the third one.
|First Article Image||Second Article Image||Third Article Image|
(Use case with many forefront objects)
To receive Visual Product Recommendation in your online shop you need to synchronize your product images
with our Visual Intelligence system first. Please select the product categories in your online shop backend to collect
the product, which should be analysed and get Visual Product Recommendations.
Items -> Categories -> "Category" -> Visually Similar Products -> Mark for synchronization.
There are three options for the image indexing:¶
Configuration -> Basic settings -> System -> Cronjobs -> Visually Similar Product -> Edit -> Active [check]
2. Execution of a command in the Shopware console.
You could run the following command in the terminal: bin/console mopt_visual_recommendation: synchronize
To make a forced synchronization, use --force (shortcut -f) option bin/console mopt_visual_recommendation:synchronize --force
3. Indexing through the "Content" menu entry.
Content -> Visually similar products -> Start synchronisation (Alternative: Start force synchronization)
If any category was unmarked or if the catalog tree was changed, please, use the force synchronization. In any other cases click on the "Start synchronization".
If everything is done right, the tab with "Visually Similar Products" will appear in your online shop frontend product page.
Below is just one example of the possible implementation of the plug-in and its results.
Under settings the last three options are concerning tracking. A simple on/off turns everything on/off accordingly. Additionally the debug options logs tracking events to the browser console.
As default etracker, a german based company, will be used. Please make sure to add this information to your data privacy statement. Please see the example text and make sure that it satisfies the law of your country.
The following events and options will be tracked:
|DESCRIPTION||myCategory||myObject||myAction||myType||area (auto)||pagename (domain)|
|load-Vi-VPR-ProductPage||VI-VPR | defaultPR||load||detail|
|view-Vi-VPR-ProductPage||VI-VPR | defaultPR||view||detail|
|view-Vi-VPR-Product-ProductPage||VI-VPR-Product | defaultPR-Product||productID||view||detail|
|click-Vi-VPR-Product-ProductPage||VI-VPR-Product | defaultPR-Product||productID||click||detail|
|view-Vi-VPR-ListPage||VI-VPR | defaultPR||view||list|
|view-Vi-VPR-Product-ListPage||VI-VPR-Product | defaultPR-Product||productID||view||list|
|click-Vi-VPR-Product-ListPage||VI-VPR-Product | defaultPR-Product||productID||click||list|
|addToBasket-VI-VPR-ProductPage||VI-VPR-Product | defaultPR-Product||productID||addToBasket||detail|
|addToBasket-VI-VPR-ListPage||VI-VPR-Product | defaultPR-Product||productID||addToBasket||list|
Furthermore we are using campaigns on similar products:
|Description||Campaign name||Campaign medium||Campaign partner||Campaign type||Campaign origin|
|click on VI-VPR-Product||VI||VPR||mediaopt||recommendation||ListPage | ProductPage|
Mapping of the campaign parameter to tracking services:
|Tracking service||Campaign name||Campaign medium||Campaign partner||Campaign type||Campaign origin|
A hidden div element is present on the recommended products with mo_vi_vpr-source as an id. It has a data attribute data-movisource which value represents the tracking source.
1 = our recommendation, 0 = default recommendation
Preventing and Enabling Cookies¶
When enabling the frontend tracking you may prevent setting of cookies with an extra option.
If you choose to disable them and have a cookie message you may put the classname mo_js-enableTrackingCookie onto that element to have an explicit opt in of setting cookies for the tracking.