A DIY Approach to Maintaining a Magento Store: Marketing and Branding Tips

Right, you’re thinking of starting an e-commerce store. You are tech savvy and familiar with most eCommerce stores, but somehow you’re at a loss as to how you can set up your store. Today’s post is aimed at teaching you guys how to launch your eCommerce store on Magento.

Sure, the first step is to hire a good web developer or consult a reputable Magento development company like Towering Media to handle your Magento services.

If you’re in a tight budget and outsourcing the task will cause a massive dent in your finances, there are several alternatives to consider when launching your Magento-powered e-commerce store.

It’s acceptable if you don’t have the funds to outsource at the beginning of your project, and all you need to start is a practical idea to sell products online.

When you have proved that you can get a few products sold, we recommend you ditch the DIY approach and hire a good Magento services company. Below, we focus on the options available to you for a DIY approach to running your personal Magento store.

Although there are different e-commerce platforms on the market, we recommend Magento as it provides all the necessary functionalities at your beck and call. Besides, it is the most popular eCommerce platform worldwide, which infers that there is an abundance of resources available to store owners. It is a perfect choice!

Magento Hosting

The first thing to consider is the version of Magento you want to operate on and how your store will be hosted. There are two versions:

  • Magento Community Edition
  • Magento Enterprise Edition

For this article, we will focus on Magento Community Edition, also known as Magento Open Source.

We expect you to choose Magento OS when operating your store at the start. To make operation easier, ensure you find a host that will pre-install Magento on your server. If you’re not tech savvy, installing Magento 2 can be very tricky.

Or you can jump all these steps and outsource your Magento needs to one of the best Magento development companies in the US.

Okay, store owner. Let us proceed.

It is smart to pick a hosting company that has leading experience with Magento development. This means you can get limited technical support whenever you experience issues with your website.

Our top 2 picks for best Magento expert hosting companies are:

  • Towering Media
  • Nexcess

Magento Web Design

what am I gonna do about the design? I’m probably gonna need an designer to stand out when I launch my store”…. Or not?

Magento contains thousands of themes that are pre-installed, which you can apply straight to your Magento store. While others are free, many of these professional themes can be purchased for a fee ranging from $50 – $200.

You need to change the logo, and if you, perhaps, hire someone to create a logo, chances are the hire will charge 10x the cost off purchasing “off the shelf.”

NB: The way a theme appears on a computer screen will be different from a mobile screen. In this new era, most of your customers online visit your store through mobile browsers. Hence it is crucial that you choose the correct designs.

On the Magento store, look out for designs/themes that are termed “Responsive.” These themes fit both web and mobile devices and can alter their appearance depending on the screen size.

Setting Up A Catalog

Now that you’ve got your store up and running, what is the next step? Get the basics covered when you contact us where we can send you a free sample training material and free tips on how to maintain your Magento store.

These tips will help you through the first steps of setting up your products and many more. Setting up a catalog requires you to get the attributes correct for your products. By reaching out to us, we can help you set up the product attributes correctly for maximum exposure and sales.

Magento Payment Integration

Collecting payment in your store is an essential part of doing business. PayPal is pre-installed from the go so if you’ve got a PayPal account, you can start receiving orders from customers. There are PayPal options available in the configuration menu to suit your preferences.

Other popular methods of payments include SagePay and co.

Magento Transactional Emails

The last box to tick for a basic Magento store set up is the transactional emails. These are messages that notify you when a customer places an order, requests passwords, and other general issues. Magento has these email notifications pre-installed, but we advise you to make some minor changes to suit your schedule.

Simply go to System > Transactions Emails > Options.

Ready For Launch?

Marketing and Branding Tips To Boost Your Magento Store

So, you’ve got a product catalog –, and a means for customers to pay for their orders. Still, there is a lot of work to do in terms of personalizing your store, but you can do this after launch.

The next step is marketing and promoting your brand. There are many options to choose from, namely:

  • Search Engine Optimization
  • Email Marketing
  • PPC [Google AdWords]
  • PR
  • Social Media
  • Promotions and Discounts

