Panth Checkout Extended — One Page Checkout for Magento 2

Premium one-page checkout extension for Magento 2 that replaces the default two-step accordion checkout with a configurable multi-column layout, a sticky order summary sidebar, inline newsletter subscription, qty +/- increment controls, a sidebar place-order button, coupon code in the sidebar, custom CSS/JS injection, and a modern card-style UI. Fully admin-configurable — zero code changes required.

Panth Checkout Extended transforms the default Magento checkout into a fast, modern, conversion-focused one-page experience. Customers see shipping, payment, and order summary side-by-side in a clean card-based layout. The sticky sidebar keeps the place-order button, coupon code, newsletter opt-in, and qty controls always within reach — eliminating scroll fatigue and reducing cart abandonment. Every feature is togglable from the admin panel, so you can tune the checkout UX per store view without touching a single line of code.

Built for Magento 2.4.4 through 2.4.8 on PHP 8.1 - 8.4, fully MEQP-compliant, and engineered for speed by a Top Rated Plus Magento developer with 10+ years of eCommerce experience.

🚀 Need Custom Magento 2 Development?

Get a free quote for your project in 24 hours — custom modules, Hyva themes, checkout optimization, performance tuning, M1→M2 migrations, and Adobe Commerce Cloud.

🏆 Kishan Savaliya

Top Rated Plus on Upwork

100% Job Success • 10+ Years Magento Experience Adobe Certified • Hyva Specialist

🏢 Panth Infotech Agency

Magento Development Team

Custom Modules • Theme Design • Migrations Performance • SEO • Adobe Commerce Cloud

Visit our website: kishansavaliya.com  |  Get a quote: kishansavaliya.com/get-quote

Table of Contents

• Why Panth Checkout Extended
• Key Features
• Default Magento vs Panth Checkout Extended
• Compatibility
• Installation
• Configuration
• Layout Options
• Newsletter Subscription
• Qty Increment Controls
• Custom CSS & JS Injection
• Developer Reference: Body Classes & CSS Variables
• Troubleshooting
• FAQ
• Support
• About Panth Infotech
• Quick Links

Why Panth Checkout Extended

The default Magento 2 checkout is functional but dated — a rigid two-step accordion that forces customers to scroll, expand sections, and hunt for the place-order button. Panth Checkout Extended addresses every friction point merchants complain about:

1. Too much scrolling → 3-column layout shows shipping, payment, and summary side-by-side
2. Place order button buried → sticky sidebar keeps it always visible
3. Coupon hidden inside payment step → moved to the sidebar for one-click access
4. No newsletter capture at checkout → built-in checkbox that subscribes guest and logged-in customers automatically
5. No qty change in summary → +/- increment buttons with stock-aware qty_increments
6. Dated Luma styling → four modern card styles (Elevated, Bordered, Flat, Glassmorphism), accent color picker, border-radius control
7. Requires theme overrides for small tweaks → Custom CSS and Custom JS textareas in admin

The result is a faster, cleaner, higher-converting checkout — with zero custom code.

Key Features

Multi-Column Checkout Layout

• 1-column — stacked, mobile-friendly
• 2-column — classic content + sidebar
• 3-column — shipping | payment | summary side-by-side (desktop)
• Sidebar position — left or right
• Sticky sidebar — order summary follows the customer as they scroll

Sidebar-First UX

• Place-order button in the sidebar — always visible
• Coupon code in the sidebar — moved out of the payment step
• Newsletter checkbox in the sidebar — passive opt-in
• Auto-expanded cart items — no click to expand
• Auto-expanded discount code — input ready at page load

Newsletter Subscription at Checkout

• Checkbox in the order summary sidebar
• Configurable label text and default checked state
• Works for both guest and logged-in customers
• Uses payment extension attributes for clean API transport
• Skips duplicates if customer is already subscribed
• Never blocks order placement — errors logged silently

Qty Increment Controls in Summary

• +/- buttons next to each item in the order summary
• Respects product-level qty_increments (e.g. 0.5 step)
• Updates cart via AJAX — no page reload
• Stock-aware — disables + button at max stock

Modern UI Styling

• Card styles: Elevated (shadow), Bordered, Flat, Glassmorphism
• Accent color — admin color picker with server-side hex validation
• Border radius — pixel-level control
• Step indicators — optional numbered badges
• Field modes — Compact (multi-field rows) or Full Width
• Placeholder toggle & Tooltip toggle
• Billing title visibility toggle

