backend_prod_content

Allows adding of custom content to individual tabs of the new product editor. Does not affect the sidebar. In JavaScript code, you can register event handlers for elements located within the container with the '.js-page-content' selector, which contains the main content of the product editor except for the sidebar. For example, you may register handlers for the wa_before_save, wa_save, and wa_after_save events.

Shop-Script

Input (passed by reference)

$params['product'] shopProduct Product properties object.
$params['content_id'] string Identifier of the current product editor tab.
… your plugin code …

Output

{$backend_prod_content.top}

Custom content at the top of the product editor page.

{$backend_prod_content.bottom}

Custom content at the bottom of the product editor page. Not used for in some product editor tabs.

{$backend_prod_content.form_top}

Custom content at the top of the product fields form. Not used for in some product editor tabs.

{$backend_prod_content.bottom_top}

Custom content at the bottom of the form.

Shop-Script

Plugin code example

PHP

public function backendProdContent($params)
{
    $content_id = $params['content_id'];

    if ($content_id == 'general' || $content_id == 'sku') {
        $field_title = _wp('My plugin’s field');
        $field_hint = _wp('My plugin’s field hint');

        $custom_field_html = <<<HTML
            <div class="wa-field">
                <div class="name">
                    {$field_title}
                    <span class="wa-tooltip right" data-title="{$field_hint}">
                        <i class="fas fa-question-circle s-icon gray"></i>
                    </span>
                </div>
                <div class="value">
                    <input type="text" name="myplugin[some_field]" value="">
                </div>
            </div>
HTML;

        return [
            // 'top' => '',
            // 'bottom' => '',
            // 'form_top' => '',
            'form_bottom' => $custom_field_html,
        ];
    }
}