custom taxonomy image option in admin panel

1you want to upload image so we create a js file and write some code in functions.php.
2
3But first we create custom upload meta field.
4
5In your function.php or where you write a code for register custom taxonomy and write this code:
6
7First we create custom meta term field
8
9add_action('product_categories_add_form_fields', 'add_term_image', 10, 2);
10function add_term_image($taxonomy){
11    ?>
12    <div class="form-field term-group">
13        <label for="">Upload and Image</label>
14        <input type="text" name="txt_upload_image" id="txt_upload_image" value="" style="width: 77%">
15        <input type="button" id="upload_image_btn" class="button" value="Upload an Image" />
16    </div>
17    <?php
18}
19Write your custom taxonomy before _add_form_fields in add_action() Like I write above"product_categories"_add_form_fields
20
21Then we save meta term value
22
23<?php
24add_action('created_product_categories', 'save_term_image', 10, 2);
25function save_term_image($term_id, $tt_id) {
26    if (isset($_POST['txt_upload_image']) && '' !== $_POST['txt_upload_image']){
27        $group = '#' . sanitize_title($_POST['txt_upload_image']);
28        add_term_meta($term_id, 'term_image', $group, true);
29    }
30}
31?>
32Same as above write your taxonomy name after created_ in add_action Like created_product_categories
33
34Now we create meta term field for edit
35
36add_action('product_categories_edit_form_fields', 'edit_image_upload', 10, 2);
37function edit_image_upload($term, $taxonomy) {
38    // get current group
39    $txt_upload_image = get_term_meta($term->term_id, 'term_image', true);
40?>
41    <div class="form-field term-group">
42        <label for="">Upload and Image</label>
43        <input type="text" name="txt_upload_image" id="txt_upload_image" value="<?php echo $txt_upload_image ?>" style="width: 77%">
44        <input type="button" id="upload_image_btn" class="button" value="Upload an Image" />
45    </div>
46<?php
47}
48Now save the edited value
49
50add_action('edited_product_categories', 'update_image_upload', 10, 2);
51function update_image_upload($term_id, $tt_id) {
52    if (isset($_POST['txt_upload_image']) && '' !== $_POST['txt_upload_image']){
53        $group = '#' . sanitize_title($_POST['txt_upload_image']);
54        update_term_meta($term_id, 'term_image', $group);
55    }
56}
57Now we Move to **JS File for WordPress Media Uploader**
58
59media-uploader.js
60
61jQuery(document).ready(function($){
62
63    // Instantiates the variable that holds the media library frame.
64    var meta_image_frame;
65
66    // Runs when the image button is clicked.
67    $('#upload_image_btn').click(function(e){
68
69        // Prevents the default action from occuring.
70        e.preventDefault();
71
72        // If the frame already exists, re-open it.
73        if ( meta_image_frame ) {
74            meta_image_frame.open();
75            return;
76        }
77
78        // Sets up the media library frame
79        meta_image_frame = wp.media.frames.meta_image_frame = wp.media({
80            title: meta_image.title,
81            button: { text:  meta_image.button },
82            library: { type: 'image' }
83        });
84
85        // Runs when an image is selected.
86        meta_image_frame.on('select', function(){
87
88            // Grabs the attachment selection and creates a JSON representation of the model.
89            var media_attachment = meta_image_frame.state().get('selection').first().toJSON();
90
91            // Sends the attachment URL to our custom image input field.
92            $('#txt_upload_image').val(media_attachment.url);
93        });
94
95        // Opens the media library frame.
96        meta_image_frame.open();
97    });
98
99});