Saltar al contenido principal
Version: 1.x

Receipt Templates

The Receipt Template editor allows you to customize the appearance and content of receipts printed from your POS system. You can access the template editor by navigating to: WP Admin > POS > Templates

Overview​

The template system provides two types of templates:

  • Default Templates: Automatically detected from your plugin and theme files. These cannot be deleted but can be copied to create custom versions.
  • Custom Templates: User-created templates that you can fully customize, edit, and manage.

Accessing the Template Editor​

  1. Navigate to your WordPress Admin dashboard
  2. Go to POS > Templates
  3. You'll see a list of available templates organized into two sections:
    • Default Templates (from plugin/theme files)
    • Custom Templates (your custom creations)

Default Templates​

The system automatically detects receipt templates from three sources:

Template Sources​

SourceDescriptionStatus
PluginCore receipt template included with WooCommerce POSAlways available
Pro PluginEnhanced template from WooCommerce POS ProAvailable with active license
ThemeCustom template from your active themeAvailable if theme includes template

Template Actions​

For each default template, you can:

  • Preview: View how the template looks with sample data
  • Copy: Create a custom copy that you can edit
  • Activate: Set as the active template for your POS

Creating Custom Templates​

Method 1: Copy from Default Template​

  1. In the Default Templates section, find the template you want to customize
  2. Click the Copy button
  3. Enter a name for your custom template
  4. Click Copy Template
  5. Edit the newly created custom template

Method 2: Create from Scratch​

  1. Click Add New Template at the top of the page
  2. Enter a template name
  3. Select Receipt as the template type
  4. Start coding your template in the editor

Template Editor Features​

The template editor provides:

Code Editor​

  • Syntax Highlighting: PHP syntax highlighting for better code readability
  • Line Numbers: Easy navigation and debugging
  • Full-Screen Editing: Distraction-free editing environment

Template Settings Panel​

  • Language: Set to PHP for proper syntax highlighting
  • Template Type: Choose between Receipt or Report templates
  • Status: Publish/Draft status management
  • Visibility: Control template visibility

Template Actions​

  • Preview: See how your template renders with sample data
  • Set as Active: Make this template the default for your POS
  • Update: Save your changes
  • Move to Trash: Delete custom templates

Template Structure​

Receipt templates are PHP files that generate HTML output. Here's the basic structure:

<?php
/**
 * Custom Receipt Template
 */

if ( ! defined( 'ABSPATH' ) ) {
    exit; // Exit if accessed directly
}
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo( 'charset' ); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
        /* Your custom CSS styles */
        body { font-family: sans-serif; font-size: 14px; }
        .receipt-header { text-align: center; margin-bottom: 20px; }
        /* Add more styles as needed */
    </style>
</head>
<body>
    <!-- Your receipt content -->
    <div class="receipt-header">
        <h1><?php echo get_bloginfo( 'name' ); ?></h1>
        <p><?php echo get_bloginfo( 'description' ); ?></p>
    </div>

    <!-- Order details, items, totals, etc. -->

</body>
</html>

Available Template Variables​

When creating custom templates, you have access to various WordPress and WooCommerce functions and data:

Store Information​

  • get_bloginfo( 'name' ) - Store name
  • get_bloginfo( 'description' ) - Store tagline
  • get_bloginfo( 'url' ) - Store URL

Order Data​

The current order data is available through standard WooCommerce order functions when the template is rendered.

WCPOS Functions​

You can use WCPOS-specific functions (prefixed with wcpos_) to access POS-related data and functionality.

Best Practices​

Template Development​

  1. Start with a Copy: Always start by copying a default template rather than creating from scratch
  2. Test Thoroughly: Use the preview function to test your template before activating
  3. Keep Backups: Export your custom templates or keep copies of your code
  4. Mobile-Friendly: Ensure your templates work well on different screen sizes

Code Quality​

  1. Validate HTML: Ensure your HTML is well-formed
  2. Escape Output: Use WordPress escaping functions for security
  3. Error Handling: Include proper error checking in your PHP code
  4. Comments: Document your customizations for future reference

Performance​

  1. Optimize CSS: Keep styles minimal and efficient
  2. Minimize PHP: Avoid complex logic in templates
  3. Test Printing: Verify templates work well with your receipt printers

Troubleshooting​

Common Issues​

Template Not Showing Changes

  • Ensure you've clicked "Update" to save your changes
  • Check that the template is set as "Active"
  • Clear any caching plugins

Syntax Errors

  • Use the syntax highlighting to identify issues
  • Check for missing semicolons, brackets, or quotes
  • Validate your PHP syntax

Styling Issues

  • Test your CSS in the preview mode
  • Ensure styles are compatible with receipt printers
  • Keep print-friendly design principles in mind

Template Not Available

  • Check that the template type is set to "Receipt"
  • Verify the template status is "Published"
  • Ensure you have proper permissions

Getting Help​

If you encounter issues with template customization:

  1. Check the template preview for error messages
  2. Review the WordPress debug log for PHP errors
  3. Test with a copy of the default template first
  4. AI Assistance: Modern AI tools like Gemini, ChatGPT, and Claude are excellent at helping with simple WordPress templates like these. You can paste your template code and describe what you want to achieve.
  5. Consult the WooCommerce POS documentation for advanced customization

Advanced Customization​

For advanced users who need more control over receipt templates:

Theme Integration​

You can override the default template by placing a custom receipt.php file in your theme:

your-theme/woocommerce-pos/receipt.php

Hooks and Filters​

WooCommerce POS provides various hooks and filters for template customization. Consult the developer documentation for available options.

Custom Fields​

You can include custom order fields, product attributes, and other metadata in your receipt templates using appropriate WordPress and WooCommerce functions.