Admin Configuration

The 3SC is built upon 6 sub modules which are all included in the package.

✅ 3 Step Checkout
✅ 3 Step Checkout Augments
✅ 3 Step Checkout Paypal
✅ 3 Step Checkout Amazon Payment
✅ Enhanced Tax Display
✅ Order Comment

You can find these settings under Shop → Configuration → Unified Arts

General 3SC Settings

The 3SC is divided into the following categories:

General

Here you will find the setting for activating / deactivating the 3SC extension.

Wording

In this category you can store texts and wordings for various elements via the admin interface. It is possible for you to store dynamic variables in order to guarantee a personal oration.

note

Hover over the images to get a more detailed view

Forms

In this section you can determine various settings for the checkout forms and enable/disable various usability features

FEATURE: Check Email Availability

A bad email address is a lost customer. Email is the primary form of communication with customers and prospects for businesses. Invalid email addresses result in unnecessary bounces and drive down your engagement metrics and sender reputation and cost you money. Using this function, the email is checked by the external service provider Mailgun. You need Mailgun to use it, more about that ↓

In this Field you can insert the Domains to autocomplete the user input data. Separated by new line.

Enable Street Number

Activate street number form field This function only applies if Shipping → Force Street Address to One Line = No. If you want to enable it: Admin → Stores → Configuration → Customers → Customer Configuration → Name and Address Option → Number of Lines in a Street Address should be at least 2. (Recommendation: 2)

Hide Region Field by Country

Regions hide form field by country. Depending on the configurations:

Admin → Stores → Configuration → GENERAL → General → State Options → State is required for.
Admin → Stores → Configuration → GENERAL → General → State Options → Allow to Choose State if It is Optional for Country

FEATURE: Checkoutform Sort Order

Increased Completion Rates through adapted form sequences. Free adaptation possibilities to your target group. Activate this option to adjust the order of the shipping & Billing addresses in the form fields.

Here you can set the order for the shipping address form by numbering.

FEATURE: Auto-Correct

The autocorrection is a helpful feature on mobile devices, but it is not uncommon for this help function to produce annoying errors. The auto-correction function is particularly vulnerable to abbreviations, street names or e-mail addresses and can cause major problems if not noticed by the user. With the 3SC you can enable / disable the native mobile auto-correction: on off

FEATURE: Auto-Capitalize

Automatic capitalization is also a major frustration factor when using forms on mobile devices. With email addresses, captchas or case-sensitive passwords, this function can be a real problem. The 3SC allows you to enable / disable the native mobile auto-capitalization feature to be able to increase your mobile usability Here you have various options for the native mobile feature for the auto-capitalization function: on off sentences words characters

FEATURE: Auto-Complete

Autocomplete allows a browser to complete values, based on values the user has entered before. Potentially helpful for “Last name,” but a real hassle for “username” when that is randomly assigned. With 3SC you can enable / disable the native mobile auto-complete feature too

FEATURE: Spellcheck

Mobile devices attempt to keep us on the spelling-and-grammatical straight-and-narrow. The spellcheck behavior typically underlines words and phrases with a red line and may offer a contextual menu to help the user correct it. But on a password field, and probably a username field, it’s nearly always wrong. It creates additional visual noise and user interface confusion for the user. 3SC allows you to enable / disable the native mobile spell checking feature with on off

Shipping

In this section you can define various settings for the dispatch form and enable and disable usability features

FEATURE: Address Popup

This great feature allows you to disable/enable the magento standard shipping address popup. Setting it to No will display an inline form for the new shipping address when the Customer clicks on ADD NEW ADDRESS.

FEATURE: Packstation

The Receiving of purchased goods is just as much a part of the shopping experience as the right atmosphere in the shop. It is important for customers to have control over the receiving of the goods. For this reason the 3SC offers the function of packingstations for increased user experience.

In this section is the Implementation of Packstation functionality and necessary fields located. The user has the possibility to switch between regular address and Packstation. To have packstation switcher active Admin → Stores → Configuration → Customers → Customer Configuration → Name and Address Option → Number of Lines in a Street Address should be at least equal to 2 (recommended equal to 2).

Packstation format to automatically fill in street address on first line. Placeholders: %tsc_packstation% and %tsc_post_number%.

tip

We are currently building a live connection to the packstations from DHL which will be published soon. With this Feature it will be possible that the next packing station to the billing address will be selected automatically. If the customer wants to deliver to another packingstation, he can select this live in a map. Which highly increase the usability by checking out with a packingstation.

Feature: Street Address

Force Street Address to One Line

This feature offers increased usability in contrast to the magento standard checkout. The customer can enter his entire address in an input field without having to jump between several input fields just for the address. You can display only one line for the whole street address (street + housenumber) in shipping and billing form.

Show Back to Cart Link

Display of a back to shopping cart button

