Magetop One Step Checkout Extension Guide

Magetop One Step Checkout Extension Guide will give you solid understanding of how to use Extension. These Magento 2 tutorials cover back-end and front-end development.

I. Introduction

Magetop One Step Checkout Extension

Magento 2 One Step Checkout and Layouts will allow users to complete the checkout process without spending time moving to a separate page for payment. Above all it compliments all the features of cart page into checkout page like user can change quantity and remove products at same page using ajax.

Highlight features:

  • Complete checkout steps on one page.
  • Responsive design, optimized for PC, laptop, mobile or tablet.
  • Billing & Shipping Details, Shipping & Payment Section.
  • Allows/Supports Gift Wrap, Gift Message, Comments and Delivery Time.
  • Order review and change quantity section.
  • Coupon apply & Place order.

II. How to use

Perform check out in just one page.

Check out in just one page

Log in, register right on the checkout page via pop-up dialog when click “Already have an account? Click here to login”.

Log in, register on the checkout page

Customers can also tick “Create account” to create an account with the information provided on the checkout page.

Tick Create account to create an account

Customers must fill out the required fields for the place order to take place (which fields mark a red *).

Must fill out the required fields

In the Order Summary section, customers can adjust the number of items with +/- button.

Adjust the number of items with + and - button

For items with options, customers can edit them on the checkout page.

Edit items on the checkout page
Edit item pop-up

Customer can gift included with a message with the purchased item.

Gift with the purchased item
Gift Message Item Pop-up

III. How to configure

III.1. Configuration

Go to STORES -> Settings -> Configuration -> MAGETOP.COM -> One Step Checkout Setting.

Go to Configuration
Expand MAGETOP One Step Checkout Setting
III.1.1 General Configuration
General Configuration
  • Enable One Step Checkout: Select “Yes” to enable the One Page Checkout module.
  • One Step Checkout Page Title: Enter the title of Checkout Page.
  • One Step Checkout Description: Enter the description for the page. Admin can add HTML to the text area.
  • Default Shipping Method: Select shipping method to set default shipping method in the checkout process.
  • Default Payment Method: Select payment method to set default payment method in the checkout process.
  • Allow Guest Checkout:
    • Yes: Allow check out as a guest.
    • No (require create account): Guest must enter the password to create an account at checkout.
    • No (require login): Guest must log in before checkout.
  • Auto-redirect to One Step Checkout Page: Select “Yes” to enable redirecting to the Checkout Page after a product’s added to cart.
  • Show Billing Address:
    • Yes: Allow the Billing Address block to appear in the Checkout Page.
    • No: The Billing Address and Shipping Address are the same.
  • Use Auto Suggestion Technology:
    • Google: Use it for automatic address suggestions. Enter your Google API Key to Google Api Key field below.
    • No: Disable this feature.
  • Restrict the auto suggestion for a specific country: Select the country which admin restricts auto suggestion.
  • Enable GeoIP: Select “Yes” to enable GeoIP.
  • Route: Enter the route for Checkout Page. Leave empty to use the default URL route. Default: onestepcheckout. The route will be: https://your-domain/onestepcheckout.
III.1.2 Display Configuration
Display Configuration
  • Show Login Link: Select “Yes” to show an “Already have an account? Click here to login” link for visitors to log in.
  • Show/Hide Footer/Header: Select “Yes” to Show/Hide both Footer/Header at the same time. Should clear cache after making change.
  • Show Discount Code Section: Select “Yes” to show the Discount Code section.
  • Show Order Comment: Select “Yes” to show the Order Comment.
  • Enable Gift Messages on order: Select “Yes” to allow leaving messages on the whole order.
  • Enable Gift Messages on item: Select “Yes” to allow leaving messages on each item.
  • Show Terms and Conditions: Select “No” to hide Terms and Conditions, or select an area to display it.
  • Enable Social Login On Checkout Page: Select “Yes” to allow customers to login via their social network accounts. Supports Magetop Social Login.

Review Cart Section

Review Cart Section
  • Show Order Review Section: Select “No” to remove the Order Review section. The section is displayed by default.
  • Show Product List Toggle: Select “Yes” to show product list toggle.
  • Show Product Thumbnail Image: Select “Yes” to show the product thumbnail image.

Gift Wrap

Gift Wrap
  • Enable Gift Wrap: Select “Yes” to enable Gift Wrap.
  • Calculate Method: To calculate gift wrap fee based on item or order.
  • Amount: Enter the amount of gift wrap fee.


  • Show Newsletter Checkbox: Select “Yes” to show the Newsletter checkbox.
  • Checked Newsletter by default: Select “Yes” to have the Newsletter checkbox ticked by default.


  • Enable Survey: Select “Yes” to show a survey after successful checkout.
  • Survey Question: Enter the survey question.
  • Survey Answers: Add new an answer to the form.
  • Allow Customer Add Other Option: Select “Yes” to allow customer add other answers.

Seal block

Seal block
  • Enable Seal Block: This seal will be displayed under Place Order button.
  • Upload Image: Upload an image.
  • Seal Description: Enter description for the seal. HTML allowed.

Static CMS Block

Static CMS Block
  • Enable Static CMS Block: Select “Yes” to enable Static CMS Block.
III.1.3 Design Configuration
Design Configuration
  • Checkout Page Layout: Select the layout used for the Checkout Page.
  • Design Style: Select the design style for the Checkout Page.
  • Radio Button Style: Select the radio button style.
  • CheckBox Button Style: Select the checkbox button style.
  • Material Color: Change color icon heading, border input text, radio,checkbox buttons.
  • Place Order button color: Enter hex color code for Place Order button.
  • Custom CSS: Enter your customer stylesheet.
III.1.4 Custom Fields Configuration
Custom Fields Configuration
  • Custom Field 1 Label: Enter the label of input text field.
  • Custom Field 2 Label: Enter the label of input text field.
  • Custom Field 3 Label: Enter the label of date picker field

When complete, click Save Config button.

Click Save Config button

IV. Conclude

Above is our guide for Magetop One Step Checkout Extension. If you have any questions please boldly contact us. We will help you. Thanks for reading.

It comes to the end of the blog: Magetop One Step Checkout Extension Guide.

You can read more useful posts like Magetop Delivery Date Extension Guide.

Follow us for the more helpful posts!

We hope this is a useful series for you.

Thank you for reading!

4.8 4 votes
Article Rating

Aaron LX

Aaron is a passionate writer, crazy about shopping, eCommerce and trends. Besides his outstanding research skills and a positive mind, Aaron eagerly shares his experience with the readers.

Leave a Reply or put your Question here

Inline Feedbacks
View all comments
Would love your thoughts, please comment.x