WordPress 刪除影像和字幕維度屬性

問題描述

這個問題是從 this discussion 中刪除影像中的維度屬性的分支。該執行緒上提供的解決方案程式碼工作得非常好，除了它有不利的副作用，任何快捷方式從影像中分條。

經過幾個小時的挖掘核心程式碼，我發現了這個原因。 wpeditimage TinyMCE 外掛，負責在短碼和 img 標籤中新增短碼檢查寬度屬性。如果沒有找到它們，它只會刪除標題。既然，這是在 TinyMCE 編輯器中的「在飛」中完成的，我無法想到任何型別的 WordPress 過濾器可以解決這個問題。我很高興被證明是錯誤的。 🙂

作為最後的註釋，我的臨時解決方案是使用以下 jQuery 來剝離客戶端的所有違規標籤。這與 img_caption_shortcode 上的一個過濾器結合使用，以防止在那裡使用寬度樣式，似乎做了這個工作。這不漂亮，但現在是一個 band-aid 。任何人有更好的主意？

// Strip width and height attributes from img, video, and object in the main article so we can have fluid images
var $fluid_items = $('.main-article-wrapper').find('img,video,object');
$fluid_items.removeAttr('width');
$fluid_items.removeAttr('height');

最佳解決方案

這可能不是您確切的答案，但我認為我只是找到了一個很好的解決方法。

我從 twenty-eleven 主題 CSS(誰是整齊地響應的 imho) 採取以下程式碼：

/* Images */
.entry-content img,
.comment-content img,
.widget img {
    max-width: 97.5%; /* Fluid images for posts, comments, and widgets */
}
img[class*="align"],
img[class*="wp-image-"] {
    height: auto; /* Make sure images with WordPress-added height and width >attributes are scaled correctly */
}
img.size-full {
    max-width: 97.5%;
    width: auto; /* Prevent stretching of full-size images with height and >>width attributes in IE8 */
}

這是令所有影像響應 (至少嵌入在內容中的…) 現在我有響應影像，但是當使用標題時，我仍然有同樣的問題，這是因為 tinyMCE 新增一個樣式屬性到具有影像寬度的字幕容器。要解決這一切，我必須做的是將其新增到我的 CSS：

            .wp-caption { max-width: 100%; }

完成！對我來說很好，雖然它可能不適用於特色圖片。

我希望這有助於某人:-)

參考文獻

Removing Image and Caption Dimension Attributes

注：本文內容整合自 Google/Baidu/Bing 輔助翻譯的英文資料結果。如果您對結果不滿意，可以加入我們改善翻譯效果：薇曉朵技術論壇。

WordPress 刪除影像和字幕維度屬性