🛠️ Proposal: A Custom Widget Editor for Elementor (HTML/CSS/JS, Built-In)

Have you ever wanted to build your own widget in Elementor using just HTML, CSS, and JavaScript — without creating a WordPress plugin?

❓ The Problem

Currently, building a custom widget in Elementor requires writing PHP, registering it with WordPress, and deploying it via plugin. For many frontend developers, this creates a barrier.

Elementor is a powerful visual builder, but when it comes to adding custom functionality (like animations, dynamic components, or third-party APIs), you're limited to embedding code in HTML widgets — and even then, it's clunky and lacks structure.

💡 The Idea

What if Elementor had a built-in Custom Widget Editor?

Features:

  • Code editor tabs for HTML, CSS, and JavaScript
  • Live preview inside the panel
  • Save & reuse custom widgets across projects
  • Export to plugin or Elementor template
  • Syntax highlighting and basic linting

Aimed at power users, it would bring the experience of CodePen or JSFiddle directly into the Elementor UI.

🖼️ Mockup

Here’s a quick visual mockup of how it could look:

Custom Widget Editor

🧠 GitHub Discussion

I’ve shared this idea in the official Elementor GitHub Discussions:

👉 Read or join the conversation here

🙌 Let's Make It Happen

If you're a developer, designer, or part of the Elementor team and this idea resonates with you — I'd love to hear your thoughts.

Thanks for reading, and happy building!

`