Any of the following ways can increase traffic to your site and triple your leads.

Monitor, Refine, and Test Your Magento Store

Purchasing a good analytics tool like Google Analytics is a must for any Magento store. Understanding the statistics behind your store will help you make the right changes where required. So, sign up to Google Analytics.

Start checking your analytics and track the source of your traffic. You can pinpoint which of your marketing strategies – SEO, AdWords, Email Marketing – contributed the most to your success, and how much you spent on each.

All this information and more is available via analytics tools. Whenever you make any change to your store, you can use the tool to check if your sakes decrease or increase. Hard data is the best way to know which decisions affect your store sales.

Installing New Features

As you understand how your store works better, it is essential to add new and exciting features to your store. Many things can boost your store like:

  • Starting a customer loyalty program
  • Installing an online/offline stick management system
  • Linking your store straight to an email marketing system

These extensions. Are available in Magento and can be downloaded with the right knowledge or with the help of a Magento developer. Search for “Extensions” and choose the one you want.

Also, we understand this can be tricky, and you don’t want to buy the wrong extension or purchase an extension that requires expert knowledge to install. This is why, during your journey, you need an ally for the tasks that are beyond your skill level.

Partner with Towering Media at the start of your eCommerce journey, and you can expect your store to start flying high among its competitors!

What Magento Developers Have To Say About Its Product Handling Capacity!

While you set up your business online, it is mandatory to have the appropriate eCommerce platform by your side. However, this task is hard, but once you are sure what facilitations you can make the right selections. But, we are here talking about the top-rated and highly recommended systems for eCommerce- Magento. For instance- This platform offers the most competitive and versatile content management for your website. Other than this offering, Magento can provide you the best SEO, customize security, saves time & money and the list goes on. Such alluring benefits are enough to get the services of Magento developer for your site, isn’t it?

However, the capacity of Magento is the common concern for the implementation of B2B system. Merchants usually seek the platforms that provide them with a large product catalog. So, for that one needs to be sure what Magento is capable of! This answer varies as per the version of the Magento choose by the user. Likewise- Magento 2 is curated in a way to handle more than 500,000 or as per the requirement (vary as per the server, set up as well as the software).

As per the Magento developers, the variation in the product handling of Magento is because of- count of the product attributes, the depth of the category tree, shops & languages of Magento, etc. Various versions are different in terms of catalogs. For instance- In Magento CE 1.x including 1.9.x, indexing is not optimized for huge catalogs, and there is unavailability of the full page cache. Thus, it is vital to consider the right version as per the requirement of your work.

How Magento developers, scale the range of this eCommerce platform?

The huge catalog will need more resources for the perfection in the case of hosting. A capable server sized approperatly, with a good cache system like light speed web server is essential.

All in all, if the most up to date version is selected as per the advice of pro-Magento Developer, one can make the most of this effective platform.

Picking the Optimum Magento Theme- A Brief Overview

Are you striving to pick the right Magento theme for your upcoming e-venture? Well, in that particular case, you have landed at the right place!

Magento is one of the most preferred e-commerce platforms that have tremendously altered the way people used to trade online. With advanced features like easy checkout, payment and shipping tracking, analytics, Magento is undeniable the top-notch framework for almost every business.

When it comes to choosing the best theme for your e-commerce platform, most of the Magento Developers recommend emphasizing numerous aspects. Here we would be sharing detailed information regarding these aspects that shouldn’t be missed while you are beginning the hunt for the finest Magento theme.

Pick the one that is Technologically Advance

It would be great to rely on a theme that is based on development and designing technologies like Bootstrap 3, CSS3, HTML5, and SASS. The compatibility of your website developed using Magento framework entirely depends on the precise use of HTML5 and CSS3.

There are plenty of themes out there that are responsive enough to adjust for any screen size and eventually, you can customize the same as per your needs. So, next time you are searching for a theme, make sure it is developed using the above-mentioned technologies.

Cross-Browser Compatibility

