国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

首頁 > CMS教程 > WordPress > 正文

如何讓W(xué)ordPress支持上傳SVG格式圖片并顯示在媒體庫中

藏色散人
發(fā)布: 2020-12-09 13:53:05
轉(zhuǎn)載
2812人瀏覽過

下面由wordpress教程欄目給大家介紹讓wordpress支持上傳svg格式圖片并顯示在媒體庫中的方法,希望對需要的朋友有所幫助!

如何讓W(xué)ordPress支持上傳SVG格式圖片并顯示在媒體庫中

因SVG格式圖片特性,可能會被插入惡意代碼,網(wǎng)站容易被攻擊,所以出于安全考慮WordPress默認(rèn)不支持SVG格式圖片上傳,另外不像網(wǎng)上說SVG格式圖片有那么高的應(yīng)用價值,除了一些網(wǎng)頁上的小圖標(biāo)可以使用SVG圖片外,正常的彩色圖片,如果使用SVG格式毫無優(yōu)勢可言。不過有時還確實需要這個SVG圖片比如我主題的LOGO圖片,如果使用PNG圖片在手機上不是很清晰,采用SVG格式則無此問題。

如何讓W(xué)ordPress支持上傳SVG格式圖片?

可以將下代碼添加當(dāng)前主題函數(shù)模板functions.php中:

讓W(xué)ordPress支持上傳SVG,并只管理員有此權(quán)限

// 只允許管理員上傳SVG圖片
if (current_user_can( 'manage_options' )) {
add_filter('upload_mimes', function ($mimes) {
$mimes['svg'] = 'image/svg+xml';
return $mimes;
});
}
登錄后復(fù)制

媒體庫列表模式顯示SVG圖片

// 媒體庫列表模式顯示SVG圖片
add_action('admin_head', function () {
echo "<style>table.media .column-title .media-icon img[src*='.svg']{width: 100%;height: auto;}.components-responsive-wrapper__content[src*='.svg'] {position: relative;}</style>";
});
登錄后復(fù)制

網(wǎng)上有很多以上類似的代碼,但都不支持媒體庫網(wǎng)格模式顯示SVG圖片,下面的代碼可以實現(xiàn):

// 媒體庫網(wǎng)格模式顯示SVG圖片
function zm_display_svg_media($response, $attachment, $meta){
if($response['type'] === 'image' && $response['subtype'] === 'svg+xml' && class_exists('SimpleXMLElement')){
try {
$path = get_attached_file($attachment->ID);
if(@file_exists($path)){
$svg                = new SimpleXMLElement(@file_get_contents($path));
$src                = $response['url'];
$width              = (int) $svg['width'];
$height             = (int) $svg['height'];
$response['image']  = compact( 'src', 'width', 'height' );
$response['thumb']  = compact( 'src', 'width', 'height' );
 
$response['sizes']['full'] = array(
'height'        => $height,
'width'         => $width,
'url'           => $src,
'orientation'   => $height > $width ? 'portrait' : 'landscape',
);
}
}
catch(Exception $e){}
}
return $response;
}
add_filter('wp_prepare_attachment_for_js', 'zm_display_svg_media', 10, 3);
登錄后復(fù)制

另一個相對代碼較少的支持媒體庫網(wǎng)格模式顯示SVG圖片代碼,不過如果開啟調(diào)試模式會有錯誤提示,但不影響使用。

// 媒體庫網(wǎng)格模式顯示SVG圖片
function zm_svg_metadata($data, $post_id) {
$data = array(
'sizes' => array(
'large' => array(
'file' => pathinfo(wp_get_attachment_url($post_id), PATHINFO_BASENAME)
)
)
);
return $data;
}
add_filter('wp_get_attachment_metadata', 'zm_svg_metadata', 10, 2);
登錄后復(fù)制

至于加這個功能用于什么,那要看你用的主題是否有這個功能需要了,直接FTP上傳后獲取鏈接也一樣在網(wǎng)頁中使用。

嫌折騰代碼麻煩,可以使用下面的相關(guān)插件:

SVG Support
Enable SVG
Safe SVG(據(jù)說該插件可以檢測并去除SVG中的惡意代碼,與250+110有的一拼)
WP SVG images
Easy SVG Support
Enable SVG Uploads
......
登錄后復(fù)制

?

?

以上就是如何讓W(xué)ordPress支持上傳SVG格式圖片并顯示在媒體庫中的詳細(xì)內(nèi)容,更多請關(guān)注php中文網(wǎng)其它相關(guān)文章!

WPS零基礎(chǔ)入門到精通全套教程!
WPS零基礎(chǔ)入門到精通全套教程!

全網(wǎng)最新最細(xì)最實用WPS零基礎(chǔ)入門到精通全套教程!帶你真正掌握WPS辦公! 內(nèi)含Excel基礎(chǔ)操作、函數(shù)設(shè)計、數(shù)據(jù)透視表等

下載
相關(guān)標(biāo)簽:
來源:zmingcx網(wǎng)
本文內(nèi)容由網(wǎng)友自發(fā)貢獻,版權(quán)歸原作者所有,本站不承擔(dān)相應(yīng)法律責(zé)任。如您發(fā)現(xiàn)有涉嫌抄襲侵權(quán)的內(nèi)容,請聯(lián)系admin@php.cn
最新問題
開源免費商場系統(tǒng)廣告
最新下載
更多>
網(wǎng)站特效
網(wǎng)站源碼
網(wǎng)站素材
前端模板
關(guān)于我們 免責(zé)申明 意見反饋 講師合作 廣告合作 最新更新
php中文網(wǎng):公益在線php培訓(xùn),幫助PHP學(xué)習(xí)者快速成長!
關(guān)注服務(wù)號 技術(shù)交流群
PHP中文網(wǎng)訂閱號
每天精選資源文章推送
PHP中文網(wǎng)APP
隨時隨地碎片化學(xué)習(xí)
PHP中文網(wǎng)抖音號
發(fā)現(xiàn)有趣的

Copyright 2014-2025 http://m.miracleart.cn/ All Rights Reserved | php.cn | 湘ICP備2023035733號