在标签部分添加图片上传-WordPress插件开发

我正在开发一个WordPress plugin, 我想增加一个file 字段输入到tag 部分查看屏幕截图：https://prnt.sc/22vkf1o

我已成功添加该字段，但无法保存它。此外，图像未出现在Media.

以下是我尝试的代码：

public function __construct() {
    add_action( \'post_tag_add_form_fields\', array( $this, \'eg360_add_tags\' ) );
    add_action( \'post_tag_edit_form_fields\', array( $this, \'eg360_edit_term_tags\' ), 10, 2 );
    add_action( \'created_post_tag\', array( $this, \'eg360_save_tags\' ) );
    add_action( \'edited_post_tag\', array( $this, \'eg360_save_tags\' ) );
}

// Adding the input file field to tag section
public function eg360_add_tags( $taxonomy ) {
    ?>
    <div class="form-field">
        <label for="eg360-featured-image"><?php _e( \'Featured image\', EG360_TEXT_DOMAIN ) ?></label>
        <input type="file" name="eg360_featured_image" id="eg360-featured-image"/>
        <p><?php _e( \'Add featured image\', EG360_TEXT_DOMAIN ) ?></p>
    </div>
    <?php
}

// Adding the input file field to the edit tag section
public function eg360_edit_term_tags( $term, $taxonomy ) {
    ?>
    <tr class="form-field">
        <th>
            <label for="eg360-featured-image"><?php _e( \'Featured image\', EG360_TEXT_DOMAIN ) ?></label>
        </th>
        <td>
            <input name="eg360_featured_image" id="eg360-featured-image" type="file"/>
            <p class="description"><?php _e( \'Add featured image\', EG360_TEXT_DOMAIN ) ?></p>
        </td>
    </tr>
    <?php
}

// Save the field
public function eg360_save_tags( $term_id ) {
    update_term_meta(
        $term_id,
        \'eg360_featured_image\',
        sanitize_text_field( $_POST[\'eg360_featured_image\'] )
    );
}

此外，上述代码适用于除file 输入字段。

任何帮助都将不胜感激。

<label><?php _e( \'Featured Image\', EG360_TEXT_DOMAIN ); ?></label> <div id="eg360_tax_image" style="float: left; margin-right: 10px;"> <img src="<?php echo esc_url( eg360_placeholder_image() ); ?>" width="60px" height="60px"/> </div> <div style="line-height: 60px;"> <input type="hidden" id="eg360_tax_image_id" name="eg360_tax_image_id"/> <button type="button" class="upload_image_button button"><?php _e( \'Upload/Add image\', EG360_TEXT_DOMAIN ); ?></button> <button type="button" class="remove_image_button button"><?php _e( \'Remove image\', EG360_TEXT_DOMAIN ); ?></button> </div>

jQuery(document).ready(function ($) { if (!$(\'#product_cat_thumbnail_id\').val()) { $(\'.remove_image_button\').hide(); } var file_frame; $(\'body\').on(\'click\', \'.upload_image_button\', function (event) { event.preventDefault(); if (file_frame) { file_frame.open(); return; } file_frame = wp.media.frames.downloadable_file = wp.media({ title: \'<?php _e( \'Choose a Fetured Image\', EG360_TEXT_DOMAIN ); ?>\', button: { text: \'<?php _e( \'Use as Fetured Image\', EG360_TEXT_DOMAIN ); ?>\' }, multiple: false }); file_frame.on(\'select\', function () { var attachment = file_frame.state().get(\'selection\').first().toJSON(); var attachment_thumbnail = attachment.sizes.thumbnail || attachment.sizes.full; $(\'#eg360_tax_image_id\').val(attachment.id); $(\'#eg360_tax_image\').find(\'img\').attr(\'src\', attachment_thumbnail.url); $(\'.remove_image_button\').show(); $(\'.upload_image_button\').hide(); }); file_frame.open(); }); $(\'body\').on(\'click\', \'.remove_image_button\', function () { $(\'#eg360_tax_image\').find(\'img\').attr(\'src\', \'<?php echo esc_js( eg360_placeholder_image() ); ?>\'); $(\'#eg360_tax_image_id\').val(\'\'); $(\'.remove_image_button\').hide(); $(\'.upload_image_button\').show(); return false; }); $(\'body\').ajaxComplete(function (event, request, options) { if (request && 4 === request.readyState && 200 === request.status && options.data && 0 <= options.data.indexOf(\'action=add-tag\')) { var res = wpAjax.parseAjaxResponse(request.responseXML, \'ajax-response\'); if (!res || res.errors) { return; } $(\'#eg360_tax_image\').find(\'img\').attr(\'src\', \'<?php echo esc_js( eg360_placeholder_image() ); ?>\'); $(\'#eg360_tax_image_id\').val(\'\'); return; } }); });

小码农CODE

相关推荐

如何在带命名空间的unctions.php文件中定义和注册短码函数？