InstaWP Webinar Notepad Example

notepad.md

WooCommerce Top Seller Music Banner - Implementation Guide

Overview

Create a plugin that displays a "Top Seller" banner above products in the "Music" category, both on single product pages and in product loops.

Plugin Structure

1. Create a single PHP file named woo-music-top-seller.php in the wp-content/plugins directory.

2. Add the WordPress plugin header comment at the top of the file with the following information(1):

   • Plugin Name: WooCommerce Music Top Seller Banner
   • Description: Adds a "Top Seller" banner to music category products
   • Version: 1.0.0
   • Requires WooCommerce: 8.0
   • WC tested up to: 8.3
   • Include appropriate license information

Implementation Steps

1. Plugin Initialization

• Create a main class named WC_Music_Top_Seller
• Add a constructor that hooks into WordPress/WooCommerce actions
• Initialize the plugin on plugins_loaded action

2. Banner Display Logic

• Create two methods:
  1. One for single product pages (hook: woocommerce_before_single_product)
  2. One for product loops (hook: woocommerce_before_shop_loop_item)
• Both methods should:
  • Check if the current product belongs to the "Music" category
  • If true, output the banner HTML

3. Banner Styling

• Add a method to inject CSS styles into the header
• Hook into wp_head to add the styles
• Style rules should:
  • Position the banner appropriately
  • Use WooCommerce's default color scheme
  • Ensure responsive design

4. Category Verification

• Create a helper method to check for the "Music" category
• Use WordPress taxonomy functions to verify category membership
• Cache the result to avoid repeated database queries

5. Security Considerations

• Implement proper escaping for HTML output
• Use WordPress security functions (esc_html, esc_attr)
• Follow WooCommerce's best practices for extension development(2)

6. Performance Optimization

• Minimize database queries
• Use WordPress transients if needed
• Ensure efficient category checking

Testing Instructions

1. Test on single product pages with:

   • Products in Music category
   • Products not in Music category
   • Products in multiple categories including Music

2. Test in product loops:

   • Shop page
   • Category pages
   • Search results
   • Other archive pages

3. Test responsiveness:

   • Desktop view
   • Tablet view
   • Mobile view

Final Steps

1. Add inline documentation for all methods
2. Include proper PHP DocBlocks
3. Follow WordPress coding standards
4. Test compatibility with different WooCommerce versions

This plugin should be lightweight and focused on its single purpose of displaying the "Top Seller" banner for music products, following WooCommerce's extension development guidelines(3).