Fix: Sliders not working in Elementor when using embed code

[codegen-sh]

Issue

Clerk.io sliders that require product/category data do not work when inserted via embed code in Elementor pages. This happens because Elementor doesn't properly process PHP shortcodes within HTML attributes, particularly in custom widgets or embed code blocks.

Solution

This PR adds a compatibility layer between Clerk.io and Elementor that:

1. Detects Clerk elements with PHP shortcodes in data attributes
2. Evaluates these shortcodes via AJAX
3. Updates the data attributes with the actual values
4. Re-initializes Clerk.js to process the updated elements

Implementation

• Added clerk-elementor-compatibility.php - PHP integration with Elementor
• Added clerk-elementor-fix.js - JavaScript fix for processing shortcodes
• Added documentation and integration guide

Benefits

• Works with both embed code and plugin-inserted sliders
• No need to modify existing templates or shortcodes
• Compatible with all Elementor widgets
• Minimal performance impact
• No changes required to Clerk.js core functionality

Testing

To test this solution:

1. Add a Clerk.io slider that requires product data to an Elementor page
2. Use the shortcode [clerk_product_id] in the data-products attribute
3. Verify that the slider loads and displays products correctly

Documentation

• See solution/README.md for technical details
• See solution/INTEGRATION.md for integration guide

---

💻 View my work • About Codegen