Product Selector Magento 2 Installation

Home » Product Selector Magento 2 Installation

http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/product-selector_2%20mag2.png

Overview

Product Selector Magento 2 Extension allows your users to search the vehicle parts filtered more thoroughly based on Category,Sub Category,Make,Model and year using dropdowns to your site.it is a fast way to find the product with our specifications.So it is one of the needful extensions for Magento store.

Video Tutorial

Are you familiar with Magento extension installation? If so, you can quickly watch this Video tutorial to perform the installation.

Watch Video Tutorial

Installation Steps for Product Selector Extension

  1. Take a backup of the Magento files before replacing
  2. Extract the files inside Magento Installation Root Magento_App_Root folder is same as your Magento 2.0 Installation directory
  3. For installing module,initially we will createjson,registration.php,module.xmlfiles.

Composer.json is used for the configuration of magento2.0 module.

registration.php allows you to create modules in the app/code folder,we create the file instead of config.xml file which is now used for module configuration variables.

module.xml is kind of the entry point of module It’s the equivalent of app/etc/modules/[Namespace]_[Module].xml in magento 1.

Add composer.json , registration.php and module.xml files in your module by following path 

/app/code/Namespace/Module/composer.json       

/app/code/Namespace/Module/registration.php

/app/code/Namespace/Modulename/etc/module.xml

  1. After Transferring files we have to register our module inapp/etc/config.xml In the array module, add the element: ‘Namespace_Modulename => 1

(OR)

Open Command line in folder root of magento and run commands magento setup:upgradeNow clear all caches and var/generation folder. Login to admin panel > Stores > Configuration > Advanced Your module should be listed here now.

Steps to be followed in admin panel to setup attributes

Step 1: Create Attribute:

Stores -> Product

http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/ps_1.png

Then click the button “Add New Attribute”

http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/ps_2.png http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/ps_3.png http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/ps_4.pngAttribute code: ps_year

Unique value: No
Values Required: Yes
Select all option yes for Use in quick search, Use in advanced search, Comparable on Front-end, Use In Search Results Layered Navigation, Allow HTML-tags on Front-end, Visible on Product View Page on Front-end, Used in product listing, Used for sorting in product listing

Similarly Create attributes  “ps_make” and “ps_model”

Please make a note of the 3 Attribute Codes. It should be  “ps_make”, “ps_model”, “ps_year”

Step 2: Assign attributes to Attribute Set:

Create Attribute Set

Stores-> Attributes set

http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/ps_5.png

Click on Default or any other attribute set as you need

Note: You may choose a different Attribute set appropriately depending on which products you want to setup product selector  Click the button Add New under Groups

You can find a pop up Explore User Prompt. Please enter the group name “Productselector”

A group will be created at the end you can drag and drop to your respective location.

http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/ps_6.pngStep 3: Add Products:

Products->Catalog->Add product

http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/ps_7.png

You can find a new tab “Productselector”  on the left side. Fill in all the required details and assign the product to a category as needed.

Note: “ps_make”, “ps_model”, “ps_year”  can take multiple values if the product has several vehicle fitments. Please enter values in comma separated format. For Example:

Make=Audi, Toyota, Ford

Model=Accord, Camry, Focus

Year=2006,2007,2008,2009,2010,2011,2012,2013,2014

Step 4: Add a new page for YmmpSearch:

Content-> Pages-> Add New Page

Page Title: Product Selector
Self URL: product-selector
Status: Enabled

http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/ps_8.pngContent:

{{block class=”Magento\Framework\View\Element\Template” name=”catalog.product.categorysearch” template=”Globalecom_Ps::product/category-search.phtml}}

 

http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/ps_9.png

Step 5: Assigning Magento Category and Sub Category:

Category drop down will show 1st level of categories what are in magento admin setup.Sub category drop down will load 2nd level of categories based on chosen category from category drop down.

 

http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/ps_12.png

 

Step 6: Refresh Magento cache:

http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/ps_10.png

Now the front end shows like below the screen,

http://global-ecommerce-services.com/wiki/wp-content/uploads/2016/07/ps_11.png

How to uninstall the Product Selector extension

Please follow the instructions below to uninstall Product Selector extension and remove from your website.
Step 1: Go to the location app/etc/config.xml
Find the module Globalecom_Ps => 1
and change it to 0
Refresh the Cache in admin panel->System->Cache Management
Step 2: Remove the file category-search.phtml in the following location.
app/code/Namespace/frontend/Modulename/view/frontend/templates/product/

 Questions

If you have any questions or issues, please contact technical support team via http://mage-extensions-themes.com/support/