新媒體上傳器中的自定義圖像大小

我正在爲客戶端開發一個相對簡單的WordPress插件。它用於上傳/選擇圖像，然後將其保存（作爲圖像路徑）在選項變量中，並用作網站不同類別/頁面等的全背景圖像。新媒體上傳器中的自定義圖像大小

由於圖像是「牆壁性質「（即大）我添加了最大寬度爲1920像素（高度設置爲」自動「，即沒有圖像裁剪）的自定義圖像大小。該部分也可以工作，上傳時，圖像被調整到我自定義的1920像素寬度。

現在，對於上傳/選擇背景圖片，我使用新的媒體上傳器，它的工作原理除了所選圖像（路徑）始終用於原始上傳圖像，例如「我的背景-image.jpg」。

我的問題是：有沒有辦法讓用戶（或讓上傳者自動執行）選擇1920像素大小的原始圖像版本，例如「my-background-image-1920x1080.jpg」？

謝謝！

2014-02-07 dariohead

我設法解決了我的問題，有點不同於我第一次接觸它 - 但這是一個我更加高興的解決方案。

所以，當你使用新媒體上傳，你有一個jQuery代碼看起來是這樣的：; 'upload_image_button' jQuery的（文件）。就緒（函數（$）{VAR custom_uploader $（） .unbind（ '點擊'）點擊（函數（e）中{ e.preventDefault（）; formfieldID = jQuery的（本）.prev（）ATTR（「ID」）;

//If the uploader object has already been created, reopen the dialog 
    if (custom_uploader) { 
     custom_uploader.open(); 
     return; 
    } 

    //Extend the wp.media object 
    custom_uploader = wp.media.frames.file_frame = wp.media({ 
     title: 'Choose Image', 
     button: { 
      text: 'Choose Image' 
     }, 
     multiple: false 
    }); 

    //When a file is selected, grab the URL and set it as the text field's value 
    custom_uploader.on('select', function() { 
     attachment = custom_uploader.state().get('selection').first().toJSON(); 
     $('.' + formfieldID).val(attachment.url); 
    }); 

    //Open the uploader dialog 
    custom_uploader.open(); 
}); 
});

現在，注意獲取所選文件的url的代碼部分： $（'。'+ formfieldID）.val（attachment.url）;

這會得到ORIGINAL附件的（圖片）網址。因此，要獲得其他圖像大小，如縮略圖，大等，請使用以下代碼： $（'。'+ formfieldID）.val（attachment.sizes.thumbnail.url）;

最後，您甚至可以使用您自己的自定義圖像大小，如下所示： $（'。'+ formfieldID）.val（attachment.sizes.mysize.url）;

但是...我遇到了一個愚蠢但非常耗時的問題：不要給你的自定義圖像大小一個名稱，用負號分隔，比如「background-image」;因爲雖然Wordpress的一部分將工作（新的圖像大小將是可見的和可用的），jQuery的媒體上傳不會與它一起工作。

如果您需要分隔符，請改爲使用下劃線。「background_image」，它會正常工作！這可能是我的一個初學者的錯誤，但我認爲它可以節省一些時間！ :)

來源

2014-02-11 14:21:01 dariohead

$（'。'+ formfieldID）.val（attachment.sizes.thumbnail.url）; - 這裏的時間是什麼東西的佔位符？ –

新媒體上傳器中的自定義圖像大小

回答

相關問題