There is no hard and fast rule that your visitors would be using Google Chrome or Mozilla Firefox; make sure your Magento theme is compatible with every browser! Most of the paid Magento themes offer cross-browser compatibility; you need to check the same before you randomly pick any of the themes.

As per the renowned Magento Developers, there are several free tools available in the market that can lend a hand in checking the cross-browser compatibility of a Magento theme before you finalize the one for your e-trading platform.

Upgrades and Support

One of the crucial things you need to check regarding a theme is whether you would be getting the regular updates or what the update support period is. After the support period you may have to repurchase the theme for future major version changes. Also to keep in mind If you make alterations to the theme you may need to re-apply those changes after updating to the latest version. Generally though you don’t have to update your theme unless some really major changes have come out.

We at Toweringmedia.com make custom themes from scratch or can help you alter your purchased theme. Personally I like to get templates from Template Monster if in the case of needing to keep a project cost down.

These are some simple ways that can ensure that you choose a reliable theme for your e-commerce platform built in Magento.

Magento 2 CLI composer not working

Logged into your magento 2 install via Putty, trying to type in command but nothing happens it just goes to the next line. Of course you ran file perms reset script and it is still not working.

Open up the file bin/magento in your file editor and add the following line and upload it.

1
ini_set('display_errors', 1);  // allow PHP errors reporting

You will now see the errors that are causing the problems!

Woocommerce Vs Magento: What’s the Difference?

The main difference between Magento and Woocommerce is that Magento is a purpose-built store designed for ecommerce where as woocommerce is a plugin for wordpress a blogging program. Woocommerce can be a great low cost alternative to get a store started. Our recommendation is that once a store is up, running, and profitable, to then switch to Magento. Starting with Magento your going to need some budget to higher professional magento devleoeprs for support.  Your going to find that woocommerce is cheaper all around. Hosting, support, templates, plugins, upkeep, etc. Magento is more expensive but offers a better shopping experience to the customer. It allows you to tag items with attributes so you can filter by results. Think of being on amazon and using the filters on the left. Only a good platform like Magento is going to be able to offer these filters in this way. There will be some filterability on woocommerce just not to the level that Magento can offer.

The bottom line is if your budget is say less then a few thousand per year then stick with woocommerce. If you have a decent annually budget for your store then Magento is the right choice.

We are woocommerce, and Magento consultants please give us a call to discuss what is the best platform of choice for you. We will go over budget, and what you need as far as functionality.

 

From the past few years, considerable growth has been discovered in e-commerce sector. A large number of players are viewed to explore business opportunities in this field. For starting an e-commerce business, selecting the correct platform might be a decisive factor. Why so? It’s because this will result in ultimate success or failure. It won’t be an easy task to end up with two e-commerce solutions, i.e. Magento and Woocommerce. It can be said that these options are perfect for your online business.

Here, in this post, you will have a light on these popular platforms.

Magento as well as Woocommerce are highly popular and equipped with the basic factors which might make your online store functional. Incorporation of Google analytics in order to keep a track of the behavior of customers on site, support customization, and several different features that suit their business needs.

Outline

Woocommerce can be installed with ease with the assistance of the WordPress plugin. It’s best served with any CMS (Content Management System). On the other hand, Magento is a dedicated e-commerce platform with advanced characteristics designed to execute business functions.

Distinctive Characteristics

In case this is your startup, then woocommerce is perfect for your site. You can give a rating to your products, publish the best seller, and many more. If you want more characteristics, then you can have them by means of plugins. These are good for this platform.

On the other side, Magento has the ability to handle all the wants of an emerging business. You can function them more from one account, handle a large number of products, also execute up-selling and cross-selling of your products. In addition, you can add discount codes and let your customers compare products and execute an advanced search.

Affordable

As an open source, both are freely customizable and available. However, when a business expands, they incur cost and you want added functionalities for supporting the increasing needs of business.  Since Woocommerce is based on WordPress, it enables lower costs and easy extension of functionalities. Though Magento community version if free, but its enterprise version is costly. Hence, before making the selection of platform of your online store, you must know about your business objectives. Therefore, it’s advisable to seek the services of expert Magento Developers.