Unique selling points (Highlight Map)

A unique selling proposition is a key positioning message a company or sales representative presents to prospects. Your USP explains why your product or service is bigger, better or different than competing alternatives. For this reason the 3SC is offering the Highlight Map functionality to present your USPs to your customers at the checkout.

Insert here your Highlight text which is presented under the Payment step button and changing every 4 seconds. Maximum 3 lines.

Payment

In this section you can define various settings for payment

Selected Payment Method

Select the payment method which should be selected by default when you are going to the payment step while your checkout process.

Review

In this section you can define various settings about the Review Step

FEATURE: Move Checkout Agreements in Review Step

One great feature of the 3SC is the possibility to move the Checkout Agreements in the Review Step instead the magento standard at payment step. With this feature you can put alternate agreements HTML instead of standard display it without checkbox!

Everything legally secure!

tip

Works only if Disallow Review Step for Payments is empty.

Disallow Review Step for Payments:

Select payment methods that do not contain a review step. And thus only 2 steps are required as a checkout.

Place Order Selectors

Insert the class for the order button container/parent here. jQuery XPath is used to find the Order Button Container in the Payment Step.Tag {code} to replace it with the payment method code.

Place Order Button Selectors Map

With this option you can access the order button for a specific payment method in order to take over the payment step. jQuery XPath is used to find the order button of a specific payment method. Tag {code} to replace it with the payment method code.

Sidebar

In this section you can find various settings for the right sidebar, which contains the article, total and comment box.

Remove & Update Quantity of Cart Item

Determine whether to display the option to select the amount or show the option to delete an item.

Checkout Steps Selectors

With the 3SC you can add an ID to the sidebar to be able to make additional styling adjustments. Additionally to this you can add the class of the checkout step wrapper or add the class name for the OPC wrapper if the sidebar is deactivated in the review step. jQuery XPath is used to find wrappers of checkout step elements.

Delivery Product Attribute

With this selection you can add additional Delivery Product Attributes.

Header

In this section you can define various settings for the Header of the 3SC extension.

Show Back to Cart Link

Option to display a button on mobile devices that leads back to the shopping cart.

Customer Account

In this section you can find various settings which are related to the customer account

FEATURE: Account Checkbox

With this feature of 3SC you have the Option to display a checkbox for creating an account and set it automatically as default. You can define the default value of checkbox create account in checkout and define the text which will be displayed.

FEATURE: Information Map

The information map can be used to display something under the "create account" checkbox. With this functionality you can cater to your customers even more! Option to define the information text under create account checkbox. Maximum 3 lines.

Express Checkout Area

Another great feature of the 3SC is the express checkout area. Offering an express checkout is the way to go if you want to provide a fast and optimized experience for your shoppers. In this section you can define various settings for the Express Checkout Area. With this feature you have options like displaying the ECA,defining a Title & Description and their position.

LESS CSS Variables

The checkout does not match the shop? Not with 3 Step Checkout. Here you have the possibility to adjust all colour settings to the web shop CI. Here you will find settings for the display in the frontend. You can use LESS / CSS variables to adapt the layout of the 3SC as you wish

Generate

Generate LESS CSS Files - Clean up the cache for. Preferably deploy in developer mode and then in production mode, as LESS files are only compiled to CSS files during the deployment process. Example, is for illustration only! These steps should be known and only performed by a developer:

$ cd path/to/magento2/installation

