FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe...

18
FME Extensions Product Zoom – Extension for Magento 2 User Guide - Version 1.0 http://www.fmeextensions.com [email protected]

Transcript of FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe...

Page 1: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions

Product Zoom – Extension for Magento 2

User Guide - Version 1.0

http://www.fmeextensions.com

[email protected]

Page 2: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

2 User Guide www.fmeextensions.com

Intended Audience The content of this document is designed to facilitate the users -managers, supervisors and others of FME Product Zoom Extension for Magento 2. A step by step instruction has been added to this document to help users to install the extension on Magento 2. This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension on Magento. If you are looking for someone to install the extension we can do it for you as well. Just go to the following link and let support know the order id to expedite the installation process. Go to: http://www.fmeextensions.com/magento-extension-installation.html Once you have installed please see the User Guide to help you understand on how to use the extension to its full capacity. If you still have questions feel free to contact us on our website. If you have any custom requirements feel free to touch base with. Just email [email protected] with the description of the requirements and they will get back to you with estimates. For further help or support, feel free to reach us @ http://support.fmeextensions.com.

Page 3: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

3 User Guide www.fmeextensions.com

Table of contents

I. Product Zoom – Extension

Intended Audience II. Table of Contents III. Getting Started!

Overview IV. Extension Features

Enable Zoom Magnifier

Light Box Product Image Preview

Create Rules for Image Zoom

Zoom-in Image of a Store View

Different Types of Magnifier

Set a Mobile View V. Installation Instructions VI. User Guide VII. Disclaimer VIII. Support IX. Customization X. Need a New Custom Extension?

Page 4: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

4 User Guide www.fmeextensions.com

Getting Started!

Overview

Magento Product Zoom facilitates the users of your websites to zoom

in product photography for a detailed overview. Add real touch to

your product display and have better conversions. You can enable a

zoom magnifier or lightbox preview for the product images. Create

rules to define image zoom-in of certain products to a selected user

group. Configure Mobile View settings to facilitate users browsing

through mobile devices.

Extension Features

Enable Zoom Magnifier

✓ You can enable Zoom Magnifier for product pages to let the users zoom in a specific portion the product.

Light Box Product Image Preview

✓ Allow users to view product images in a lightbox to have a big picture of the item they are interested in.

Create Rules for Image Zoom

✓ You can define rules and set conditions to zoom in specific products to a select group of users.

Zoom-in Image of a Store View

✓ By setting up rules, you can select specific store views to allow product image zoom for. It restricts zoom feature to a selected store view.

Different Types of Magnifier

✓ Select among a variety of magnifier types and customize it according to the products on your online store.

Set a Mobile View

✓ Select a mobile view either inner zoom or lens zoom to facilitate users browsing through mobile devices.

Installation Instructions

Page 5: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

5 User Guide www.fmeextensions.com

Method 1

1. Unzip fme_productZoom-x.x.x.zip to a local folder.

2.Make folder 'FME' in to your_magento_directory /app/code/

3. Copy unzipped folder 'ProductZoom' to your_magento_directory /app/code/FME (If

different name then rename it to ‘ProductZoom’)

4. Go to your_magento_directory /app/etc/

5. Open config.php file in etc folder

6. Add below line in $modules array at the end

'FME_ProductZoom' => 1,

7. Now open console or shell window

8. Go to your magento directory and run the below command

php setup/index.php update

9. Now logout from your admin panel and again login you will see FME Extensions

Menu in Left Menu of your admin panel

Method 2

1. Unzip fme_productZoom-x.x.x.zip to a local folder.

2.Make folder 'FME' in to your_magento_directory /app/code/

3. Copy unzipped folder 'ProductZoom' to your_magento_directory /app/code/FME (If

different name then rename it to ‘ProductZoom’)

4. Now open console or shell

5. Go to your magento directory and run the below commands

1. php -f bin/magento module:enable –clear-static-content FME_ProductZoom

2. php -f bin/magento setup:upgrade

6. Now logout from your admin panel and again login you will see FME Extensions

Menu in Left Menu of your admin panel

User Guide

Page 6: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

6 User Guide www.fmeextensions.com

After installation of module, make sure the setup is upgraded and static-contents are deployed. Login

to admin panel and flush you Magento cache storage.

I. How to Configure the Extension:

Once logged in to the Admin Panel go to the “Configurations”. You can enter there from Admin Menu

> FME Extensions. Here you will have access to the following settings:

General Settings:

1. Enable Module: Enable/Disable Module.

2. Zoom Type: Select the zoom type I-e Magnifier or Lighbox.

Magnifier Settings:

Magnifier Type: Select the magnifier from the list i-e Basic, Tint, Inner Zoom, Lens Zoom, Fade In / Fade

Out, Easing, Mouse Wheel Zoom, Window Position and Custom Design Zoom Window

