Knowband Blog | Ecommerce Modules

PrestaShop Smart One Page Checkout Addon -User Manual

Joe Parker

1.0 Introduction

Now make the overall process of checkout easy and faster by implementing one-page checkout. Knowband offers Prestashop Smart One Page Checkout Addon which replaces the default checkout process with one-page advance checkout. The online merchant can make the overall process easy and convenient for online users

The online buyers can view a one-page checkout popup at the same time when they click on the “Add to Cart” button. The Prestashop simplified checkout addon makes the checkout process very simple and effective for online users. There is no need to follow the lengthy process of checkout while shopping online. The store admin can enable testing mode before implementing it. Admin can set the look and feel of checkout buttons. By making the process of checkout simpler, the online merchant can increase sales and profit.

1.1 Features offered by PrestaShop Smart One Page Checkout Addon

2.0 Installation

First of all, purchase the Prestashop Smart One Page Checkout Addon and download the zip file from the Downloads section of your Knowband account.

You will get smartonepagecheckout.zip (source code of the module) and User Manual after downloading the zip file.

To install the module in the store follow the below-mentioned steps:

1) Unzip the smartonepagecheckout.zip file.

2) Copy the entire content, that is, the files and folders of the unzipped folder. Paste the same into the “Modules” folder of your store’s directory. Follow the below-mentioned address path – Root Directory/modules/.

3) The Prestashop simplified checkout addon is all set to be installed in the store. Go to the Store Admin and then to ‘Modules and Services’.

4) Now click on the “Install” button just next to your module. There will be a pop-up for your confirmation. Click on “Proceed with the installation” option. This step will install the Prestashop simplified checkout addon and show notification – “Module(s) installed successfully”.

5) Once the installation is complete, you will get access to the admin interface of the module by clicking on the “Configure” button.

3.0 Admin Settings

The online store admin can easily apply the settings from the admin interface and implement smart one page checkout functionality. These are the configuration options as shown below:

3.1 General Settings

In General settings, the online merchant can apply these settings as described below:

3.2 Customizer

In Customizer settings, admin can set the look and feel of smart one-page checkout button and also apply advance appearance settings as shown below:

3.3 Login

In login settings, admin can offer social login options to online users like Facebook and Google login options:

3.3.1 How to setup Facebook Login

For Generating Facebook App id and app secret follow these steps:-

Step 1: Click on this URL: https://developers.facebook.com/apps/

Step 2: Click on the “Add a New App” button.

Step 3&4: Enter your App name and email id, then click on the “Create App ID” button.

After completing the security check, you can successfully create app id.

Step 5: Now click on the “Setting” tab and select the Facebook login setup option.

After that click on the settings under the Facebook login option.

In the “Valid OAuth Redirect URL” option, enter the below-provided URL:

For example if your domain is https://www.example.com/ then enter the url:

https://www.example.com/index.php?fc=module&module=kbstepcheckout&controller=kbstepcheckout&login_type=fb

Save these changes.

Step 6: Now in the settings section, there will be two options available in the dropdown list, Basic and Advanced. You need to click on “Basic” settings and click on the “+Add Platform” button.

Step 7: Now select the website as your platform.

Step 8,9,10: In the basic settings enter these details:

In step 8, enter App Domain:www.example.com

For Step 9 use Site Url: https://www.example.com/
After that save the changes.

Step 11 and 12: Go to the dashboard and turn on the option for making the app public:

Step 13,14: Select the category and click on the Confirm button.

Step 15,16: Copy the App ID and App Secret from here:

Step 17, 18: Enter app id and app secret into the fields provided in the module.

3.3.2 How to setup Google Login

Follow the below steps to get a client id and client secret.

Step 1: Go to the link “ https://console.developers.google.com/project ”.

Step 2: Click on the “Create a project” option.

Step 3: Select the country and check on agree with terms and conditions. After that click on the continue button.

Step 4, 5: Enter your desired Project Name and click on the “Create” option.

Step 6,7 & 8: Go to API Manager, click on Create Credentials and select the OAuth client ID option.

Step 9: Click on the “Configure consent screen” button.

Step 10, 11: Enter “Email Id”,“Product Name” and then click on “Save” button.

Step 12,13 & 14,15: Select “Web application”, Enter “Name “, “Authorized Redirected URIs“ as mentioned below and click on “Create” Button.

Use Authorized javascript origins: https://www.example.com/
Use Authorized Redirect Url: https://www.example.com/index.php?fc=module&module=kbstepcheckout&controller=kbstepcheckout&login_type=google

Step 16, 17, 18: Copy Client ID and Client Secret.

Step 18, 19: Paste Client ID and Client Secret in the Text Field shown below:

3.4 Email Marketing

The online merchant can setup Klaviyo, MailChimp and Sendinblue email integrator sites and save email id details of subscribers. The store admin can save the user’s email ID details easily.

3.5 Addresses

In address settings, admin can configure auto address filling options as shown below:

Admin can also view field details of guest and registered customers:

Important points: 

3.6 Payment method

In the payment method section, admin can set payment method related conditions as shown below:

Admin can change the logo and title of available payment methods.

3.7 Delivery method

In this section of Prestashop Quick checkout addon, admin can apply delivery methods related settings:

Admin can change the logo and title of available payment methods.

3.8 Ship2pay

From here, admin can hide the payment methods for all the available shipping methods. Admin just needs to click on the payment method for showing or hiding it.

3.9 Custom Fields

Admin can also create custom fields as per the requirements. In the Custom fields section, admin can view the list of all the created custom fields. Admin can edit, delete and make new custom fields easily.

How to Create new Custom Fields: 

For adding a new custom field, the admin needs to click on the “+” button and enter these details as shown below:

Admin can click on the bin button for deleting the custom fields and click on the edit button for changing the custom field settings.

3.10 Cart

Admin can enable the “Display Cart” option for showing cart. Admin can select the fields which he wants to show to the guest and logged in customers.

Enter the Order Reference number or customer email id from the filter customer consent section.

3.12 GDPR Settings

Enabling Delete from Email Marketing Services on Request: Activate or deactivate the settings as per the requirements. By enabling the option, admin can delete customer details from email marketing services on their request.

Admin can view a list of policies and also add new GDPR policies, delete and edit any policy.

4.0 Front-end Interface

After a successful configuration, the admin can offer a simple and hassle-free checkout option. The online users will get smart one-page checkout popup as soon they click on “add to cart option”. Please check the below Screenshot for better details:

After that, online users need to click on “proceed to checkout” for further process.

Here, online users need to select a shipping address or add a new address.

After that, online users can select the shipping method and payment method. After that, they can confirm the order easily.

Online users can check the order summary from this page easily.