Handled with Ease

In case you prefer WordPress, then initiate with woocommerce. Then, customize your website to the full within a minimum amount of time. On the other side, Magento requires a little expertise to give details of benefits and characteristics. It consumes time in setting up and customization as well.

Search Engine Optimization

If you take into account the weight, then Woocommerce seems to be SEO-friendly. It’s because it is a lower server load than Magento. However, there are different factors such as the title of a page, Meta description, independent control of URLs, and many more that enables a website to become search engine friendly.

As if now, you have a clear idea regarding these two e-commerce platforms, it’s the right time to do a reality check for your business. With this, you will discover which one is appropriate for your business. For any kind of help, you can get in touch with e-commerce specialists for an effective solution.

Magento 2 cron job pending jobs never cleared SOLVED!

For several weeks I have been battling an issue with the Magento 2 platform completely freezing on the front end and the backend once in a while. I would go in and restart the MYSQL service and the site would start working again for about a day sometimes just an hour. After digging into this I found that the cron jobs were being created 20 times but only the first time was completing leaving the rest in pending status. See screen shot.

 

After making the following changes you can see that they are now completing! Set use separate process to “no”.

 

Then Set the cron jobs to run as the following. At least this worked for me.

 

 

 

Please comment down below then send us a comment on our contact form so I can approve it.

 

Magento Authorize.net End MD5 Hash Direct Post

As per the article published on Authorize.Net, this is what we found.

In short. Yes they are ending direct post or DPM method and you need to take action now. You can no longer create md5 hash keys, your payment gateway will be cut off around may.

Magento 1 there are two options which is suggested by Magento Developers. the Direct Post and just simply authorize.net  If your using the direct post method this will no longer work change that to use the authorize.net method.

Magento 2 I am assuming the next release of magento 2 will include this authorize.net extension but until it is included you can install this from the marketplace.

https://marketplace.magento.com/authorizenet-magento-module-authorizenet.html

Or you can find another extension available like the CIM method that allows you to store CC on authorize.net servers for future use so that your customers dont have to type their CC info in over again for every order.

Our magento developers can install this updated extension for you or recommend a good replacement like the CIM extensions that are available.

Full article 

Authorize.Net ending the use of MD5 based hash for transaction response verification to encourage the use of SHA-512 based hash utilizing a Signature Key.

MD5 Hash end of life will be done in the following two phases:

Phase 1: This phase started in later January to early February 2019. They removed the ability to update or configure the MD5 Hash setting in the Merchant Interface. But the existing API response will see no changes.

Phase 2: You don’t have to send the value for the MD5 Hash data element in the API response because the field will still be there but without any value. For this change, the date is expected to be announced in the next 2-3 months.

The transaction response that you will receive from Authorize.Net includes the SHA2 hash element and the name and position depend on the API integration method you have used. For the transaction, Authorize.Net has generated SHA2 that has field contains HMAC-SHA512 hash. You can use it to validate the response from Authorize.Net. However, it is not required to.

In the API response, transHashSHA2 is the SHA2 element for Authorize.Net API (XML, JSON, SOAP).

You can find the SHA2 element at the end of the API response for Advance Integration Method (AIM). However, the updates are in progress for the same.

Only 3 fields are involved in the SHA2 Hash for Authorize.Net API and AIM. They are:

  • API Login ID
  • Transaction ID
  • Amount

x_SHA2_Hash is the SHA2 element for Server Integration Method (SIM) and if you want to utilize Replay Response. For this too, updates are in progress.

