# FINEART Artworks Manager

## 🎨 Overview

A beautiful, custom artworks management page that gives artists full control over their portfolio. Cleaner and more intuitive than the default MultiVendorX products page.

**URL:** `https://fineart.gallery/dashboard/artworks-manager/`

---

## ✨ Features

✅ **Clean, Modern Interface** - Beautiful card-based layout
✅ **Drag & Drop Reordering** - Easily reorder artworks
✅ **Remaining Editions Display** - See stock at a glance
✅ **One-Click Referral Links** - Get product referral links instantly
✅ **Quick Actions** - View, Edit, and Share buttons
✅ **Mobile Responsive** - Works perfectly on all devices
✅ **Real-time Saving** - Order changes save automatically
✅ **Stats Dashboard** - See total artworks and editions

---

## 📦 What's Included

### Files Created

```
fineart-plugin/
├── includes/vendor-dashboard/
│   └── class-fineart-artworks-manager.php        ← Main class
├── templates/vendor-dashboard/
│   └── artworks-manager.php                      ← Page template
├── css/
│   └── artworks-manager.css                      ← Styles
├── js/
│   └── artworks-manager.js                       ← Drag-drop & modal logic
└── includes/
    └── class-fineart-loader.php                  ← Updated
```

---

## 🚀 Installation

### Step 1: Upload Files

Upload the updated `fineart-plugin` folder to:
```
/wp-content/plugins/fineart-plugin/
```

### Step 2: Flush Permalinks

1. Go to **Settings > Permalinks** in WordPress admin
2. Click **Save Changes** (no need to change anything)
3. This registers the new `/dashboard/artworks-manager/` endpoint

### Step 3: Done!

Access the artworks manager at:
```
https://fineart.gallery/dashboard/artworks-manager/
```

A menu item "Artworks Manager" will also appear in the vendor dashboard navigation.

---

## 🎯 How to Use

### For Artists

1. **Access the Page**
   - Log in to your vendor dashboard
   - Click "Artworks Manager" in the menu
   - Or visit `/dashboard/artworks-manager/`

2. **View Your Artworks**
   - See all published artworks in card view
   - Each card shows: image, title, remaining editions
   - Stats at the top show total artworks and editions

3. **Reorder Artworks**
   - Click and hold the drag handle (☰ icon)
   - Drag the artwork card up or down
   - Release to drop in new position
   - Order saves automatically
   - Notification confirms save

4. **Get Referral Links**
   - Click "🔗 Get Link" button on any artwork
   - Modal opens with product-specific referral link
   - Click "📋 Copy" to copy to clipboard
   - Share link to earn 1.5x commission!

5. **Quick Actions**
   - **👁️ View** - Opens artwork page in new tab
   - **✏️ Edit** - Goes to edit product page
   - **🔗 Get Link** - Gets referral link

---

## 💡 Features Explained

### Drag & Drop Reordering

The order you set here controls how artworks appear in:
- Your artist collection page
- Gallery embeds
- Product lists

**How it works:**
- Uses jQuery UI Sortable
- Saves order as `_artist_display_order` meta field
- Updates via AJAX in real-time
- Shows visual feedback while dragging

### Referral Links

Each artwork gets a unique referral link:
```
https://fineart.gallery/product/artwork-name/?ref=artistslug
```

**Benefits:**
- 50% commission bonus (1.5x total)
- 90-day cookie tracking
- Works with existing referral system
- Perfect for social media sharing

### Remaining Editions

Shows real-time stock status:
- **Green badge** - Stock available
- **Red "Sold Out"** - No stock remaining
- Number shows exact quantity available

---

## 🎨 Customization

### Change Colors

Edit `css/artworks-manager.css`:

```css
/* Main gradient (purple/blue) */
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

/* Change to different colors */
background: linear-gradient(135deg, #your-color-1, #your-color-2);
```

### Change Layout

Edit `templates/vendor-dashboard/artworks-manager.php`:

- Modify card structure
- Add/remove fields
- Change button labels
- Customize empty state

### Add Custom Actions

Edit `class-fineart-artworks-manager.php`:

```php
// Add new AJAX action
add_action('wp_ajax_your_custom_action', [__CLASS__, 'your_function']);

public static function your_function() {
    // Your code here
}
```

---

## 🔧 Technical Details

### Endpoint Registration

```php
add_rewrite_endpoint('artworks-manager', EP_ROOT | EP_PAGES);
```

Creates URL: `/dashboard/artworks-manager/`

### Menu Integration

