FreeGo - Magento 2 Theme | Documentation

Use coupon code FGINS10 to get 10% discount on all Magento 2 Themes / Extensions

FreeGo - Getting Started

Introduction

Thank you for downloading the Free Magento 2 theme. This documentation consists of several parts and covers the entire process of installing and setting up the Free Magento 2 theme starting from scratch.


Freego theme files structure

The theme package you have downloaded consists of several folders. Let's see what each folder contains:

  • documentation
    contains documentation files.
    • documentation.html
      a main documentation file you are reading at the moment.
  • theme-files
    contains freego theme files data
    • solwin-freego-theme-2.0.x.zip
      contains freego theme files for magento 2.0.x.
    • solwin-freego-theme-2.1.x.zip
      contains freego theme files for magento 2.1.x.
    • solwin-freego-theme-2.2.x.zip
      contains freego theme files for magento 2.2.x.
    • solwin-freego-theme-2.3.x.zip
      contains freego theme files for magento 2.3.x.
  • freego-demo.url
    redirect to freego theme demo.

Prerequisite

Before you install Magento, you must check all of the following:

Apache

  • You must run Apache version 2.2 or 2.4.
  • In addition, the apache mod_rewrite module must be enabled. mod_rewrite enables the server to perform URL rewriting.

PHP


For Magento 2.1 version

  • PHP 5.6.X, 5.5.22, 7.0.2, 7.0.4 and 7.0.6

For Magento 2.1 version

  • PHP 5.6.5, 7.0.2, 7.0.4 and 7.0.6

For Magento 2.2 version

  • PHP 7.0.13 and 7.1.0

For Magento 2.3 version

  • PHP 7.1.3 and 7.2.0

Visit this magento official document page for further details of installation
https://devdocs.magento.com/guides/v2.2/install-gde/system-requirements-tech.html

Required PHP extensions:

  • PDO/MySQL
  • mbstring
  • mcrypt
  • mhash
  • SimpleXML
  • curl
  • xsl
  • gd, ImageMagick 6.3.7 (or later) or both
  • soap
  • intl
  • bc-math (Enterprice Edition Only)
  • openssl

MySQL

  • You must run MySQL version 5.6 or later

File Permission

The web server user must have write access to the following files and directories:

  • var
  • app/etc
  • pub

We recommend setting the permissions as follows:

  • All directories have 770 permissions.
  • 770 permissions give full control (that is, read/write/execute) to the owner and to the group and no permissions to anyone else.
  • All files have 660 permissions.
  • 660 permissions mean the owner and the group can read and write but other users have no permissions.
Visit this magento official document page for further details of installation https://devdocs.magento.com/guides/v2.2/install-gde/system-requirements-tech.html

Creating a database

First, you need to prepare a new database for your Magento store. You can create the new database using the database management tool from your hosting control panel (usually PhpMyAdmin).

The following data will be received while creating a database: database name, database username, password and you server name. You need to save this data as you will need it for further Magento installation.

With the phpMyAdmin tool you will be able to create a new database in 3 simple steps(check the slides below):

1. Open the "Databases" tab, you will see the list of databases.

create database - image1


2. Input your database name. Click "Create" button.

create database - image2


3. Your database has appeared in the list. In order to enter the database, click on its name in the list.

create database - image3


If you have any issues with creating a database, please contact your hosting provider for help and assistance.

Magento Installation

When you are done with uploading magento files, you can start Magento installation process.

Open your browser and in the address bar type your 'domain name/path to your Magento directory'. You should see the welcome screen. Please follow below instructions to install Magento.

Step 1: Installation Assistant

Please read the license agreement and click the "Agree and Setup Magento" checkbox if you are agree with the terms.

how to install - image1


Server Readiness Check

Click the "Start Readiness Check" button to check your server settings compatibility with the Magento 2 requirements.

how to install - image2


Step 2: Database connection

Here you need to input the database details and some initial settings. Add a Database – input your Database Host, Database Username, Database Password and Database Name. Contact your hosting provider, if you don't have these necessary details.

Make sure you have a database created for the Magento installation. And also make sure it is clear, without any tables.

how to install - image4


Step 3: Web Configuration

Here you need to input the website url for front and admin.

how to install - image4


Step 4: Localization

Select the required time zone, default currency and store language. In the Advanced Modules Configurations section you can also select default modules that should/shouldn't be installed. We recommend that you do not perform changes in this section.

how to install - image6

When the checking procedure is complete, click 'Next'. button.


Step 5: Create Admin Account

Here you need to input personal details for the store owner and administrator.

how to install - image7


