Supro – Minimalist AJAX Magento 2 Theme

Overview & Installation

Overview

Supro Magento 2 Documentation v1.0

ArrowTheme has achieved more than 10 years of experience working on Magento commerce and completed 2000+ Magento projects so far. Thanks to our rich experience in the realm, our proficient team of Magento developers and managers have designed and developed a lot of useful extensions exploiting great features of Magento.

MGS Front-end Builder 2 is fully compatible with Magento Community Edition 2.1.x, 2.2.x, 2.3.x

Installation

Install Magento

If you haven’t got a Magento website yet, you will have to install a copy of Magento Community Edition open source e-commerce web application before using MGS Front-end Builder Theme.

If you already have installed Magento you can skip this section

To install Magento, follow these steps:

STEP 1: Check if your server is compatible with Magento 2

Operating systems (Linux x86-64)

Linux distributions such as RedHat Enterprise Linux (RHEL), CentOS, Ubuntu, Debian, and so on

Composer (latest stable version)

Composer is required for developers who wish to contribute to the Magento 2 codebase or anyone who wishes to develop Magento extensions

Web servers

In addition, the apache mod_rewrite module must be enabled. mod_rewrite enables the server to perform URL rewriting. For more information, see our Apache documentation

Database

MySQL 5.6 (Oracle or Percona)

PHP

  • 5.6.x
  • 5.5.x, where x is 22 or greater
  • 7.0.2 up to 7.1.0, except for 7.0.5There is a known PHP 7.0.5 issue that affects our code compiler; to avoid the issue, do not use PHP 7.0.5.

PHP documentation: CentOS, Ubuntu

Required PHP extensions:

PHP OPcache

We strongly recommend you verify the PHP OPcache is enabled for performance reasons. The OPcache is enabled in many PHP distributions. To verify if it is installed, see our PHP documentation for CentOS or Ubuntu.

If you must install it separately, see the PHP OPcache documentation.

PHP settings

We recommend particular PHP configuration settings, such as memory_limit, that can avoid common problems when using Magento.

For more information, see our recommendations for CentOS and Ubuntu.

SSL

Mail server

Mail Transfer Agent (MTA) or an SMTP server

Magento can utilize the following technologies:

  • Redis version 3.0 for page caching and session storage (the latter supported by Magento version 2.0.6 and later only)
  • Varnish version 3.5 or latest stable 4.x version for page caching
  • memcached latest stable version for session storage with either memcache or memcached PHP extensions (latest stable version)

Optional but recommended:

php_xdebug2.2.0 or later (development environments only; can have an adverse effect on performance)

There is a known issue with xdebug that can affect Magento installations or access to the storefront or Magento Admin after installation.

PHPUnit (as a command-line tool) 4.1 or later

STEP 2: Download Magento 2

You can download magento 2 here: https://www.magentocommerce.com/download. If you want to use sample data please download “Full Release with Sample Data (ZIP with sample data)” package, if not please download “Full Release (ZIP with no sample data)” package

STEP 3: Transfer the Magento archive to your server

To transfer the Magento software archive to your server:

  • 1. Install and configure a file transfer protocol (FTP) or secure copy protocol (SCP) client to transfer the Magento software from your computer to your server.
  • There are many ways to configure FTP and SCP. Following are a few packages you can use. Magento does not recommend particular software.
  • 2. Create a connection to your Magento server.

Follow the prompts on your screen or consult the documentation provided with your FTP software for more information.

  • 3. After you log in to your server, browse to locate the Magento CE or EE archive on your local system.

On the remote system, browse to locate the web server docroot directory.

The following figure shows an example.

  • 4.Transfer the archive from your local system to the web server docroot directory.

On some FTP client software, you do this by dragging and dropping.

  • 5. Wait while the transfer completes.
  • 6. Log in to your Magento server, or switch to, the Magento file system owner.
  • 7. Change to the web server docroot or the virtual host directory.
  • 8. Create a subdirectory for the Magento software.

If you set up a virtual host, the subdirectory name must match the name in your virtual host.

For example,

mkdir magento2ce
mkdir magento2ee

You can also use a generic directory name

mkdir magento2

  • 9. Copy the Magento archive to that directory.

For example,

cp /var/www/Magento-CE-2.0.0+Samples.tar.bz2 magento2

  • 10.Continue with the next section.

STEP 4: Extract the software on your server

Log in to your Magento server as, or switch to, the Magento file system owner and extract the software package in the web server docroot using one of the following commands:

File FormatCommand to extract
.tar.gztar zxf <filename>
.zipunzip <filename>
.tar.bz2tar jxf <filename>

STEP 5: Set file system ownership and permissions

This topic discusses how to set read-write permissions for the web server group before you install the Magento software. This is necessary so the Setup Wizard or command line can write files to the Magento file system.

The procedure you use is different, depending on whether you use shared hosting and have one user or if you use a private server and have two users.

If you’re using a Magento version earlier than 2.0.6, see Appendix—Magento file system ownership and appendix (legacy) instead.

STEP 6: Running the Setup Wizard

The Setup Wizard is a multi-page wizard that enables you to go back and forward one page at a time. You cannot skip pages, and you must enter all required information on every page before you can proceed to the next page.

In the event of errors, you can run the installer again or you can return to a previous page to fix errors on that page.

Getting started