$ rm -rf var/cache/* generated/* var/page_cache/* var/view_preprocessed/*

$ cd pub/static

caution

Be careful! Only use in pub/static

$ find . -depth -name .htaccess -prune -o -delete

$ cd -

$ bin/magento setup:static-content:deploy de_DE en_US -f

$ bin/magento cache:flush && php bin/magento cache:clean

Checkout main color: Main color of checkout

Checkout Body Text Color: Main color of the text in checkout

C2A Primary Color: Here you can change the color of the primary elements of the 3SC

C2A Secondary Color: Here you can change the color of the secondary elements of the 3SC

Form Input Colors: 3SC gives you the possibility to change the Form Input colors for Default Focus Error Success too

Right side BG color: Right side background color

Log JS Debug Messages

Here you will find settings for JS debug messages

Active:

Activate / deactivate log messages in the console

3SC Augments

In order to be able to use all functions of the 3SC, you need the connection of this third party provider

MailGun

Mailgun is an email automation module that is required for email validation. With email validation, you won’t waste your budget on email addresses that don’t exist

Create an account for the tariff that suits you best. The API key you need is located on the start page of the control panel. This is the first page you see when you sign in, or you can access it by clicking the Mailgun logo. Copy the Public API Key and paste it into the 3SC Settings.

Email Validation: Activate / deactivate the email validation in the checkout

API Private Key: Insert your API private key

Mailbox verification: Activate / deactivate the check whether a mailbox exists.

Timeout: Set the timeout for the request to the Mailgun API to the second.

Namsor

Namsor is a tool for gender recognition. The gender of the user is one of those obligatory fields in most checkout forms. While the annoyed user might not know why this detail is needed, the answer is simple: It allows the vendor to personalize their promotions. The 3SC can offer this functionality without the annoying gender input field with automatic recognition and database gender transfer. This way we eliminated unnecessary form fields. Decreased interaction time with less fields to fill in! Namsor is an API for the precise classification of personal names by gender, country of origin, or ethnicity.

Create an account for the tarif that suits you best and add the Namsor API Username / Channel e.g.lorem.ipsum.com/john.doe@example.com/1234567

Finally, add the API private key.

Aktiv: Activate / deactivate the recognition of first name, last name and gender in the single name field in the checkout.

API Channel(User): Add Namsor API Username / Channel e.g.

lorem.ipsum.com/john.doe@example.com/1234567

API Key(Secret) Activate / deactivate the check whether a mailbox exists.

Timeout Set the timeout for the request to the Namsor API to the second.

GoogleMaps

First sign in to Google or create a new account. Request your API key by clicking the Request key button in the top right corner

Then activate the Google Maps Javascript API

Create a project.

API access data

Copy the API key and paste it in the backend

Include Javascript: Option to include the Google Maps Javascript

API Key: Insert Google Maps API here.

Language: Insert the language for language localization here.

Libraries: Here you can add different Google Maps libraries separated by a comma.

Adress Autocomplete

Feature Autocomplete: Enable / Disable autocomplete for the shipping/billing address field based on written text. Here you must have inserted the Google API key in the Google Maps section in the settings.

3SC Paypal & Amazon Payment

Express Checkout Area: Move PayPal/Amazon Payment button from checkout in express checkout area. With this feature of 3SC you can add a Title & Descripton for the Amazon & Paypal Payment Method at the Express Checkout Area.

Enhanced Tax Display

In this section you can define various settings about the tax rates in the frontend.

General

Here you will find further options on how you can adjust the display of the tax rate.

Active: Activate / deactivate the extended display of taxes

Grand Total Including Tax Label: Replace the grand total including the tax label. Leave the value blank to use the standard label. The standard Magento label is Order Total Incl. Tax

Grand Total Excluding Tax Label: Substitute the grand total without the tax label. Leave the value blank to use the standard label. The standard Magento label is Order Total Excl. Tax

Grand Total Label: Replace the grand total tax label. Leave the value blank to use the standard label. The standard Magento label is Order Total

Cart Estimation Block

In this section you have the possibility to set various options for displaying taxes in the cart estimation block. With this feature you can activate the display of percentage tax rate. and change information on the label of the subtotal. At Tax Label you can add dynamic variables as placeholders for control characters: % percent%. Leave the value blank to use the standard label

Minicart

Settings for displaying taxes when calculating the total in the minicart

Show Tax Percent: Option whether the percentage tax rate should be displayed in the minicart.

Checkout Summary Block

In this section you have the possibility to set various options for displaying taxes in the checkout summary block. With this feature you can activate the display of percentage tax rate. and change information on the label of the subtotal. At Tax Label you can add dynamic variables as placeholders for control characters: % percent%. Leave the value blank to use the standard label

Shipping

Shipping Label Map: Here you can add shipping methods to the Shipping Label Map. The label placeholders are: % carrier_title% and % method_title%.

My Account orders, invoices, shipments and credit memos

Here you can make various settings for orders and invoices, which the customer can view in the account area.

Show Tax Percent: Activate / deactivate the display of the percentage tax rate.

Show Expanded Tax Details: Option to view advanced tax details.

Grand Total Including Tax Label: Replace total amount including tax label. Leave the value blank to use the standard label. The standard Magento label is Grand Total (Incl.Tax).

Grand Total Excluding Tax Label: Replace total amount without tax label. Leave the value blank to use the standard label. The standard Magento label is Grand Total (Incl.Tax).

Grand Total Label: Replace grand total tax label. Leave the value blank to use the standard label. The standard Magento label is Order Total.

Modul 6 - Order Comment

Settings for a comment field in the checkout can be made here.

Active: Activate / deactivate the display of a comment field

Comment Field Placement in Checkout: Settings for the placement of the comment field. This can be inserted in various places.Select the desired position for the comment field

Submit Comment on Payment Information Save: Advanced option. Sends a comment again in the payment step when the Place order button is clicked, and saves it with the payment information - AJAX request.

Payment Information

Under Payment information in the magento backend you can add further information and positive indicators to existing payment methods.

note

For maintenance, click on "Add payment information" and fill out the form.

Payment method: Here you will find all common payment methods. Complete the form, upload the icon of the respective payment provider and click on Save