Step 6: Install

The store configuration is done. Press the Install Now button to start the store installation process.

how to install - image8


Step 7: Success

This is the final installation step. Copy the generated encryption key and keep it safe.

how to install - image9

FreeGo theme installation

This theme is not compatible with the Magento 1.x. It will work with the Magento 2.x only.

Installation Process

Download the theme file:
  1. Download the FreeGo theme .ZIP file from solwininfotech.com using your Solwin Infotech website account.
  2. Extract the .ZIP file which contains another .ZIP files into the theme-files folder.
  3. If you have purchased the theme for the Community Edition, then you will see the theme .ZIP file for Magento 2.0.x, Magento 2.1.x, Magento 2.2.x and Magento 2.3.x version.
theme Installation:
  1. If you are using Magento 2.0.x then you need to extract solwin-freego-theme-2.0.x.zip file.
    If you are using Magento 2.1.x then you need to extract solwin-freego-theme-2.1.x.zip file.
    If you are using Magento 2.2.x then you need to extract solwin-freego-theme-2.2.x.zip file.
    If you are using Magento 2.3.x then you need to extract solwin-freego-theme-2.3.x.zip file.
  2. Copy the app and the pub folder and paste it into your magento ROOT directory.
  3. Run upgrade command as specified: php bin/magento setup:upgrade
  4. Run deploy command as specified:
    For Magento 2.0.x and 2.1.x: php bin/magento setup:static-content:deploy
    For Magnento 2.2.x and Magento 2.3.x: php bin/magento setup:static-content:deploy -f
  5. Clear the cache either from the admin panel or command line php bin/magento cache:clean

For more details click here.

Theme configuration

We are going to review theme configuration options based on the example. We will configure it the same way as our live demo theme, without affecting products data. Please note that the actual images and banners of the demo will not configure. In place of those images, the blank images will be configured.

Activate the new theme

Open Magento admin panel and navigate to Content > Design > Configuration menu.

Theme set - image1-1


Click on Edit.

Theme set - image2


Select the Solwin FreeGo Child theme from dropdown. And click on 'Save Configuration'

Theme set - image2

Logo configuration

1. Open Magento admin panel and navigate to Content > Design > Configuration menu.

Theme set - image9-1


2. Click on edit.

Theme set - image9-1


3. Expand the Header tab and click on Upload button to upload your logo.

Theme set - image10-1

4. Click Save Configuration button.

Pages configuration

1. From the menu select Content > Pages. Here you can find all the store pages. Home page, About Us and Customer Service should already be available, so you don't need to add them. Open any of them in order to get the access to the content.

page settings - image2

2. Let's take, Home Page. Edit that page and select the Content tab. It contains the HTML code of the page. We have a source code for look homepage exactly like our Live Demo.

page settings - image3

3. To add Widget, click on Show / Hide Editor and then click on Insert Widget.. button. It will open one popup window. From there, select widget that you want to display on the home page with widget options and click on Insert Widget button.

Like: How to add feature product section in home page?

Follow this steps to add Feature product widget on page.

  • Setp 1: Click on Insert Widget... button.
  • Setp 2: Select Catalog Products List from Widget type option.
  • Setp 3: Set title for widget.
  • Setp 4: Click yes to set page control.
  • Setp 5: Set prodict display limit for widget section.
  • Setp 6: Set product template for widget.
  • Setp 7: Set Cache Lifretime for products if required.
  • Setp 8: Set product display condition.
    • 1. Click on + icon.
    • 2. Select Is Featured? from list.
    • 3. Set condition as Yes in secopnd option.
      NOTE : select New option from list if you want to dusplay list of new products.
  • Setp 9: Click on Insert widget button.
  • Setp 10: Save page and check your page.
Feature Products Widget
NOTE : Follow above process again to add new product.

page settings - image3

4. Once you done, click on Save Page.

Static blocks configuration

When you are done configuring the pages, you need to configure the static blocks.

1. In the top menu navigate to Content > Blocks.

static block - image1

2. Here you can find all the blocks.

List of default FreeGo home page static block name

  • Home banner Block
  • Home Advertisement 1
  • Home Advertisement 2
  • Home Blogs
  • Home Testimonials
  • Home Brands
  • Footer Our services
  • Footer Theme Features

static block - image2

3. To add a new static block click on "Add New block" button on static block list page. It will redirect to another page.

static block - image3

Click on Save Block button from upper right corner to save static block.

For change home page block image.

If you need to change below slider advertisment block.

static block - home static block edit image

Edit "Home Advertisement Block 1" and change image as you like.

static block - home static block edit image backend