There are 30 fields involved in the SHA2 Hash for SIM + Relay Response and Silent Post. They are:

  • x_trans_id
  • x_test_request
  • x_response_code
  • x_auth_code
  • x_cvv2_resp_code
  • x_cavv_response
  • x_avs_code
  • x_method
  • x_account_number
  • x_amount
  • x_company
  • x_first_name
  • x_last_name
  • x_address
  • x_city
  • x_state
  • x_zip
  • x_country
  • x_phone
  • x_fax
  • x_email
  • x_ship_to_company
  • x_ship_to_first_name
  • x_ship_to_last_name
  • x_ship_to_address
  • x_ship_to_city
  • x_ship_to_state
  • x_ship_to_zip
  • x_ship_to_country
  • x_invoice_num

A Comprehensive Guide To Configure Magento 2 Google Tag Manager Extension

There is a common myth that if you have a Magento 2 website, then you can simply conquer the market but that way too different in the real world. The success of Magento 2 ecommerce store depends on the selection of right tool.

Let me go deeper in this concept.

According to Magento Developers; there are ample of well recognized  companies and services who provide bundle that includes market-recognized tools. The combination of these tools can really be the X-factor for your ecommerce store website.

Google is too one of the recognized company that offers a bundle of tools that ensures that you can accurately track and monitor your ecommerce business performance indicators.

This bundle allows the user to monitor all the Google extensions associated with your ecommerce website which includes Google Analytics, Google Adwords, and Keyword Planner. The bundle is more off like an extension which is known as “Magento 2 Google Tag Manager extension”.

If you are too a marketer, then you want this extension as it will help you in easily track your site conversions, remarketing, analytics, and related functions. These insights will help you stay on-track from the initial days of your business till your glory.

Few Features To Ponder

The first question you might have may be where to find Magento 2 Google Tag Manager Extension. Visit WeltPixel and download Magento 2 GTM extension there. Features that it offers are as follows:

  • It will help you track your cross-sell & upsell products. It also make it easy for you to track product impression and clicks.
  • You can even number of times a particular product was added or removed from the cart.
  • How many times a product was added in the favourites or wishlist.
  • Easy to track how many times a specific product was reviewed or compared.
  • Keep tabs on the entire website’s checkout process which includes billing to shipping steps.

 

The second question which might be baffling you is how you can Install Magento 2 Google Tag Manager Extension. That is the base on which this entire post was ideated. Let’s dive deep into the steps. Here we go,

Installing Magento GTM Extension

The installation is as simple as installing any other Magento 2 extension. All you need to do is follow these simple standard steps,

  • Go to the official website (In this case, go to the above mentioned website). Simply download the .zip file.
  • Unzip the Google GTM Extension on any folder of your desire.
  • Simply transfer the folder to app/code folder.
  • Access the root folder of your Magento 2 store. You can access the folder through command line. Once you access that, type the following code and run it

php bin/magento module:enable WeltPixel_Backend –clear-static-content
php bin/magento module:enable WeltPixel_GoogleTagManager –clear-static-content
php bin/magento setup:upgrade

  • Once you run those codes, remember to flush the caches on the server and Magento.

php -d memory_limit=-1 bin/magento cache:flush

With these steps you can easily install Magento 2 Google Tag Manager Extension in your Magento store.

Let’s dive further deep into the configuration of Magento 2 GTM Extension.

Configuring Magento 2 GTM Extension

  • First, you need to activate Google Tag Manager. Go to WeltPIXEL > Enhanced ecommerce GTM Settings > Google Analytics Enhanced Ecommerce. Enable the Google Tag Manager by clicking yes there.
  • One thing you need to keep in mind before you install Magento 2 GTM Extension, you need to have Javascript code & a non-Javascript code. You can get these codes from Google Tag Manager. paste these codes in your Google Tag Manager Non-Js Code & Magento 2 Google Tag Manager Javascript Code.
  • In Impression Chunks Size option, mention the number of data you will see for your impression report. For smooth performance, it is recommended that you keep the size at 15.
  • With the help of Product Identifier, you can easily recognize your product in Google Analytics & Google Tag Manager with help of SKU or Product ID.
  • Now mention the right Brand Attribute to track brand on Google Analytics.
  • Choose Grand Total or Subtotal in the option “Order Success Page Total Calculation”.
  • You can click “Yes” in the option “Measure Product Clicks” to track product click in different category pages of your Magento store by the help of our Magento Developers.

