# POS Screen Overview

The POS screen is the main interface for selling products. It's where you'll spend most of your time when using WCPOS.

<!-- -->

## Screen Layout[​](#screen-layout "Direct link to Screen Layout")

### Header[​](#header "Direct link to Header")

The header bar displays:

* **Store name** - The name of your connected WooCommerce store
* **Connectivity indicator** - Green dot when connected to the server, yellow/red when offline
* **User menu** - Click to access settings, switch users, or log out

### Navigation Drawer[​](#navigation-drawer "Direct link to Navigation Drawer")

The left sidebar provides quick access to all main screens. The selling screen and the diagnostic/support screens are in the free plugin; the management screens (Products, Orders, Customers, Reports) are part of [WCPOS Pro](/getting-started/free-vs-pro.md).

| Icon | Screen        | Description                                                             | Edition |
| ---- | ------------- | ----------------------------------------------------------------------- | ------- |
|      | **POS**       | Main selling interface (you are here)                                   | Free    |
|      | **Products**  | Inventory management — edit stock, prices, and product details          | Pro     |
|      | **Orders**    | Order history — look up, reprint, edit, and refund past orders          | Pro     |
|      | **Customers** | Customer management — add and edit customers                            | Pro     |
|      | **Reports**   | Sales reports — end-of-day totals by payment method, cashier, and store | Pro     |
|      | **Logs**      | System logs for debugging                                               | Free    |
|      | **Support**   | Discord support channel                                                 | Free    |

The version number is displayed at the bottom of the drawer.

Free vs Pro screens

On the free plugin you can still **select** an existing customer at the till — you just can't open the management screens. Products, Orders, Customers, and Reports unlock with Pro. For a full breakdown see [Free vs Pro](/getting-started/free-vs-pro.md).

## Responsive Layout[​](#responsive-layout "Direct link to Responsive Layout")

WCPOS adapts to different screen sizes:

### Desktop / Tablet (Large Screens)[​](#desktop--tablet-large-screens "Direct link to Desktop / Tablet (Large Screens)")

On larger screens, the POS displays a **two-column layout**:

* **Left column:** Product Panel - search and browse products
* **Right column:** Cart Panel - view and manage the current order

The columns are **resizable** - drag the divider between them to adjust the proportions.

<!-- -->

### Mobile (Small Screens)[​](#mobile-small-screens "Direct link to Mobile (Small Screens)")

On smaller screens, the POS uses a **tab-based layout**:

* **Products tab:** Browse and add products to cart
* **Cart tab:** View cart, manage line items, and checkout

Switch between tabs using the navigation bar at the bottom of the screen.

<!-- -->

## Main Components[​](#main-components "Direct link to Main Components")

### Product Panel[​](#product-panel "Direct link to Product Panel")

The left side of the POS is the [Product Panel](/pos/product-panel/.md), where you:

* Search for products by name, SKU, or barcode
* Filter products by stock status, category, tags, etc.
* Add products to the cart

[Learn more about the Product Panel →](/pos/product-panel/.md)

### Cart Panel[​](#cart-panel "Direct link to Cart Panel")

The right side of the POS is the [Cart Panel](/pos/cart/.md), where you:

* View items in the current order
* Edit quantities and prices
* Select or add customers
* Access order actions (notes, void, checkout)

[Learn more about the Cart Panel →](/pos/cart/.md)

### Checkout[​](#checkout "Direct link to Checkout")

When you're ready to complete a sale, click **Checkout** to open the [Checkout modal](/pos/checkout/.md):

* Apply coupon codes
* Select payment method
* Process payment
* Print or email receipt

[Learn more about Checkout →](/pos/checkout/.md)

## Keyboard Shortcuts[​](#keyboard-shortcuts "Direct link to Keyboard Shortcuts")

WCPOS supports keyboard shortcuts for faster operation. Access the full list via the Settings modal or see [Keyboard Shortcuts](/settings/store/hotkeys.md).

Common shortcuts:

| Shortcut           | Action               |
| ------------------ | -------------------- |
| `Ctrl + F`         | Focus search bar     |
| `Ctrl + Shift + S` | Open Settings        |
| `Escape`           | Close modal/dialogue |

## Connectivity[​](#connectivity "Direct link to Connectivity")

The green indicator in the header shows your connection status:

* **Green** - Connected to the WooCommerce server
* **Yellow** - Connection issues, retrying
* **Red** - Offline mode

While offline, you can still browse cached products and customers, and start new orders. Completing orders requires connectivity.