Variably Pretty

About the Plugin

Variably Pretty is a modern WordPress plugin that revolutionizes how WooCommerce displays variable product options. Instead of clunky dropdown menus that require multiple clicks, customers see all available options as elegant, clickable pills that make selection intuitive and visually appealing.

Key Features

• Pill-Style Selection: Beautiful, modern interface replaces boring dropdowns
• Smart Availability Logic: Automatically grays out incompatible combinations
• Selective Enabling: Choose specific products or enable for all variable products
• Mobile Responsive: Looks perfect on phones, tablets, and desktops
• Zero Configuration Needed: Works out-of-the-box with sensible defaults
• Easy Admin Interface: Simple settings page under WooCommerce menu
• Performance Optimized: Lightweight JavaScript with no jQuery bloat
• WooCommerce Native: Integrates seamlessly with existing variations system

Perfect For

• Body Jewelry Stores: Display gauge and size options elegantly (18g, 16g, 14g...)
• Fashion Retailers: Show color and size combinations beautifully
• Electronics: Present storage capacity and color options clearly
• Furniture Stores: Material, color, and size selections made simple
• Any Variable Products: Better UX for any WooCommerce store with variations

How It Works

1. Smart Detection: Plugin detects your variable products and their available variations
2. Automatic Rendering: Replaces dropdowns with pills for enabled products
3. Availability Checking: JavaScript monitors selections and updates available options in real-time
4. WooCommerce Integration: Works seamlessly with add-to-cart, pricing, and stock management

Installation Instructions

1. Download the Plugin: Click the download button to get the latest version of Variably Pretty.
2. Upload to WordPress: In your WordPress admin, go to Plugins → Add New → Upload Plugin, then select the downloaded zip file.
3. Activate the Plugin: After upload, click "Activate Plugin" to enable Variably Pretty.
4. Configure Settings: Navigate to WooCommerce → Variably Pretty to select which products should use pill-style variations.
5. Test Your Products: Visit a variable product page and see the beautiful new interface!

Customization

Variably Pretty includes clean, semantic CSS that's easy to customize. Override styles in your theme to match your brand:

/* Change pill colors */
.variably-pretty-pill {
    border-color: #your-brand-color;
}

.variably-pretty-pill.selected {
    background: #your-brand-color;
}

/* Adjust pill size */
.variably-pretty-pill {
    padding: 12px 24px;
    font-size: 16px;
}