Added edit with elementor option #213
Conversation
WalkthroughThe update adds Elementor integration to the weDocs plugin by enabling Elementor support for the 'docs' post type, introducing new Elementor widgets (Search and DocsGrid), registering associated scripts and styles, and conditionally initializing the Elementor integration when Elementor is loaded. It also adds frontend JavaScript and CSS for these widgets. Changes
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
✅ Files skipped from review due to trivial changes (1)
✨ Finishing Touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
includes/Post_Types.php (1)
56-56: Allow customization of CPT supports
Extract thesupportsarray into a variable and expose it via a filter so other plugins or themes can adjust supported features without modifying core code.Example diff:
+ // Allow filtering of supported features + $supports = apply_filters( + 'wedocs_doc_supports', + array( 'title', 'editor', 'thumbnail', 'revisions', 'page-attributes', 'comments', 'elementor' ) + ); - 'supports' => array( 'title', 'editor', 'thumbnail', 'revisions', 'page-attributes', 'comments', 'elementor' ), + 'supports' => $supports,
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
includes/Post_Types.php(1 hunks)
🔇 Additional comments (2)
includes/Post_Types.php (2)
56-56: Approve adding Elementor support
This change correctly extends the custom post type to support Elementor’s editor mode.
56-56: Verify Elementor plugin integration
Ensure this support flag is only applied when Elementor is active to avoid errors if the plugin is not installed. Consider checkingclass_exists( 'Elementor\Plugin' )or adjusting the hook priority oninitto run after Elementor’s initialization.
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Nitpick comments (8)
includes/Elementor.php (1)
38-42: Remove redundant Elementor loaded check.The check for
did_action('elementor/loaded')is unnecessary here because this method is called from theelementor/widgets/widgets_registeredaction, which only fires after Elementor is already loaded.public function register_widgets() { - // Check if Elementor is loaded - if ( ! did_action( 'elementor/loaded' ) ) { - return; - } - // Include widget files require_once WEDOCS_PATH . '/includes/Elementor/Widgets/Search.php';includes/Elementor/Widgets/DocsGrid.php (1)
95-106: Consider performance impact of fetching all docs.Fetching all docs without pagination could cause performance issues if there are many documents. Consider implementing lazy loading or AJAX-based search for better scalability.
Would you like me to help implement an AJAX-based solution for loading docs dynamically?
includes/Elementor/Widgets/Search.php (6)
67-77: Use consistent naming convention for control IDs.The control name
hideSearchuses camelCase while most Elementor widgets use snake_case for control IDs. This inconsistency could cause confusion.$this->add_control( - 'hideSearch', + 'hide_search', [ 'label' => __( 'Hide Search', 'wedocs' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => __( 'Yes', 'wedocs' ), 'label_off' => __( 'No', 'wedocs' ), 'return_value' => 'yes', 'default' => '', ] );
108-108: Reconsider the default alignment value.The default alignment is set to 'right', which might not be intuitive for most users who expect search forms to be left-aligned or centered.
-'default' => 'right', +'default' => 'center',
367-369: Update variable name to match the corrected control ID.If the control ID is changed to
hide_searchas suggested above, this reference needs to be updated accordingly.-if ( $settings['hideSearch'] === 'yes' ) { +if ( $settings['hide_search'] === 'yes' ) {
385-385: Consider making the post type configurable.The post type is hard-coded as "docs". Consider making this configurable through widget settings to improve reusability.
Add a control in the content section:
$this->add_control( 'post_type', [ 'label' => __( 'Post Type', 'wedocs' ), 'type' => Controls_Manager::TEXT, 'default' => 'docs', 'description' => __( 'The post type to search within', 'wedocs' ), ] );Then update the hidden input:
-<input type="hidden" name="post_type" value="docs" /> +<input type="hidden" name="post_type" value="<?php echo esc_attr( $settings['post_type'] ); ?>" />
404-404: Update content template to match render method changes.The content template should be updated to reflect the control name change and include the missing post_type input for consistency.
-<# if ( settings.hideSearch !== 'yes' ) { #> +<# if ( settings.hide_search !== 'yes' ) { #>And add the missing hidden input:
<input type="search" class="wedocs-search-input" placeholder="{{{ settings.placeholder }}}" title="{{{ settings.placeholder }}}" /> + <input type="hidden" name="post_type" value="docs" />Also applies to: 411-411
277-277: Fix potential CSS selector conflict.The SVG styling uses both
fillandstrokeproperties, but the SVG paths only definestroke. This could cause styling inconsistencies.'selectors' => [ - '{{WRAPPER}} .wedocs-search-btn svg' => 'fill: {{VALUE}};', + '{{WRAPPER}} .wedocs-search-btn svg path' => 'stroke: {{VALUE}};', ],'selectors' => [ - '{{WRAPPER}} .wedocs-search-btn:hover svg' => 'fill: {{VALUE}};', + '{{WRAPPER}} .wedocs-search-btn:hover svg path' => 'stroke: {{VALUE}};', ],Also applies to: 313-313
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
assets/css/elementor-widgets.css(1 hunks)assets/js/elementor-widgets.js(1 hunks)includes/Elementor.php(1 hunks)includes/Elementor/Widgets/DocsGrid.php(1 hunks)includes/Elementor/Widgets/Search.php(1 hunks)wedocs.php(1 hunks)
✅ Files skipped from review due to trivial changes (1)
- assets/css/elementor-widgets.css
🧰 Additional context used
🧬 Code Graph Analysis (3)
assets/js/elementor-widgets.js (1)
src/utils/menuFix.js (1)
$(2-2)
wedocs.php (1)
includes/Elementor.php (1)
Elementor(8-77)
includes/Elementor.php (3)
wedocs.php (1)
WeDocs(56-306)includes/Elementor/Widgets/Search.php (1)
Search(16-426)includes/Elementor/Widgets/DocsGrid.php (1)
DocsGrid(13-570)
🪛 Biome (1.9.4)
assets/js/elementor-widgets.js
[error] 2-2: Redundant use strict directive.
The entire contents of JavaScript modules are automatically in strict mode, with no statement needed to initiate it.
Safe fix: Remove the redundant use strict directive.
(lint/suspicious/noRedundantUseStrict)
🔇 Additional comments (5)
wedocs.php (1)
227-231: LGTM! Proper conditional initialization of Elementor integration.The implementation correctly checks if Elementor is loaded before initializing the integration, following the established pattern of storing instances in the container.
assets/js/elementor-widgets.js (1)
1-62: Well-structured frontend widget interactions!The implementation properly handles search validation and section toggling, with appropriate initialization for both regular page loads and Elementor preview mode. The use of event delegation ensures dynamic content works correctly.
🧰 Tools
🪛 Biome (1.9.4)
[error] 2-2: Redundant use strict directive.
The entire contents of JavaScript modules are automatically in strict mode, with no statement needed to initiate it.
Safe fix: Remove the redundant use strict directive.(lint/suspicious/noRedundantUseStrict)
includes/Elementor.php (1)
13-20: Excellent integration structure and asset registration!The class properly hooks into Elementor's lifecycle events and correctly registers scripts and styles with appropriate dependencies and versioning.
Also applies to: 53-76
includes/Elementor/Widgets/DocsGrid.php (2)
53-481: Comprehensive and well-organized widget controls!The widget provides excellent customization options with proper responsive controls, sensible defaults, and clear organization into content and style sections.
486-542:Details
✅ Verification successful
Verify render function returns HTML string.
The code properly checks if
render_wedocs_docs_gridexists before calling it. Please ensure this function returns an HTML string rather than directly echoing output for consistency.Run the following script to verify the render function implementation:
🏁 Script executed:
#!/bin/bash # Description: Check the implementation of render_wedocs_docs_grid function # Search for the function definition ast-grep --pattern 'function render_wedocs_docs_grid($_) { $$$ }' # Also check in the mentioned render.php file cat assets/build/blocks/DocsGrid/render.phpLength of output: 63113
No action required:
render_wedocs_docs_gridreturns a complete HTML string.Verified that the function wraps its output in
ob_start()/ob_get_clean()and returns the buffered content rather than echoing directly.
— File:src/blocks/DocsGrid/render.php(and its build counterpartassets/build/blocks/DocsGrid/render.php)
— Ends withreturn ob_get_clean();confirming it returns the HTML.
| <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> | ||
| <path d="M7.25 12.5C10.1495 12.5 12.5 10.1495 12.5 7.25C12.5 4.35051 10.1495 2 7.25 2C4.35051 2 2 4.35051 2 7.25C2 10.1495 4.35051 12.5 7.25 12.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> | ||
| <path d="M11.0625 11.0625L14 14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> | ||
| </svg> | ||
| </button> |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Extract SVG icon to avoid duplication.
The same SVG icon is duplicated between the render and content_template methods. Consider extracting it to a separate method to follow DRY principles.
Add a private method:
private function get_search_icon_svg() {
return '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7.25 12.5C10.1495 12.5 12.5 10.1495 12.5 7.25C12.5 4.35051 10.1495 2 7.25 2C4.35051 2 2 4.35051 2 7.25C2 10.1495 4.35051 12.5 7.25 12.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M11.0625 11.0625L14 14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>';
}Then use it in both methods:
-<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
- <path d="M7.25 12.5C10.1495 12.5 12.5 10.1495 12.5 7.25C12.5 4.35051 10.1495 2 7.25 2C4.35051 2 2 4.35051 2 7.25C2 10.1495 4.35051 12.5 7.25 12.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
- <path d="M11.0625 11.0625L14 14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+<?php echo $this->get_search_icon_svg(); ?>Also applies to: 415-419
🤖 Prompt for AI Agents
In includes/Elementor/Widgets/Search.php around lines 387 to 391 and also lines
415 to 419, the SVG icon is duplicated in the render and content_template
methods. To fix this, create a private method named get_search_icon_svg that
returns the SVG markup as a string. Then replace the duplicated SVG code in both
methods by calling this new private method to adhere to DRY principles and avoid
duplication.
| <form role="search" method="get" action="<?php echo esc_url( home_url( '/' ) ); ?>"> | ||
| <div class="wedocs-search-container"> | ||
| <input | ||
| type="search" | ||
| class="wedocs-search-input" | ||
| placeholder="<?php echo esc_attr( $settings['placeholder'] ); ?>" | ||
| value="<?php echo get_search_query(); ?>" | ||
| name="s" | ||
| title="<?php echo esc_attr( $settings['placeholder'] ); ?>" | ||
| /> | ||
| <input type="hidden" name="post_type" value="docs" /> | ||
| <button type="submit" class="wedocs-search-btn"> | ||
| <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> | ||
| <path d="M7.25 12.5C10.1495 12.5 12.5 10.1495 12.5 7.25C12.5 4.35051 10.1495 2 7.25 2C4.35051 2 2 4.35051 2 7.25C2 10.1495 4.35051 12.5 7.25 12.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> | ||
| <path d="M11.0625 11.0625L14 14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> | ||
| </svg> | ||
| </button> | ||
| </div> | ||
| </form> |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Add input validation and improve accessibility.
The search form lacks proper validation and accessibility attributes that would improve user experience and meet WCAG guidelines.
<form role="search" method="get" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<div class="wedocs-search-container">
<input
type="search"
class="wedocs-search-input"
placeholder="<?php echo esc_attr( $settings['placeholder'] ); ?>"
value="<?php echo get_search_query(); ?>"
name="s"
title="<?php echo esc_attr( $settings['placeholder'] ); ?>"
+ aria-label="<?php echo esc_attr( $settings['placeholder'] ); ?>"
+ required
+ minlength="2"
+ maxlength="100"
/>
<input type="hidden" name="post_type" value="docs" />
- <button type="submit" class="wedocs-search-btn">
+ <button type="submit" class="wedocs-search-btn" aria-label="<?php esc_attr_e( 'Search', 'wedocs' ); ?>">📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <form role="search" method="get" action="<?php echo esc_url( home_url( '/' ) ); ?>"> | |
| <div class="wedocs-search-container"> | |
| <input | |
| type="search" | |
| class="wedocs-search-input" | |
| placeholder="<?php echo esc_attr( $settings['placeholder'] ); ?>" | |
| value="<?php echo get_search_query(); ?>" | |
| name="s" | |
| title="<?php echo esc_attr( $settings['placeholder'] ); ?>" | |
| /> | |
| <input type="hidden" name="post_type" value="docs" /> | |
| <button type="submit" class="wedocs-search-btn"> | |
| <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> | |
| <path d="M7.25 12.5C10.1495 12.5 12.5 10.1495 12.5 7.25C12.5 4.35051 10.1495 2 7.25 2C4.35051 2 2 4.35051 2 7.25C2 10.1495 4.35051 12.5 7.25 12.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> | |
| <path d="M11.0625 11.0625L14 14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> | |
| </svg> | |
| </button> | |
| </div> | |
| </form> | |
| <form role="search" method="get" action="<?php echo esc_url( home_url( '/' ) ); ?>"> | |
| <div class="wedocs-search-container"> | |
| <input | |
| type="search" | |
| class="wedocs-search-input" | |
| placeholder="<?php echo esc_attr( $settings['placeholder'] ); ?>" | |
| value="<?php echo get_search_query(); ?>" | |
| name="s" | |
| title="<?php echo esc_attr( $settings['placeholder'] ); ?>" | |
| aria-label="<?php echo esc_attr( $settings['placeholder'] ); ?>" | |
| required | |
| minlength="2" | |
| maxlength="100" | |
| /> | |
| <input type="hidden" name="post_type" value="docs" /> | |
| <button type="submit" class="wedocs-search-btn" aria-label="<?php esc_attr_e( 'Search', 'wedocs' ); ?>"> | |
| <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> | |
| <path d="M7.25 12.5C10.1495 12.5 12.5 10.1495 12.5 7.25C12.5 4.35051 10.1495 2 7.25 2C4.35051 2 2 4.35051 2 7.25C2 10.1495 4.35051 12.5 7.25 12.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> | |
| <path d="M11.0625 11.0625L14 14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/> | |
| </svg> | |
| </button> | |
| </div> | |
| </form> |
🤖 Prompt for AI Agents
In includes/Elementor/Widgets/Search.php around lines 375 to 393, the search
form lacks input validation and accessibility attributes. Add the 'required'
attribute to the search input to enforce validation. Include 'aria-label' or
'aria-labelledby' attributes on the form elements and the submit button to
improve screen reader support. Ensure the placeholder text is descriptive and
consider adding a visually hidden label for better accessibility compliance.
| protected function register_controls() { | ||
|
|
||
| // Content Section | ||
| $this->start_controls_section( | ||
| 'content_section', | ||
| [ | ||
| 'label' => __( 'Content', 'wedocs' ), | ||
| 'tab' => Controls_Manager::TAB_CONTENT, | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_control( | ||
| 'hideSearch', | ||
| [ | ||
| 'label' => __( 'Hide Search', 'wedocs' ), | ||
| 'type' => Controls_Manager::SWITCHER, | ||
| 'label_on' => __( 'Yes', 'wedocs' ), | ||
| 'label_off' => __( 'No', 'wedocs' ), | ||
| 'return_value' => 'yes', | ||
| 'default' => '', | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_control( | ||
| 'placeholder', | ||
| [ | ||
| 'label' => __( 'Placeholder Text', 'wedocs' ), | ||
| 'type' => Controls_Manager::TEXT, | ||
| 'default' => __( 'Search for a topic or question', 'wedocs' ), | ||
| 'placeholder' => __( 'Enter placeholder text', 'wedocs' ), | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_control( | ||
| 'alignment', | ||
| [ | ||
| 'label' => __( 'Alignment', 'wedocs' ), | ||
| 'type' => Controls_Manager::CHOOSE, | ||
| 'options' => [ | ||
| 'left' => [ | ||
| 'title' => __( 'Left', 'wedocs' ), | ||
| 'icon' => 'eicon-text-align-left', | ||
| ], | ||
| 'center' => [ | ||
| 'title' => __( 'Center', 'wedocs' ), | ||
| 'icon' => 'eicon-text-align-center', | ||
| ], | ||
| 'right' => [ | ||
| 'title' => __( 'Right', 'wedocs' ), | ||
| 'icon' => 'eicon-text-align-right', | ||
| ], | ||
| ], | ||
| 'default' => 'right', | ||
| 'toggle' => true, | ||
| ] | ||
| ); | ||
|
|
||
| $this->end_controls_section(); | ||
|
|
||
| // Style Section - Search Box | ||
| $this->start_controls_section( | ||
| 'style_search_box', | ||
| [ | ||
| 'label' => __( 'Search Box', 'wedocs' ), | ||
| 'tab' => Controls_Manager::TAB_STYLE, | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_responsive_control( | ||
| 'searchWidth', | ||
| [ | ||
| 'label' => __( 'Width', 'wedocs' ), | ||
| 'type' => Controls_Manager::SLIDER, | ||
| 'size_units' => [ 'px', '%' ], | ||
| 'range' => [ | ||
| 'px' => [ | ||
| 'min' => 200, | ||
| 'max' => 1000, | ||
| 'step' => 5, | ||
| ], | ||
| '%' => [ | ||
| 'min' => 10, | ||
| 'max' => 100, | ||
| ], | ||
| ], | ||
| 'default' => [ | ||
| 'unit' => '%', | ||
| 'size' => 50, | ||
| ], | ||
| 'selectors' => [ | ||
| '{{WRAPPER}} .wedocs-search-wrap' => 'width: {{SIZE}}{{UNIT}};', | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_control( | ||
| 'bgColor', | ||
| [ | ||
| 'label' => __( 'Background Color', 'wedocs' ), | ||
| 'type' => Controls_Manager::COLOR, | ||
| 'default' => '#FFFFFF', | ||
| 'selectors' => [ | ||
| '{{WRAPPER}} .wedocs-search-input' => 'background-color: {{VALUE}};', | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_control( | ||
| 'hoverColor', | ||
| [ | ||
| 'label' => __( 'Hover Background Color', 'wedocs' ), | ||
| 'type' => Controls_Manager::COLOR, | ||
| 'default' => '#FFFFFF', | ||
| 'selectors' => [ | ||
| '{{WRAPPER}} .wedocs-search-input:hover' => 'background-color: {{VALUE}};', | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_responsive_control( | ||
| 'padding', | ||
| [ | ||
| 'label' => __( 'Padding', 'wedocs' ), | ||
| 'type' => Controls_Manager::DIMENSIONS, | ||
| 'size_units' => [ 'px', '%', 'em' ], | ||
| 'default' => [ | ||
| 'top' => 14, | ||
| 'right' => 22, | ||
| 'bottom' => 14, | ||
| 'left' => 22, | ||
| 'unit' => 'px', | ||
| ], | ||
| 'selectors' => [ | ||
| '{{WRAPPER}} .wedocs-search-input' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_responsive_control( | ||
| 'margin', | ||
| [ | ||
| 'label' => __( 'Margin', 'wedocs' ), | ||
| 'type' => Controls_Manager::DIMENSIONS, | ||
| 'size_units' => [ 'px', '%', 'em' ], | ||
| 'default' => [ | ||
| 'top' => 0, | ||
| 'right' => 0, | ||
| 'bottom' => 0, | ||
| 'left' => 0, | ||
| 'unit' => 'px', | ||
| ], | ||
| 'selectors' => [ | ||
| '{{WRAPPER}} .wedocs-search-wrap' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_group_control( | ||
| Group_Control_Border::get_type(), | ||
| [ | ||
| 'name' => 'border', | ||
| 'label' => __( 'Border', 'wedocs' ), | ||
| 'selector' => '{{WRAPPER}} .wedocs-search-input', | ||
| 'fields_options' => [ | ||
| 'border' => [ | ||
| 'default' => 'solid', | ||
| ], | ||
| 'width' => [ | ||
| 'default' => [ | ||
| 'top' => 1, | ||
| 'right' => 1, | ||
| 'bottom' => 1, | ||
| 'left' => 1, | ||
| ], | ||
| ], | ||
| 'color' => [ | ||
| 'default' => '#cccccc', | ||
| ], | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_control( | ||
| 'borderRadius', | ||
| [ | ||
| 'label' => __( 'Border Radius', 'wedocs' ), | ||
| 'type' => Controls_Manager::SLIDER, | ||
| 'range' => [ | ||
| 'px' => [ | ||
| 'min' => 0, | ||
| 'max' => 100, | ||
| 'step' => 1, | ||
| ], | ||
| ], | ||
| 'default' => [ | ||
| 'size' => 30, | ||
| ], | ||
| 'selectors' => [ | ||
| '{{WRAPPER}} .wedocs-search-input' => 'border-radius: {{SIZE}}{{UNIT}};', | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->end_controls_section(); | ||
|
|
||
| // Style Section - Search Button | ||
| $this->start_controls_section( | ||
| 'style_search_button', | ||
| [ | ||
| 'label' => __( 'Search Button', 'wedocs' ), | ||
| 'tab' => Controls_Manager::TAB_STYLE, | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_control( | ||
| 'iconColor', | ||
| [ | ||
| 'label' => __( 'Icon Color', 'wedocs' ), | ||
| 'type' => Controls_Manager::COLOR, | ||
| 'default' => '#FFFFFF', | ||
| 'selectors' => [ | ||
| '{{WRAPPER}} .wedocs-search-btn svg' => 'fill: {{VALUE}};', | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_control( | ||
| 'iconBgColor', | ||
| [ | ||
| 'label' => __( 'Background Color', 'wedocs' ), | ||
| 'type' => Controls_Manager::COLOR, | ||
| 'default' => '#3b82f6', | ||
| 'selectors' => [ | ||
| '{{WRAPPER}} .wedocs-search-btn' => 'background-color: {{VALUE}};', | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_control( | ||
| 'iconHoverColor', | ||
| [ | ||
| 'label' => __( 'Hover Background Color', 'wedocs' ), | ||
| 'type' => Controls_Manager::COLOR, | ||
| 'default' => '#2563eb', | ||
| 'selectors' => [ | ||
| '{{WRAPPER}} .wedocs-search-btn:hover' => 'background-color: {{VALUE}};', | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_control( | ||
| 'svgHoverColor', | ||
| [ | ||
| 'label' => __( 'Hover Icon Color', 'wedocs' ), | ||
| 'type' => Controls_Manager::COLOR, | ||
| 'default' => '#FFFFFF', | ||
| 'selectors' => [ | ||
| '{{WRAPPER}} .wedocs-search-btn:hover svg' => 'fill: {{VALUE}};', | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_responsive_control( | ||
| 'btnPadding', | ||
| [ | ||
| 'label' => __( 'Padding', 'wedocs' ), | ||
| 'type' => Controls_Manager::DIMENSIONS, | ||
| 'size_units' => [ 'px', '%', 'em' ], | ||
| 'default' => [ | ||
| 'top' => 24, | ||
| 'right' => 26, | ||
| 'bottom' => 24, | ||
| 'left' => 26, | ||
| 'unit' => 'px', | ||
| ], | ||
| 'selectors' => [ | ||
| '{{WRAPPER}} .wedocs-search-btn' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->add_control( | ||
| 'btnRadius', | ||
| [ | ||
| 'label' => __( 'Border Radius', 'wedocs' ), | ||
| 'type' => Controls_Manager::SLIDER, | ||
| 'range' => [ | ||
| 'px' => [ | ||
| 'min' => 0, | ||
| 'max' => 100, | ||
| 'step' => 1, | ||
| ], | ||
| ], | ||
| 'default' => [ | ||
| 'size' => 30, | ||
| ], | ||
| 'selectors' => [ | ||
| '{{WRAPPER}} .wedocs-search-btn' => 'border-radius: {{SIZE}}{{UNIT}};', | ||
| ], | ||
| ] | ||
| ); | ||
|
|
||
| $this->end_controls_section(); | ||
| } |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Consider refactoring this very long method for better maintainability.
The register_controls method is over 300 lines long, which makes it difficult to maintain and review. Consider breaking it into smaller, focused methods.
protected function register_controls() {
- // Content Section
- $this->start_controls_section(
- 'content_section',
- [
- 'label' => __( 'Content', 'wedocs' ),
- 'tab' => Controls_Manager::TAB_CONTENT,
- ]
- );
- // ... (all content controls)
- $this->end_controls_section();
-
- // Style Section - Search Box
- $this->start_controls_section(
- 'style_search_box',
- [
- 'label' => __( 'Search Box', 'wedocs' ),
- 'tab' => Controls_Manager::TAB_STYLE,
- ]
- );
- // ... (all search box style controls)
- $this->end_controls_section();
-
- // Style Section - Search Button
- $this->start_controls_section(
- 'style_search_button',
- [
- 'label' => __( 'Search Button', 'wedocs' ),
- 'tab' => Controls_Manager::TAB_STYLE,
- ]
- );
- // ... (all button style controls)
- $this->end_controls_section();
+ $this->register_content_controls();
+ $this->register_search_box_style_controls();
+ $this->register_search_button_style_controls();
}
private function register_content_controls() {
// Move content section controls here
}
private function register_search_box_style_controls() {
// Move search box style controls here
}
private function register_search_button_style_controls() {
// Move search button style controls here
}Committable suggestion skipped: line range outside the PR's diff.
🤖 Prompt for AI Agents
In includes/Elementor/Widgets/Search.php around lines 56 to 359, the
register_controls method is excessively long and hard to maintain. Refactor by
splitting this method into smaller, focused private methods, each handling a
specific section of controls such as content controls, style search box
controls, and style search button controls. Then call these smaller methods from
register_controls to keep it concise and improve readability.
Summary by CodeRabbit