To install the Magento software using the Setup Wizard:

  • 1. Start a web browser.
  • 2. Enter the following URL in the browser’s address or location bar:
    http://<Magento host or IP>/<path to Magento root>/setup
    For example, if the Magento server’s IP address is 192.0.2.10 and you installed Magento 2 in the magento2 directory relative to the web server’s docroot, and you did not configure a Virtual Host, enter: http://192.0.2.10/magento2/setup
  • 3. On the initial page, click Agree and Set Up Magento.
  • 4. Continue with the following topics in the order presented to complete the installation.

STEP 7: Finish

When your Magento installation is completed successfully you can start theme installation procedure.

Install Theme

DEMO VIDEO: How to install Supro Theme

Here you can watch our video of how to install Supro Theme

https://youtube.com/watch?v=j2_bfqpx_Mw%3Ffeature%3Doembed

STEP 1: Upload Pack

Using a FTP client to upload content of supro_v[…]/Themes/Source/ folder to the Magento root folder where you installed the Magento2 earlier on your Web Server.

After uploading the content of “Source” folder as above, you need to apply a patch for Magento version you are using:

  • If you are using magento version 2.2.x(x from 0 to 7): read Readme file in supro_v[…]/Themes/Source/patch_for_magento_2.2.x (x from 0 to 7)/ folder and apply this patch.
  • If you are using magento version 2.2.8: read Readme file in supro_v[…]/Themes/Source/patch_for_magento_2.2.8/ folder and apply this patch.
  • If you are using magento version 2.3.0: read Readme file in supro_v[…]/Themes/Source/patch_for_magento_2.3.0/ folder and apply this patch.
  • If you are using magento version 2.3.x (x<=3): read Readme file in supro_v[…]/Themes/Source/patch_for_magento_2.3.x (x <= 3)/ folder and apply this patch.
  • If you are using magento version 2.3.4 or later: read Readme file in supro_v[…]/Themes/Source/patch_for_magento_2.3.4/ folder and apply this patch.

STEP 2: Enable Module and Deploy theme

  • Login to your server with your SSH account
  • Switch to apache user
  • Navigate to magento root directory
  • Set permission for var/ and generated/ folder, at least 775 (you can ask your hosting provider if you feel confused about this)
  • Run command line: php bin/magento module:enable MGS_Fbuilder
  • Run command line: php bin/magento module:enable MGS_ThemeSettings
  • Run command line: php bin/magento module:enable MGS_Mmegamenu
  • Run command line: php bin/magento module:enable MGS_Portfolio
  • Run command line: php bin/magento module:enable MGS_ExtraGallery
  • Run command line: php bin/magento module:enable MGS_GDPR
  • Run command line: php bin/magento module:enable MGS_Guestwishlist
  • Run command line: php bin/magento module:enable MGS_SuproTheme
  • Run command line: php bin/magento module:enable MGS_Testimonial
  • Run command line: php bin/magento module:enable MGS_Brand
  • Run command line: php bin/magento module:enable MGS_StoreLocator
  • Run command line: php bin/magento module:enable MGS_Blog
  • Run command line: php bin/magento module:enable MGS_Aquickview
  • Run command line: php bin/magento module:enable MGS_Lookbook
  • Run command line: php bin/magento module:enable MGS_AjaxCart
  • Run command line: php bin/magento module:enable MGS_Protabs
  • Run command line: php bin/magento module:enable MGS_InstantSearch
  • Run command line: php bin/magento module:enable MGS_Ajaxlayernavigation
  • Run command line: php bin/magento setup:upgrade
  • Run command line: php bin/magento setup:static-content:deploy -f

Deploy static view files document

  • Run command line: php bin/magento cache:clean

STEP 3: Enable Supro Theme

Go to CONTENT -> Configuration [Design], edit store view you want to use the Supro theme then select to use “MGS Supro”

After selecting the Supro theme, refresh magento cache

STEP 4: Activate Theme

After install theme, please log in admin panel through your admin account, the go to Backend > STORES > [Settings] Configuration > [MAGESOLUTION] Activate Theme and insert the “Purchase Code”.

Click here to know how to get Purchase Code. Note that, with “Regular License”, one Purchase Code is used for only 1 domain.

  • Option 1: Work on your localhost.
  • Option 2: Use subdomain. We allow using unlimited subdomain for dev site purpose. However, you have to insert the purchase code for the principal domain before using this purchase code for other subdomains.For example, with your main domain “ mydomain.com”, you are able to create several subdomains such as dev.mydomain.com, staging.mydomain.com, abc.mydomain.com…

STEP 5: Import Static Blocks

Go to MGS -> Page Builder Setting [Page Builder], you can see Export & Import panel. Click Import Supro’s Static Blocks button to import the static blocks

Until Backend returns success message, Go to System -> Cache management. Select all, choose refresh action and submit. All of static blocks sample are imported, you can go to CONTENT -> Blocks and see them

STEP 6: Import a Homepage

Select defaul homepage:

  • Go to STORES -> Configuration [Settings] -> Web [GENERAL] -> Default Pages, here you can select the default page you want in “CMS Home Page” field. Note that if you have multi store view you should select a store view before selecting the default home page.

Import a homepage:

  • Go to MGS -> Page Builder Setting [Page Builder], you can see Export & Import panel.
  • You can see “Import CMS Page”, select the default homepage you just specified above then “Choose File”, you can find the homepage demo file in supro_v[…]/Themes/Homepage Demo/ then click “Import”, please wait until the homepage is imported then refresh cache.

STEP 7: Complete

Go to the homepage to see your site then edit the homepage

Copy Link