NOTE : Process should be same for other static blocks other update.

Theme Settings

Open Magento admin panel and navigate to Theme Cpanel > Configuration.

theme cpanel

Layout Configuration

Select FreeGo theme layour for your webiste.

Layout configuration

Black(Dark) Layout


Black Layout

White(Light) Layout


White Layout

Header Configuration

Click on Header tab. From that you can set Top Header Notification, enable/disable Sharing addon with Pub ID of Addthis (you can get pub id from addthis.com) and add home page link in main menu section using Add Home link in navigation.

header configuration

  • Top Header Notification: Enter the text for top header notification section.
  • Show Sharing addon: Enable to show AddThis sharing addon in the home page.
  • Addthis Pub ID: Enter add this pub id (You can get pub id from Here).
  • Add Home link in navigation: Enable to show the home page link in the main menu list.

Product List Page Configuration

On product list page, admin can easily enable or disable Show New Label and Show Sale Label.

product list page configuration

  • Show New Label: Enable to show new product label in product list page.
  • Show Sale Label: Enable to show sale product label in product list page.

Product View Page Configuration

On product view page, admin can easily enable or disable sharing addons. From that, customer can share product on social media. Enable Related, Upsell & Crosssell products in product view page.

product configuration

  • Show Sharing addon: Enable to show add this sharing addon in product page.
  • Addthis Pub ID: Enter add this pub id (You can get pub id from Here).
  • Show Related, Upsell and Crosssell Products: Enable to display related, upsell and crosssell products in product page.

Contact Page Configuration

In Contact page tab, admin can show google map of his store by using Google map embeded code. Also set his store name, store address, contact info, store email etc on contact page.

contact configuration

  • Show Google Map: Enable to show google map in contact page.
  • Google Map Embeded Code: Enter your store's embeded code.
  • Store Name: Enter your store name.
  • Store Address: Enter your store address.
  • Contact No: Enter your store contact number.
  • Store Email: Enter your store email address.

How to add static blocks on homepage?

To show static blocks in homepage, add below code in cms homepage (Content > Pages > Home Page > Edit > Content Tab)

1. Show banner slider and advertisement block on home page.

{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="home_banner"}}

home static block 1


2. Show advertisements block on home page.

{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="home_advertisement1"}}

home static block 2


{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="home_advertisement2"}}

home static block 4


3. Show new products block on home page.

{{widget type="Magento\Catalog\Block\Product\Widget\NewWidget" display_type="new_products" show_pager="1" products_per_page="5" products_count="10" template="product/widget/new/content/new_grid.phtml" cache_lifetime="20" page_var_name="allproduct"}}

home static block 6


4. Show latest post on home page.

{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="home_blogs"}}

latest post


5. Show testimonials on home page.

{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="home_testimonials"}}

shop by brand


6. Show shop by brand slider on home page.

{{widget type="Magento\Cms\Block\Widget\Block" template="widget/static_block/default.phtml" block_id="home_brands"}}

shop by brand

How to replace demo images after import static blocks?

1. To replace images on static blocks in homepage, Go to (Content > Elements > Blocks).

static block page

2. Find static block id like "home_banner" from list and edit from action column.

Replace home page static block images

3. Now, scroll to text editor section.

4. Right click on image and select Image option from the popup box.

Replace image form static block Replace image form static block

5. Upload your desire image and save block setting.

Replace image from static block

6. Clear your magento cache from admin and check your home_banner block sectoin front side.

Scroll To Top


Sold Out Label
  • Enable: Yes | No
  • Display: Only Text | Only Image | Both Text and Image
  • Position: Left | Right
  • Text On Link: Set text for scroll to top
  • Background Color: Set background color for scroll to top
  • Background Hover Color: Set background hover color for scroll to top
  • Text Colour: Set text color for scroll to top
  • Text Hover Colour: Set text hover color for scroll to top
  • Image for Link: Upload scroll to top image
  • Image for Hover Link: Upload scroll to top image

Sold Out Lable


Sold Out Label
  • Enable Sold out label: Yes | No
  • Sold out label/image: Label | Image
  • Sold out Label Position: Top Left | Top Right | Middle Left | Middle Center | Middle Right | Bottom Left | Bottom Center | Bottom Right
  • Sold out Label Title: Set sold out label title

Conclusion

FreeGo is a fully responsive, creative, clean, beautiful and multipurpose Magento 2 theme with latest web design trends. It is multi-purpose professional theme for any ecommerce business like electronics, fashion, jewelery, furniture etc...

The following resources will help you to become a true Magento professional:

Useful resources

Help and Support