सामने के छोर से पोस्ट थंबनेल अपलोड करें


9

हम चाहते हैं कि उपयोगकर्ताओं को पोस्ट संपादित करते समय पोस्ट थंबनेल अपलोड करने में सक्षम होना चाहिए। यह कैसे किया जाएगा। मुझे लगता है कि यह वर्डप्रेस के अजाक्स कार्यों का उपयोग करेगा।

कोई विचार,

अनोखा

जवाबों:


25

अजाक्स में फाइलें अपलोड करना थोड़ा मुश्किल है क्योंकि ब्राउजर की XMLHttpRequest ऑब्जेक्ट का उपयोग करके फाइलें अपलोड करना संभव नहीं है, इसलिए आपको किसी तरह के अजाक्स अपलोड प्लगइन का उपयोग करने की आवश्यकता है और सबसे आसान JQuery फॉर्म प्लग इन होगा जो चीजों को बहुत आसान बनाता है और यह बहुत आसान है वर्डप्रेस में शामिल। तो इसका उपयोग करने के लिए आपको इसे संलग्न करना होगा:

add_action('wp_print_scripts','include_jquery_form_plugin');
function include_jquery_form_plugin(){
    if (is_page('12')){ // only add this on the page that allows the upload
        wp_enqueue_script( 'jquery' );
        wp_enqueue_script( 'jquery-form',array('jquery'),false,true ); 
    }
}

उस पृष्ठ पर उदाहरण के लिए JQuery फॉर्म प्लगइन को कॉल करने के लिए अपना अपलोड फॉर्म और JQuery जोड़ें:

<form id="thumbnail_upload" method="post" action="#" enctype="multipart/form-data" >
  <input type="file" name="thumbnail" id="thumbnail">
  <input type='hidden' value='<?php wp_create_nonce( 'upload_thumb' ); ?>' name='_nonce' />
  <input type="hidden" name="post_id" id="post_id" value="POSTID">
  <input type="hidden" name="action" id="action" value="my_upload_action">
  <input id="submit-ajax" name="submit-ajax" type="submit" value="upload">
<form>
<div id="output1"></div>
<script>
$(document).ready(function() { 
    var options = { 
        target:        '#output1',      // target element(s) to be updated with server response 
        beforeSubmit:  showRequest,     // pre-submit callback 
        success:       showResponse,    // post-submit callback 
        url:    ajaxurl                 // since 2.8 ajaxurl is always defined in the admin header and points to admin-ajax.php     
    }; 

    // bind form using 'ajaxForm' 
    $('#thumbnail_upload').ajaxForm(options); 
});
function showRequest(formData, jqForm, options) {
//do extra stuff before submit like disable the submit button
$('#output1').html('Sending...');
$('#submit-ajax').attr("disabled", "disabled");
}
function showResponse(responseText, statusText, xhr, $form)  {
//do extra stuff after submit
}
</script>

आपको वास्तविक पोस्ट आईडी के साथ POSTID को अपडेट करना होगा। फिर फ़ाइल अपलोड को स्वीकार करने और पोस्ट थंबनेल को अपडेट करने के लिए अजाक्स फ़ंक्शन बनाएं

//hook the Ajax call
//for logged-in users
add_action('wp_ajax_my_upload_action', 'my_ajax_upload');
//for none logged-in users
add_action('wp_ajax_nopriv_my_upload_action', 'my_ajax_upload');

function my_ajax_upload(){
//simple Security check
    check_ajax_referer('upload_thumb');

//get POST data
    $post_id = $_POST['post_id'];

//require the needed files
    require_once(ABSPATH . "wp-admin" . '/includes/image.php');
    require_once(ABSPATH . "wp-admin" . '/includes/file.php');
    require_once(ABSPATH . "wp-admin" . '/includes/media.php');
//then loop over the files that were sent and store them using  media_handle_upload();
    if ($_FILES) {
        foreach ($_FILES as $file => $array) {
            if ($_FILES[$file]['error'] !== UPLOAD_ERR_OK) {
                echo "upload error : " . $_FILES[$file]['error'];
                die();
            }
            $attach_id = media_handle_upload( $file, $post_id );
        }   
    }
//and if you want to set that image as Post  then use:
  update_post_meta($post_id,'_thumbnail_id',$attach_id);
  echo "uploaded the new Thumbnail";
  die();
} 

उम्मीद है की यह मदद करेगा


ये जबरदस्त है। बस कुछ प्रश्नों का। यानी सब कुछ जाने की जरूरत नहीं है। स्पष्ट रूप से फॉर्म प्रश्न में पृष्ठ पर जाता है और वह पोस्ट आईडी होगी जिसके साथ उपयोग करना है। पहला ऐड एक्शन है कि हेड एरिया या फंक्शन्स के लिए। और अंतिम AJAX ब्लॉक के साथ शुरू // हुक AJAX कॉल। वह बिट कहां जाता है। बहुत धन्यवाद।
रॉबिन I नाइट

कोड के पहले और आखिरी स्निपेट को आपके फ़ंक्शंस में कहीं भी रखा जा सकता है। आपके द्वारा अपलोड किए गए फ़ॉर्म को प्रदर्शित करने की इच्छा रखने वाले पेज पर दूसरी स्निपेट की आवश्यकता होती है, आप आसान बनाने के लिए शोर्ट के लिए दूसरा स्निपेट भी बदल देते हैं। ।
बैनटर्नेट

इस बारे में मुझे क्या नहीं मिलता है कि कैसे फॉर्म my_ajax_upload () का उपयोग करना जानता है? कि अजाक्स कॉल में शामिल नहीं होना चाहिए? मैं यह पूछता हूं क्योंकि मेरे पास पोस्टों का एक लूप है जिसे मैं संपादित करने की अनुमति देता हूं और उन्हें कुछ पोस्टों को संसाधित करने के लिए विभिन्न कार्यों की आवश्यकता होती है।
पोल्क्स खफरा

प्रपत्र my_ajax_upload का उपयोग करना जानता है क्योंकि इसका कार्य मान कार्य add_action(...करने के लिए झुका हुआ ( ) है my_ajax_upload
18

WP में हाल ही में कुछ भी बदल गया है जो इस कार्यक्षमता को प्रभावित करेगा? किसी कारण से मेरे पास मेरे पास कोई $_POSTडेटा नहीं है my_ajax_upload, भले ही जेएस कॉलबैक showRequestमें formDataपरम में वह सब कुछ है जिसकी मुझे उम्मीद है।
ड्रॉज
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.