Dynamic.ooo

<p>Dynamic Inspector for Elementor is a developer tool that provides deep insights into your Elementor pages. Inspect the element tree, analyze performance, check Dynamic Visibility settings, and debug your layouts directly from the frontend.</p>
<h4>Key Features</h4>
<ul>
<li><strong>Element Tree Inspector</strong> – Navigate through all page elements (widgets, containers, sections, templates)</li>
<li><strong>Performance Analysis</strong> – See execution time for each element with cache indicators</li>
<li><strong>Highlight Elements</strong> – Hover over elements in the inspector to highlight them on the page</li>
<li><strong>Dynamic Content Detection</strong> – Identify which elements are cached vs dynamically rendered</li>
<li><strong>Visibility Integration</strong> – View Dynamic Visibility settings when using Dynamic.ooo plugins</li>
<li><strong>Theme Builder Support</strong> – Works with Elementor Pro single/archive templates</li>
<li><strong>Clean UI</strong> – Dual-panel interface (tree navigator + detailed infobox)</li>
<li><strong>Developer Friendly</strong> – Loading messages, smooth animations, responsive design</li>
</ul>
<h4>Perfect for:</h4>
<ul>
<li>Elementor developers debugging complex layouts</li>
<li>Performance optimization and analysis</li>
<li>Understanding element hierarchy and structure</li>
<li>Identifying slow widgets</li>
<li>Checking visibility conditions</li>
<li>Theme Builder template inspection</li>
</ul>
<h4>Pro Tips</h4>
<ul>
<li>Execution times are measured in real-time during inspection—your site’s normal caching is not affected</li>
<li>Use the highlight feature to quickly locate elements on the page</li>
<li>Compatible with all third-party Elementor plugins</li>
</ul>


Dynamic Inspector for Elementor – Performance Profiler & Debugger

A powerful frontend inspector and navigator for Elementor that helps developers debug, inspect elements, and analyze performance.

CodingBunny

<p>CodingBunny CSS Inspector adds a clean, DevTools-style sidebar to your WordPress frontend, letting administrators visually inspect any element and copy its CSS with a single click.<br />
Perfect for theme customization, debugging, and quick styling adjustments—without ever opening the browser DevTools.</p>
<p>The inspector displays full CSS blocks, selector paths, HEX color values, used CSS variables, and ready-to-copy pseudo-state styles like :hover, :focus, and :active.</p>
<p>Designed for power and simplicity, and visible only to logged-in administrators.</p>
<h4>Features</h4>
<p>DevTools-like inspection sidebar, launched from the admin bar</p>
<p>Full CSS block viewer for any element (full or simplified selector paths)</p>
<p>Ready-to-copy pseudo-state blocks: :hover, :focus, :active</p>
<p>Automatic extraction of all CSS variables used by the selected element</p>
<p>Copy-to-clipboard buttons with instant visual feedback</p>
<p>Lightweight and unobtrusive—runs only for authenticated admins</p>
<p>Never loads for visitors or on the WordPress dashboard</p>
<h4>Installation</h4>
<p>Download codingbunny-css-inspector.zip</p>
<p>Unzip the file</p>
<p>Upload the codingbunny-css-inspector folder to /wp-content/plugins/</p>
<p>Activate CodingBunny CSS Inspector from the Plugins screen</p>
<h3>Usage</h3>
<p>Click “CSS Inspector” in the WordPress admin bar (frontend only)</p>
<p>Hover any element to preview its CSS in the sidebar</p>
<p>Click to lock the selection; press ESC to unlock or click ✕ to close</p>
<p>Toggle between full or compact selector paths</p>
<p>Use the copy buttons to instantly copy selectors and CSS blocks (with green confirmation)</p>


CodingBunny CSS Inspector

Inspect and copy the CSS of your site’s elements directly from the frontend—fast, simple, and DevTools-inspired.

Dynamic Inspector for Elementor – Performance Profiler & Debugger vs CodingBunny CSS Inspector