```php
add_filter('mvx_vendor_dashboard_nav', [__CLASS__, 'add_dashboard_menu'], 20);
```

Adds menu item to MVX vendor dashboard.

### Product Ordering

Uses custom meta field: `_artist_display_order`

```php
'meta_key' => '_artist_display_order',
'orderby' => 'meta_value_num',
'order' => 'ASC',
```

### AJAX Endpoints

1. **Save Order:** `fineart_save_artwork_order`
2. **Get Referral Link:** `fineart_get_artwork_referral_link`

Both use nonce verification and capability checks.

---

## 📱 Mobile Responsiveness

Fully responsive design with breakpoints:

- **Desktop (>768px):** Horizontal cards, all actions visible
- **Mobile (<768px):** Stacked layout, buttons stack vertically

---

## 🐛 Troubleshooting

### Page Shows 404

**Solution:** Flush permalinks
1. Settings > Permalinks
2. Click Save Changes

### Menu Item Not Showing

**Solution:** Check MultivendorX is active
```php
if (function_exists('mvx_get_vendor_dashboard_endpoint_url')) {
    // MVX is active
}
```

### Drag & Drop Not Working

**Possible causes:**
1. jQuery UI not loaded
2. JavaScript conflicts
3. Browser console errors

**Solution:**
- Check browser console (F12) for errors
- Verify jQuery UI Sortable is enqueued
- Clear cache and reload

### Referral Links Not Generating

**Possible causes:**
1. Referral system not installed
2. Vendor slug not found
3. AJAX error

**Solution:**
- Check referral system is active (see `REFERRAL-PROGRAM-SETUP.md`)
- Verify nonce is valid
- Check browser console for errors

---

## 🎊 Comparison: Old vs New

### Old (MultiVendorX Products Page)

❌ Complex DataTables interface
❌ Hidden behind template overrides
❌ Hard to customize
❌ No drag-drop reordering
❌ No integrated referral links
❌ Table-based layout

### New (Artworks Manager)

✅ Clean, modern card layout
✅ Built into plugin (no theme dependency)
✅ Easy to customize
✅ Drag-drop reordering built-in
✅ One-click referral links
✅ Beautiful responsive design
✅ Stats dashboard
✅ Better mobile experience

---

## 🚀 Future Enhancements

Possible additions:

- **Bulk Actions** - Edit multiple artworks at once
- **Filters** - Filter by category, stock status, etc.
- **Search** - Quick search by artwork name
- **Analytics** - Views, sales per artwork
- **Quick Edit** - Edit price, stock without leaving page
- **Duplicate** - Clone artwork with one click
- **Categories** - Organize by collection/series

---

## 📞 Support

### Common Questions

**Q: Can I keep both pages (old and new)?**
A: Yes! The old `/dashboard/artworks/` still works. This is a separate page.

**Q: Does this affect my collection page?**
A: Yes! The display order you set here controls collection page order.

**Q: Can I customize which artworks show here?**
A: Currently shows all published products. Can be filtered in code.

**Q: Does this work with other vendor plugins?**
A: Built for MultivendorX. May need adaptation for Dokan/WC Vendors.

---

## 🎯 Best Practices

### For Artists

1. **Order Strategically**
   - Put best sellers at the top
   - Feature new releases prominently
   - Group by theme or color

2. **Use Referral Links**
   - Share on Instagram/Facebook
   - Include in email signatures
   - Add to blog posts

3. **Monitor Editions**
   - Check stock regularly
   - Update as needed
   - Plan for sold-out artworks

### For Site Admins

1. **Promote the Feature**
   - Announce to artists
   - Create tutorial video
   - Add to onboarding

2. **Monitor Usage**
   - Track adoption rate
   - Collect feedback
   - Add requested features

3. **Performance**
   - Monitor load times
   - Optimize as needed
   - Consider pagination if >50 products

---

## 📖 Related Documentation

- **Referral System:** `REFERRAL-PROGRAM-README.md`
- **Referral Setup:** `REFERRAL-PROGRAM-SETUP.md`
- **Artwork Referral Links:** `ARTWORK-REFERRAL-LINKS-README.md`

---

## 🎉 Summary

The Artworks Manager provides a **clean, modern interface** for artists to:

✅ Manage their portfolio
✅ Reorder artworks visually
✅ Get referral links easily
✅ See stock at a glance
✅ Access quick actions

**URL:** `https://fineart.gallery/dashboard/artworks-manager/`

**Result:** Happier artists, better UX, more referral link usage!

---

Made with ❤️ for FINEART artists
Version 1.0 | February 2026