Checkout UX Enhancements

• Auto-save shipping info — address and method persist as the customer types, so the payment step loads instantly
• Billing real-time sync — "same as shipping" updates billing as the customer types
• Product SKU display in summary
• Product link — clickable item names

Admin & Developer

• Custom CSS textarea — injected inline at checkout
• Custom JS textarea — injected via RequireJS at checkout
• ACL resource — Panth_CheckoutExtended::config for granular admin permissions
• Per-store-view scope — all settings respect Magento's standard scope hierarchy
• Admin-authored @noEscape — CSS/JS edits restricted to authorized admin users

Quality & Security

• MEQP compliant — passes Adobe's Magento Extension Quality Program
• No core file modifications — clean plugin and observer architecture
• Luma compatible — works with the native Luma checkout components
• Hyva friendly — works on Hyva stores running the standard Magento checkout
• Composer-installable — standard Magento 2 package

Default Magento vs Panth Checkout Extended

Compatibility

Tested on:

• Magento 2.4.8-p4 with PHP 8.4
• Magento 2.4.7 with PHP 8.3
• Magento 2.4.6 with PHP 8.2

Installation

Composer Installation (Recommended)

composer require mage2kishan/module-checkout-extended
bin/magento module:enable Panth_Core Panth_CheckoutExtended
bin/magento setup:upgrade
bin/magento setup:di:compile
bin/magento setup:static-content:deploy -f
bin/magento cache:flush

Manual Installation via ZIP

1. Download the latest release ZIP from Packagist or the Adobe Commerce Marketplace
2. Extract the contents to app/code/Panth/CheckoutExtended/ in your Magento installation
3. Make sure app/code/Panth/Core/ is also present (free required dependency)
4. Run the same commands as above starting from bin/magento module:enable

Verify Installation

bin/magento module:status Panth_CheckoutExtended
# Expected output: Module is enabled

After installation, navigate to:

Admin → Stores → Configuration → Panth Extensions → Checkout Extended

Configuration

Open Stores → Configuration → Panth Extensions → Checkout Extended. Every setting below is scoped per store view (default → website → store view), so a multi-store setup like acme.example.com and acme.example.com/eu can run different layouts, colors, and newsletter copy. Flush the cache after saving (bin/magento cache:flush).

All values live under the config path prefix panth_checkout_extended/ — handy for bin/magento config:set and CI/CD pipelines:

# Example: switch a store to a 2-column layout with a sticky left sidebar
bin/magento config:set panth_checkout_extended/layout/columns 2
bin/magento config:set panth_checkout_extended/layout/sidebar_position left
bin/magento config:set panth_checkout_extended/layout/sidebar_sticky 1
bin/magento cache:flush

General

Layout

Style

Cart & Order Summary

Newsletter Subscription

Form Styles

Shipping

Payment

Billing

Custom Code

Layout Options

1-column (stacked) — best for stores with few items per order and mobile-heavy traffic. Shipping, payment, and summary stack vertically.

2-column — the industry-standard modern checkout. Main content (shipping + payment) on one side, sticky order summary on the other. Best for the majority of stores.

3-column — maximum information density. Shipping, payment, and order summary are all visible side-by-side. Ideal for desktop-heavy B2B stores or stores with complex payment flows.

The layout switches via a custom layout handle applied by an observer, so you can further customize via your own checkout_index_index.xml if needed.

Newsletter Subscription

The newsletter checkbox is rendered inside the order summary sidebar so it is visible throughout the checkout flow. On order placement:

1. The checkbox state is captured via payment extension attributes — a clean, Magento-standard transport
2. Two separate plugins handle subscription — one for guest customers (by email), one for logged-in customers (by customer ID)
3. If the email is already subscribed, no duplicate subscription is created
4. Subscription failures are caught and logged — they never block order placement

This approach is fully compatible with GDPR and CAN-SPAM since the customer explicitly opts in via an unchecked-by-default checkbox (configurable).

Qty Increment Controls

When enabled, +/- buttons appear next to the quantity of each item in the order summary:

• Click + — increments by the product's qty_increments value (default 1, can be 0.5, 2, 5, etc.)
• Click − — decrements similarly, respecting minimum qty
• Updates the cart via AJAX, no page reload
• Totals refresh automatically
• Stock-aware — + button disables when max stock is reached
• Works on both decimal and integer qty products

