Posts

Quick guide to search, sort and filter products in prestashop mobile app

PrestaShop is based on open source platform for e-commerce which provides smooth shopping cart system with control over the look and functionality of the store. It is growing in the e-commerce market day by day. More traders are using this platform for their e-store. It provides various feature for an e-commerce store , you can check its features in our previous blog. With the increase in the e-commerce stores, mobile-commerce has also become popular these days. Mobile visits account for one-third of e-commerce sites traffic. To have an e-commerce mobile app for electronic commerce store is like putting a  retail outlet in the customer’s pocket . PrestaShop provides SEO, items management, and other tools which enforce traders to have the mobile app for superb shopping experience for customers.  In this blog, I am going to discuss some important features i.e searching , sorting and filtering implementation in the Prestashop mobile app.

Let me first start with the basics. PrestaShop system API is constructed by principle CRUD (Create, Read, Update, Delete). All methods are to be called through the /api/ gateway. Most methods can be accessed in a REST manner, with the 5 main HTTP request methods: HEAD, GET, POST, PUT, DELETE.

How to Search products in PrestaShop mobile app using REST API

search can only be accessed using GET and HEAD in PrestaShop API . Following the syntax for retrieving searched data or product :

      /api/method/?filter[parameter name to search]=[parameter value to search]

for example- let search a product by its name , then its request call will be like :

 /api/products/?display=full&filter[name]=[Blouse]

This call will return the product full details with the name “Blouse”. In the above syntax “parameter name to search” can be anything that products method has in its schema. You can search as many numbers of values at a time i.e :

 /api/products/?display=full&filter[name]=[Blouse, Shirt, Top]  .

 /api/customers/?display=full&filter[firstname]=[John]&filter[lastname]=[Parol] .

How to Sort products in PrestaShop mobile app using REST API

Following the syntax for retrieving searched data or product :

      /api/method/?sort=[sort by field with the suffix _ASC _DESC or in the order]

for example- let sort products by its name , then its request call will be like :

/api/products/?display=full&sort=[name_ASC]

This call will return the product in ascending order of ‘name’ with all details.

      /api/products/?display=full&sort=[price_DESC]

How to Filter products in PrestaShop mobile app using REST API

Following the syntax for filtering data or products :

      /api/method/?filter[field]=[value1|value2]

Above syntax  filter “field” with value between ‘value1 ” and “value2”

      /api/method/?filter[field]=[value1,value2...]

Above syntax  filter  field for values specified between brackets   

      /api/method/?filter[field]=[value]%

Above syntax  filter “columns” for values containing “value”

for example- let filter products by its ids then its request call will be like :
/api/products/?display=full&filter[id]=[1,10]  – This will list the products with id 1 to 10.

/api/products/?display=full&filter[id]=[1|5]  – This will list all the products between 1 to 5

/api/products/?display=full&filter[name]=[appl]%  – This will list all the products name starting with “Appl”.

NOTE: In the above all calls “display=full” means it will display all product details. You can display your product according to your choice. For example – “display=[birthday]” will display only the birthday.

Conclusion

As the implementation of PrestaShop framework is increasing day by day for the e-commerce stores , demand for mobile-commerce is also increasing with the same speed and popularity. So developing an e-commerce mobile app is becoming common and for any e-commerce store searching, sorting and filtering are very common and powerful property. Keeping these all things  in mind I wrote this article to help the new developer for PrestaShop. I hope this will help you… :-). Below is our sample app based on Prestashop REST API, you can refer it as an example which has shown the use of sort, search and filter APIs.

prestashopeePrestashopee
The PrestaShopee mobile app developed using native platforms that gels well with all mobile devices.It has used PrestaShop’s APIs for data. Further performance wise your app will be steadfast and hence customers are assured of a quick shopping experience.

References

Prestashop is a free open-source which provides the solution for e-commerce. For more information, you can visit the following link PrestaShop.

PrestaShop provides documentation for the list of all basic APIs that  are needed for the e-store.To get more details about the documentation you can visit this link PrestaShop Webservice

A quick guide to develop a PrestaShop mobile app.

We provide solutions to the client by building apps according to their requirements. We developed many apps on many different frameworks like SocialEngine, Magento, Woocommerce etc. Recently we got a new project from one of our clients. Their requirement was to develop an e-commerce app for their e-store which was on PrestaShop platform. Prestashop is a free open-source e-commerce solution. So the point was we have to build PrestaShop mobile app for their store using web-services.

As PrestaShop REST API was new for us and we knew that we would get problems during our implementation, but it would start at the first step was not expected 🙁 . We started the implementation and the first problem that we faced was how to build Prestashop mobile app. We can also say it as how to access Prestashop Webservice. Every time we hit the API , it gave “401 Unauthorized” and message “The server says welcome to Prestashop Webservice, please enter the authentication key as login. No password required”.
We did a lot of research, googled it, also found some solutions like – use the API key (The API key serves as the main identifier for the web service account you are creating) at the start of the URL

       http://[email protected]/

but every approach was fruitless. We tried every possible method to send the API Key with URL so that it can authorise the web service but nothing happened. The main confusing point was when we were hitting the URL directly on the browser by putting API Key at the start of URL it was working. Then after working several hours we found the solution. Before describing the solution I would like to list some essential points need to work on while accessing Prestashop Webservice :

Points to revisit before you start to build PrestaShop mobile app.

  1. Authentication key : This the most important key. Using this API key, the selected users will be able to access the web service. This key is provided by the server side. It is needed to send with the API.
  2. Permission for Resources : This is very important, as it enables the resources you want to make available to your user. These permissions are enabled from the server side.

To build Prestashop mobile app first you have to access its Webservice, so, you need to provide your authentication key or API key when request. No password is required only API key is enough for accessing the API. Now here, the problem is how to pass this API key with your request because if you will not provide this key it will not allow you to access Prestashop Webservice. The solution is while accessing the API from the mobile you need to pass this key in the header as BASIC AUTH.

When we add API Key with URL, Browsers are intelligent enough to understand it as username but the mobile web-services are not. So we need to pass it by building BASIC AUTH. We pass API Key as username and leave password blank as shown in below example:

     Request request = chain.request();
     String credential = Credentials.basic(Constants.API_KEY, "");
     request = request.newBuilder().header("Authorization", credential).build();

Conclusion

The above-explained solution can help many developers to start PrestaShop mobile app with its web-services. Giant eCommerce companies are now focusing on improving end-user experience on mobile devices. They are providing a strong technology infrastructure via cutting-edge mobile applications. Prestashop is one of the popular eCommerce open-source platforms and it has taken an important place in the eCommerce market for developing e-store. Using Prestashop API for e-store can be proved to be an intelligent option.You can also browse other apps already developed with Prestashop Webservices for example- PrestaShopee ,Prestashop mobile. If you need any help and assistance regarding app, website etc. development feel free to contact us.

References

Prestashop is a free open-source which provides the solution for e-commerce. For more information, you can visit the following link PrestaShop.

PrestaShop provides documentation for the list of all basic APIs that  are needed for the e-store.To get more details about the documentation you can visit this link PrestaShop Webservice