Over To You

These steps mentioned above are unavoidable and are mandatory to set for proper tracking in your Magento ecommerce development store. With the use of Magento 2 Google Tag Manager Extension, you can avoid the confusing use of multiple extensions. You will see some promising growth and increase in your Magento store productivity. It is a must-have extension for your ecommerce store. Don’t miss the power of Magento 2 GTM Extension.

What you think about the post? Did I miss something? Why don’t you leave a comment and let me know what I miss. Let’s have a healthy discussion. Till the, Adios fellas!!!

Development Environment for Magento 2 using Docker

If you know about PHP then you must be familiar with the issues that frequently bug you while working with Magento 2. Whether you developing with Apache Tomcat running PHP or you went on the whole path from xampp to vagrant, deep down your soul of Magento Expert you know, the development process in Magento 2 was not easy with PHP.

And then came the Docker and the development in Magento with PHP become bliss. So, what a docker is? There is a possibility that, mere words can’t explain what a docker is even by a seasoned Magento Ecommerce Web Development . Still, let me try,

“The docker performs operating system level containerization (virtualization) which is similar to the operating system feature where the kernel allows multiple isolated userspace instances”

You might be wondering how  difficult it is just to understand with mere words. If words can’t comprehend for you, you can go for this link to understand more.

Now let’s move forward and see what are the things you can do with docker in Magento 2 development environment. So, without any further ado, let’s get you started.

The Capable Setup for Running Magento 2 via Docker

For a perfect illustration, let’s consider that you run magento 2 on http://m2.docker

Add the following line somewhere in your /etc/hosts file:

127.0.0.1 m2.docker www.m2.docker

Now, for further steps, you need a file structure setup. Do as follows,

tomas ~ $ mkdir m2.docker
tomas ~ $ cd m2.docker/
tomas ~/m2.docker $ mkdir docker
tomas ~/m2.docker $ mkdir html
tomas ~/m2.docker $ mkdir -p docker/db
tomas ~/m2.docker $ touch docker/xdebug.ini
tomas ~/m2.docker $ touch docker/apache.conf
tomas ~/m2.docker $ touch docker-compose.yml
tomas ~/m2.docker $ touch .env

Some Important File Extension for you to understand

.env

In this particular file, you can write variables which you can use in docker-compose.yml.

Some variables for you,

CONTAINER_PREFIX=m2docker
SERVER_NAME=m2.docker
SERVER_ALIAS=www.m2.docker
DIRECTORY_NAME=m2.docker
WEB_USER=inchoo
WEB_ROOT = /var/www/html
MYSQL_DB_HOST = ${CONTAINER_PREFIX}_db_1
MYSQL_DATABASE=inchoo
MYSQL_ROOT_USERNAME=root
MYSQL_ROOT_PASSWORD=inchoo
MYSQL_USER=inchoo
MYSQL_PASSWORD=inchoo
DOCKER_EXEC=docker exec
DOCKER_EXEC_INTERACTIVE=docker exec -i
DOCKER_EXEC_TTY=${DOCKER_EXEC_INTERACTIVE} -t

xdebug.ini

The components in this file will be like this,

zend_extension=xdebug.so
xdebug.remote_autostart=0
xdebug.remote_enable=1
xdebug.remote_port=9000
xdebug.remote_connect_back=1

apache.conf

The example variables in this file will be like this,

ServerAdmin webmaster@m2-sample.docker
    ServerName m2.docker
    Serveralias www.m2.docker
 
    DocumentRoot /var/www/html/pub
 
        Options FollowSymLinks
        AllowOverride None
 
        Options Indexes FollowSymLinks MultiViews
        AllowOverride All
        Require all granted
 
        SetHandler “proxy:unix:/run/php/php-fpm.sock|fcgi://localhost/”
 
    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined

 

Running The Development Environment for Magento 2 Be Like

So, with all the aforementioned files, the development environment will be ready. When you run it you will get results similar to these codes,

