説明
Turn Figma designs into editable Oxygen Builder sections – copy & paste, just like that.
This plugin is the essential integration for readymade, a Figma plugin that allows designers and developers to convert their Figma elements into live, editable WordPress layouts using Oxygen Builder.
With a single click, you can transfer design elements from Figma and insert them into the Oxygen Builder’s structure panel – with all layout, classes, and structure preserved.
NEW in v1.3.0: Automatic Class Synchronization
Your Figma design system now syncs directly to Oxygen! Class definitions from Figma are automatically created as Oxygen global classes. Element-specific styles stay with the element, while reusable class styles are instantly available in Oxygen’s selector dropdown. Supports both new clean-separation format and backward-compatible tree-based detection.
Smart Features:
- 🎨 Automatic Class Sync – Figma classes become Oxygen global classes instantly
- ⚙️ Configurable Sync Mode – Choose create-only (safe) or create+update (aggressive)
- 🔤 Smart Font Matching – Automatically fixes font family mismatches (e.g., “BreeSerif” “Bree Serif”) with 95%+ accuracy
- ♻️ Intelligent Duplicate Detection – Content-based image detection prevents duplicate uploads and saves storage space
- 📁 Smart Filename Resolution – Handles filename conflicts with size-based and incremental suffixes
- 📊 Visual Progress Tracking – Real-time progress indicator shows duplicate detection and upload status
- 🔧 Zero Configuration – Works automatically after activation
- 🎯 Silent Operation – All optimizations happen seamlessly in the background
Who is this for?
- WordPress developers using Oxygen
- Designers who hand off Figma files to WordPress teams
- Agencies looking to speed up design-to-code workflows
Features
- Enables seamless copy-paste from Figma to Oxygen 4
- Paste directly into the Oxygen structure view
- Works automatically after install
- Clean, WordPress-standard code
- Compatible with most caching and optimization plugins
スクリーンショット
readymade Figma plugin in action 
Paste in action – Oxygen Builder
インストール
- Upload the plugin folder to
/wp-content/plugins/ - Activate via the WordPress Plugins screen
- Install the readymade Figma plugin
- Start copying sections from Figma and paste into Oxygen
FAQ
-
Do I need to configure anything after installation?
-
No. Just activate it and you’re ready to go.
-
What is readymade?
-
A Figma plugin that turns designs into editable WordPress layout code, ready for Oxygen Builder.
-
Will this slow down my site?
-
No. It loads a lightweight script only in the Oxygen editor context.
評価
貢献者と開発者
Figma to Oxygen Builder – readymade WordPress Integration はオープンソースソフトウェアです。以下の人々がこのプラグインに貢献しています。
貢献者
変更履歴
1.3.0
- NEW: Automatic class synchronization – Figma classes sync directly to Oxygen global classes
- NEW: WordPress settings page for configurable sync mode (create-only vs create+update)
- NEW: Storage type option (global classes vs custom selectors)
- NEW: Backward compatible format detection (element+classes vs tree-based)
- NEW: Real-time Angular scope updates for immediate UI refresh
- NEW: Toast notifications for class creation/update feedback
- NEW: AJAX handler with Oxygen autoload compatibility
- Enhanced: Clean separation between element-specific and class-specific styles
- Enhanced: Support for parent and set_name class properties
1.2.3
- NEW: Intelligent duplicate detection – automatically detects and reuses existing images based on content hash
- NEW: Smart filename conflict resolution with size-based and incremental suffixes
- NEW: Support for Figma-generated filenames via suggested_filename field
- Enhanced progress indicator shows duplicate detection status and completion statistics
- Fixed: Progress callback parameter forwarding for duplicate tracking
- Performance: ~80-130ms overhead per image with content-based deduplication
1.2.2
- Fixed: Native paste now works in Oxygen code blocks and contenteditable elements
1.2.1
- Visual progress indicator for image uploads to WP Media Library
1.2.0
- Firefox support added
1.1.1
- Enhanced image processor and paste handler modules
- Improved stability and performance
1.1.0
- Intelligent font matching with 95%+ accuracy
- Automatic font name conversion (e.g., “BreeSerif” “Bree Serif”)
- IMPROVED: Modular JavaScript architecture for better maintainability
- IMPROVED: Performance optimizations with cache-first approach
- IMPROVED: Enhanced error handling and comprehensive logging
1.0.1
- Added upload image to Media Library functionality
1.0.0
- Initial release – adds Oxygen 4 support for readymade Figma plugin