Custom CSS & JS Injection

For quick tweaks without a theme override, use the Custom CSS and Custom JS fields in admin:

Custom CSS example:

.checkout-extended .place-order-sidebar button {
    background: linear-gradient(90deg, #7928ca, #ff0080);
    font-size: 16px;
}

Custom JS example:

document.addEventListener('DOMContentLoaded', function() {
    // Track checkout step entry for analytics
    if (window.gtag) {
        gtag('event', 'begin_checkout');
    }
});

Both textareas are restricted to admin users with the Panth_CheckoutExtended::config ACL permission. Content is injected as @noEscape because it is admin-authored.

Common use cases:

• Override specific checkout styles without creating a theme
• Add tracking pixels or GA4 / Meta conversion scripts
• Inject A/B testing snippets
• Hide or show specific elements with CSS

Developer Reference: Body Classes & CSS Variables

Every admin option translates into a predictable body class or CSS custom property on the checkout page, so theme developers can target any configuration state without touching templates.

Body classes (applied when the extension is enabled):

CSS custom properties (emitted on :root at checkout):

Example — restyle only the 3-column glassmorphism configuration on example.com:

body.panth-checkout-3col.panth-card-glass .opc-block-summary {
    backdrop-filter: blur(18px);
    border-radius: var(--panth-checkout-radius);
}

Troubleshooting

FAQ

Is Panth Checkout Extended compatible with Hyva?

Yes — on Hyva stores that use the standard Magento checkout (the default Luma/KnockoutJS checkout, which is the most common Hyva setup). The extension targets that checkout, so it works on both Luma themes and Hyva storefronts running the standard checkout. It does not apply to the separate React-based Hyva Checkout product — for that, get a quote.

Does it work with Adobe Commerce (paid edition)?

Yes. Panth Checkout Extended works identically on Magento Open Source, Adobe Commerce on-premise, and Adobe Commerce Cloud — all versions 2.4.4 through 2.4.8.

Will it conflict with third-party payment methods?

No. The extension uses Magento's standard checkout layout and payment extension attributes. All third-party payment methods (Stripe, Braintree, PayPal, Razorpay, Klarna, Afterpay, etc.) continue to work. The default payment method setting only pre-selects a method — it does not remove any others.

Can I use my own custom checkout theme alongside this extension?

Yes. The extension applies a custom layout handle that adds a wrapper and sidebar components without modifying your theme's existing templates. You can continue to override templates in your theme as usual.

Does it slow down the checkout?

No — it is designed for speed. The auto-save shipping logic actually speeds up the checkout by pre-saving the shipping address while the customer is still typing, so the payment step loads instantly. No additional HTTP requests are made on page load beyond the default Magento checkout.

Is the newsletter subscription GDPR-compliant?

Yes. The checkbox is an explicit opt-in. You can configure the default checked state and the label. The subscription is only saved if the customer places the order — if they abandon, no subscription is created. Failures are logged silently and never block order placement.

Can I translate the extension?

Yes. All user-facing strings use Magento's __() translation function. English translations are included. Add your own app/i18n/<locale>/Panth_CheckoutExtended/ CSV file or use Inline Translation.

Does it support multi-store?

Yes. All settings respect Magento's standard scope hierarchy (default → website → store view), so you can configure different layouts, colors, and newsletter copy per store view — e.g. a 3-column desktop-first checkout for example.com and a stacked 1-column layout for a mobile-heavy regional store.

How do I switch the checkout to a 2-column layout?

Go to Stores → Configuration → Panth Extensions → Checkout Extended → Layout and set Columns to 2 Columns (Content + Sidebar), or run bin/magento config:set panth_checkout_extended/layout/columns 2 followed by a cache flush.

How do I pre-select a default shipping or payment method?

Enter the method code in Shipping → Default Shipping Method (composite carrier_method code, e.g. flatrate_flatrate) or Payment → Default Payment Method (e.g. checkmo). The method is selected automatically when the checkout loads; customers can still pick any other available method.

Can I change the checkout colors and corner radius without code?

Yes. Style → Accent Color is an HTML5 color picker that drives buttons, links, and highlights via a CSS variable, and Style → Border Radius (px) controls card and field corners. Combined with the four card styles (Elevated, Bordered, Flat, Glassmorphism), most rebrands need zero CSS.

Is the source code available?

Yes. The full source is on GitHub at github.com/mage2sk/module-checkout-extended.

Does it require the free Panth_Core module?

Yes. mage2kishan/module-core is a free, required dependency — Composer installs it automatically. It provides shared admin scaffolding for the Panth Infotech extension suite.

Support

Response time: 1-2 business days for licensed customers.

💼 Need Custom Magento Development?

Looking for custom Magento module development, Hyva checkout customization, store migrations, or conversion rate optimization? Get a free quote in 24 hours:

Specializations:

• 🛒 Magento 2 Checkout Optimization — one-page checkout, conversion rate optimization, cart abandonment recovery
• 🧩 Magento 2 Module Development — custom extensions following MEQP standards
• 🎨 Hyva Theme Development — Alpine.js + Tailwind CSS, lightning-fast storefronts
• 🖌️ Luma Theme Customization — pixel-perfect designs, responsive layouts
• ⚡ Performance Optimization — Core Web Vitals, page speed, caching strategies
• 🔍 Magento SEO — structured data, hreflang, sitemaps, AI-generated meta
• 🚀 M1 to M2 Migrations — data migration, custom feature porting
• ☁️ Adobe Commerce Cloud — deployment, CI/CD, performance tuning
• 🤖 AI-Powered eCommerce — OpenAI integration for content, search, recommendations
• 🔌 Third-party Integrations — payment gateways, ERP, CRM, marketing tools

Industries served: Fashion & Apparel, Electronics, Health & Beauty, Food & Beverage, Home & Garden, B2B Wholesale, Multi-vendor Marketplaces.

License

Commercial — see LICENSE.txt. One license per Magento production installation. Includes 12 months of free updates and email support.

About Panth Infotech

Built and maintained by Kishan Savaliya — kishansavaliya.com — a Top Rated Plus Magento developer on Upwork with 10+ years of eCommerce experience.

Panth Infotech is a Magento 2 development agency specializing in high-quality, security-focused extensions and themes for both Hyva and Luma storefronts. Our extension suite covers SEO, performance, checkout, product presentation, customer engagement, and store management — over 34 modules built to MEQP standards and tested across Magento 2.4.4 to 2.4.8.

Browse the full extension catalog on the Adobe Commerce Marketplace or Packagist.

Quick Links

• 🌐 Website: kishansavaliya.com
• 💬 Get a Quote: kishansavaliya.com/get-quote
• 👨‍💻 Upwork Profile (Top Rated Plus): upwork.com/freelancers/~016dd1767321100e21
• 🏢 Upwork Agency: upwork.com/agencies/1881421506131960778
• 📦 Packagist: packagist.org/packages/mage2kishan/module-checkout-extended
• 🐙 GitHub: github.com/mage2sk/module-checkout-extended
• 🛒 Adobe Marketplace: commercemarketplace.adobe.com
• 📧 Email: kishansavaliyakb@gmail.com
• 📱 WhatsApp: +91 84012 70422

SEO Keywords: magento 2 one page checkout, magento 2 checkout extension, magento 2 one step checkout, magento 2 multi column checkout, magento 2 sticky sidebar checkout, magento 2 newsletter at checkout, magento 2 qty increment in cart, magento 2 sidebar place order, magento 2 coupon code in sidebar, magento 2 default shipping method checkout, magento 2 preselect payment method, magento 2 hide single shipping method, magento 2 sort shipping methods by price, magento 2 checkout placeholders, magento 2 checkout tooltips, magento 2 show sku in order summary, magento 2 checkout product link, magento 2 hide billing address title, magento 2 checkout optimization, magento 2 conversion rate optimization, magento 2 cart abandonment, magento 2 modern checkout ui, magento 2 glassmorphism checkout, magento 2 checkout border radius, magento 2 custom css checkout, magento 2 custom js checkout, magento 2 checkout auto save, magento 2 billing sync, magento 2 luma checkout, magento 2 hyva standard checkout, panth checkout extended, panth infotech, mage2kishan checkout, mage2sk, kishan savaliya magento, top rated plus magento freelancer, hire magento developer upwork, magento 2.4.8 checkout module, php 8.4 checkout module, magento checkout reduce cart abandonment, magento 2 b2b checkout, magento 2 guest checkout newsletter, adobe commerce checkout extension, magento 2 checkout card style, magento 2 checkout accent color, magento 2 checkout step indicators, magento 2 shipping auto save