tomas ~/m2.docker $ docker-compose up -d
Creating network “m2docker_default” with the default driver
Creating m2docker_apache-php_1 … done
Creating m2docker_redis_1      … done
Creating m2docker_phpmyadmin_1 … done
Creating m2docker_db_1         … done
tomas ~/m2.docker $ docker ps

CONTAINER ID IMAGE COMMAND CREATED STATUS IMAGE NAMES
e3384b0eff8c mysql:5.7 “docker-entrypoint.s…” 3 seconds ago Up 2 seconds 3306/tcp m2docker_db_1
d283bf018330 phpmyadmin/phpmyadmin “/run.sh phpmyadmin” 3 seconds ago Up 2 seconds 9000/tcp, 0.0.0.0:8080->80/tcp m2docker_phpmyadmin_1
ded8bce1d993 redis:latest “docker-entrypoint.s…” 3 seconds ago Up 2 seconds 6379/tcp m2docker_redis_1
fe8a80763ac6 udovicic/echo:apache-php7.1 “/start.sh” 3 seconds ago Up 2 seconds 0.0.0.0:80->80/tcp, 9000/tcp m2docker_apache-php_1

tomas ~/m2.docker $

Closing Words

So, what are your thoughts on this either as a Magento Expert or a business owner? Let me know via comments and I will get back to you as soon as possible via comments. Adios for now mate!!!

 

An Overview on Magento Progressive Web App Studio You Shouldn’t Miss

Remember the Reacticon Conference back in March 2018? Magento announces its latest upgrade, the Magento PWA Studio: The set of tools which will let you play with the react components. The early development release just give you the glimpse of how you can use Magento PWA Studio in general.

So, if you are one of those, who want to play along with the PWA studio then you are in the right place. Here in this post, we will give you a quick rundown of all the features and competencies of Magento PWA Studio which you can leverage for your business in the coming future.

Why?

Because mobile application is the future of every business and sooner or later you have to accept it. So, start now and know how you can use Magento PWA studio: A react-based theme developer to bolster your ecommerce business. So, without any further ado, let’s get you started.

How Routing in PWA Studio Works?

Let me be honest, routing with react can be a daunting task and if you are working on adapting it with Magento 2 with the help of Magento Developer, then you need to be extra cautious.

Lucky for you, Magento PWA Studio comes with inbuilt solution for handling routing for react via flexible Magento 2 URLs.

That component is none other than MagentoRouter . It act as a wrapper for React Router and is spawned with the functionality of route handling. You can find the path of MagentoRouter here,

packages/peregrine/src/Router/Router.js

Three type of page URLs are currently supported by MagentoRouter,

  • CMS Pages
  • Category Pages
  • Product Pages

This is how routing with Magento PWA studio works (Step-by Step Methodology)

  1. The MagentoRouter simply passes the URL to the component named as Magento RouteHandler.
  2. Once successfully passed to Magento RouteHandler, it simply ask query to Magento 2 with the help of GraphQl to resolve the route and get the page type in return from the query. As mentioned above, the page types are CMS_PAGE, PRODUCT, and CATEGORY.
  3. If the URL doesn’t exist there, then the Magento 2 will simply shows a 404 error. If the page exist, then the MagentoRouter will simply render a RootComponent which will be later assigned to the received type of of page.

Winding It Up

See, it is not that difficult. However, I want to mention that it will be a little difficult when you need to specify a Root Component for a specific page type. Take an example for specifying root component for CMS_Page. You need to create a index.js entry point file with the following code,

/**
 * @RootComponent
 * description = ‘Basic CMS Page’
 * pageTypes = CMS_PAGE
 */
 
export { default } from ‘./path/to/cms/main/component;

Once you do that, it will become easy for you to specify root components for the particular pages.

It will be very interesting to see how Magento PWA Studio will perform with other Magento 2 functions such as the layout updates in which Magento Expert can help. Well, that’s the story for another tale then. Thanks for reading this article. Feel free to contact me via comments. I will get back to you as soon as possible. Adios for now.