1. Basic Zoom: As the name shows, it’s a basic zoom, we can change the window of basic zoom only

2. Tints: in Tint along with Window Width and Height, we have to select the following

a) Allow Tint: Enable/Disable the Tint

Page 7: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

7 User Guide www.fmeextensions.com

b) Tint Opacity: Select the Tint opacity from 0.1 to 0.9

c) Tint Color: Select the color from the color Picker. Leave empty for default Color (#a8abaf)

3. Inner Zoom: Inner Zoom we have to select the cursor type i-e cross hairs, grabbing etc.

a) Enable Scroll Zoom: Enable / disable scroll zoom.

b) Enable Easing: Enable / disable easing task.

4. Lens Zoom: In Lens Zoom We have to select the

a) Lens Type: We have to select the lens type i-e Rectangle or Round

Page 8: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

8 User Guide www.fmeextensions.com

b) Lens Size: along with this we have to select the size of lens

c) Enable Scroll Zoom: Enable / disable scroll zoom.

d) Enable Easing: Enable / disable easing task.

5. Fade In/Fade Out: In Fade In/ Fade out, we have to select the fade in and fade out time of Lens and

Window Respectively. Time is in second.

Page 9: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

9 User Guide www.fmeextensions.com

6. Easing: In Easing Effect, we have to enable or disable the easing effect

7. Mouse Wheel: Similarly In Mouse Wheel, We can enable or disable the mouse Wheel

Page 10: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

10 User Guide www.fmeextensions.com

8. Window Position: In Window Position, we can place the window in 16 different positions

9. Custom Design Zoom Window : Custom Design Zoom is one of the most important feature of

extension, it is the mixture of all the design define above

a) Tint

Page 11: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

11 User Guide www.fmeextensions.com

b) Opacity

c) Tint Color

d) Fade In/Fade Out Time

e) Window Position

f) Easing Effect

g) Mouse Wheel

Light Box Settings:

1. Next/Previous Arrow: You can enable / disable the arrows on lightbox

Page 12: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

12 User Guide www.fmeextensions.com

2. Enable Rotation: Similarly we can enable the rotation of images on lightbox

3. Transition Effect: There are three different transition effect of images on lightbox i.e. cross

fade, dissolve and slide

4. Transition Duration: We can also add the transition duration of images on lightbox. Time is in

milliseconds.

5. Navigation Style: There are three different Navigation styles i.e. dots, thumbs and disable

Mobile View Settings:

Magnifier Type: On Mobile There are two main magnifiers are available i.e. Inner or Lens Zoom.

II. How to Add/Edit Rule:

Page 13: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

13 User Guide www.fmeextensions.com

Step 1 – Add New Rule:

To add new rule, go to “Product Zoom”. You can enter “Manage Rule” from Admin Menu > FME

EXTENSIONS. Click on “Add New Rule” there to proceed.

Step 2 – Add Rule Information:

You can add the rule information as par your requirement. For the purpose of this demo we have to

add the following information.

Under the Main Tab:

1. Title of Rule

2. priority Order

3. Store View

4. Customer group

5. status of the rule

As in demo we have to define a rule name “Woman Category (Magnifier Only)” with priority 1 on all

store view applied on which customer group.

Page 14: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

14 User Guide www.fmeextensions.com

Page 15: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

15 User Guide www.fmeextensions.com

Under the Condition Tab

We have to select the condition for rule; in this case we have selected the Men’s category

Page 16: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

16 User Guide www.fmeextensions.com

Under the Action tab

We have to select the zoom type. In This case we’ll select the “Light Box” for our rule and save it.

Step 3 – Frontend:

Now on frontend, the light box will run on only men’s category. While on rest of the product

(Women’s category), magnifier will be applied.

Page 17: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

17 User Guide www.fmeextensions.com

While on women’s category Magnifier will be applied:

Disclaimer

It is highly recommended to backup your server files and database

before installing this module.

No responsibility will be taken for any adverse effects occurring

during installation.

It is recommended you install on a test server initially to carry out

your own testing.

Support

You can also find Step by Step guide on this extension by visiting

Product Zoom product page on our website. If you need more

information or have any questions or problems, please refer to our

support helpdesk:

Page 18: FME Extensions - Magento · 2018. 12. 10. · This extension will only work on Magento 2. As a safe practice always backup your files and database before installing any extension

FME Extensions Product Zoom

18 User Guide www.fmeextensions.com

http://support.fmeextensions.com

You can log a ticket and a support technician can assist you further.

If you are still struggling with your extension, submit a request via

[email protected]

Customization

If you have requirements that are not covered by our extension and

you need to have our extension customized, feel free to email us with

detailed requirements at [email protected]

You can also fill out a Request for Quote form here and we can get back

to you with a quote: http://www.fmeextensions.com/quickrfq

Need a New Custom Extension?

We can build a new extension based on your custom requirements if

needed. Feel free to email us at [email protected]