外掛說明
使用 Safe SVG 外掛是在 WordPress 網站上開放 SVG 檔案上傳的最佳方式。
這個外掛能開放 WordPress 網站上傳 SVG 檔案的功能,並確保 SVG 檔案經過必要的處理,以避免觸發 SVG/XML 漏洞影響網站,同時也能讓使用者在媒體庫的各種檢視模式中預覽已上傳的 SVG 檔案。
目前功能
- 處理 SVG 檔案:不會允許未經處理的 SVG 檔案上傳,以避免觸發 WordPress 網站的安全性漏洞。
- 在媒體庫中檢視 SVG 檔案:不需要去回想哪個 SVG 檔案是哪天上傳的,這個外掛提供在 WordPress 媒體庫中預覽 SVG 檔案的功能。
功能開發藍圖
- SVGO 最佳化:使用者可以選擇透過我們提供的 SVGO 伺服器上傳 SVG 檔案,以節省網站儲存空間。
- 設定可上傳 SVG 檔案的使用者:設定指定使用者才能上傳 SVG 檔案,或開放全部使用者均可上傳。
開發這個外掛的想法源自 #24251 這個功能需求。
SVG 檔案的處理使用 https://github.com/darylldoyle/svg-sanitizer 所提供的函式庫。
適用於區塊編輯器
這個外掛提供 1 個可供 Gutenberg/區塊編輯器使用的區塊。
- Safe SVG Display the SVG icon
安裝方式
透過 WordPress 外掛目錄安裝,或下載安裝檔案後解壓縮,上傳解壓縮所得的資料夾及其全部檔案至 /wp-content/plugins/
目錄。
常見問題集
-
可以,這可以透過
svg_allowed_attributes
及svg_allowed_tags
篩選器完成。
這 2 個篩選器分別使用一個必須回傳值的引數。以下是範例程式碼:add_filter( 'svg_allowed_attributes', function ( $attributes ) { // Do what you want here... // This should return an array so add your attributes to // to the $attributes array before returning it. E.G. $attributes[] = 'target'; // This would allow the target="" attribute. return $attributes; } ); add_filter( 'svg_allowed_tags', function ( $tags ) { // Do what you want here... // This should return an array so add your tags to // to the $tags array before returning it. E.G. $tags[] = 'use'; // This would allow the <use> element. return $tags; } );
使用者評論
參與者及開發者
變更記錄
2.1.1 – 2023-04-05
- Changed: Upgrade
@wordpress
npm package dependencies (props @ggutenberg, @Sidsector9 via #108). - Changed: Bump WordPress “tested up to” version 6.2 (props @ggutenberg, @Sidsector9 via #108).
- Changed: Run our E2E tests on the zip generated by “Build release zip” action (props @jayedul, @dkotter via #106).
- Fixed: Only load our block CSS if a page has the SVG block in it and remove an extra slash in the CSS file path. Remove an unneeded JS block file (props @dkotter, @freinbichler, @IanDelMar, @ocean90, @Sidsector9 via #112).
- Fixed: Better error handling for environments that don’t match our minimum PHP version (props @dkotter, @ravinderk via #111).
2.1.0 – 2023-03-22
- Added: An SVG Gutenberg Block (props @faisal-alvi, @Sidsector9, @cr0ybot, @darylldoyle, @cbirdsong, @jeffpaul via #80).
- Added: “Build release zip” GitHub Action (props @iamdharmesh, @dkotter, @faisal-alvi via #87).
- Changed: Bump minimum PHP version from 7.0 to 7.4 (props @iamdharmesh, @peterwilsoncc, @vikrampm1 via #82).
- Changed: Bump minimum WordPress version from 4.7 to 5.7 (props @iamdharmesh, @peterwilsoncc, @vikrampm1 via #82).
- Changed: Bump WordPress “tested up to” version 6.1 (props @iamdharmesh, @peterwilsoncc via #85).
- Security: Updates the underlying sanitisation library to pull in a security fix (props @darylldoyle, @faisal-alvi, @Cyxow via #105).
- Security: Bump
got
from 10.7.0 to 11.8.5 (props @dependabot via #83). - Security: Bump
@wordpress/env from
4.9.0 to 5.6.0 (props @dependabot via #83). - Security: Bump
simple-git
from 3.9.0 to 3.16.0 (props @dependabot via #88, #99). - Security: Bump
loader-utils
from 2.0.2 to 2.0.4 (props @dependabot via #92). - Security: Bump
json5
from 1.0.1 to 1.0.2 (props @dependabot via #91). - Security: Bump
decode-uri-component
from 0.2.0 to 0.2.2 (props @dependabot via #93). - Security: Bump
markdown-it
from 12.0.4 to 12.3.2 (props @dependabot, @peterwilsoncc via #94). - Security: Bump
@wordpress/scripts
from 19.2.4 to 25.1.0 (props @dependabot, @peterwilsoncc via #94). - Security: Bump
http-cache-semantics
from 4.1.0 to 4.1.1 (props @dependabot, @peterwilsoncc via #101). - Security: Bump
webpack
from 5.75.0 to 5.76.1 (props @dependabot, @faisal-alvi via #103). - Security: Bump
svg-sanitizer
from 0.15.2 to 0.16.0 (props @darylldoyle, @faisal-alvi, @Cyxow via #105).
2.0.3 – 2022-09-01
- Added: More robust PHP testing (props @iamdharmesh, @faisal-alvi via #71, #73).
- Fixed: Addressed PHPCS errors (props @iamdharmesh, @faisal-alvi via #73).
2.0.2 – 2022-06-27
- Added: Dependency security scanning (props @jeffpaul via #60).
- Added: End-to-end testing with Cypress (props @iamdharmesh via #64).
- Changed: Bump WordPress version “tested up to” 6.0 (props @dkotter via #65).
- Removed: Redundant premium version upgrade link (props @ocean90, @peterwilsoncc via #61).
- Removed: Unneeded admin CSS fix for featured images (props @AdamWills, @dkotter, @peterwilsoncc via #63).
2.0.1 – 2022-04-19
- Changed: Documentation updates (props @jeffpaul, @peterwilsoncc).
- Fixed: Ensure our height and width attributes are set before using them (props @dkotter, @r8r, @jerturowetz, @cadic).
- Fixed: Support for installing via packagist.org (props @roborourke, @peterwilsoncc).
2.0.0 – 2022-04-06
- Added: New filter,
safe_svg_use_width_height_attributes
, that can be used to change the order of attributes we use to determine the SVG dimensions (props @dkotter, @peterwilsoncc). - Changed: Documentation updates (props @j-hoffmann, @jeffpaul, @Zodiac1978).
- Fixed: Use the
viewBox
attributes first for image dimensions. Ensure we don’t use image dimensions that end with percent signs (props @dkotter, @peterwilsoncc). - Fixed: Make sure we use the full size SVG dimensions rather than the requested size, to avoid wrong sizes being used and duplicate height and width attributes (props @dkotter, @cadic).
- Fixed: Ensure the
tmp_name
andname
properties exist before we use them (props @dkotter, @aksld).
1.9.10 – 2022-02-23
Note that this release bumps the WordPress minimum version from 4.0 to 4.7 and the PHP minimum version from 5.6 to 7.0.
- Changed: Bump WordPress minimum version from 4.0 to 4.7 (props @cadic).
- Changed: Bump PHP minimum version from 5.6 to 7.0 (props @mehidi258, @iamdharmesh, @amdd-tim, @darylldoyle, @jeffpaul).
- Changed: Update
enshrined/svg-sanitize
from 0.13.3 to 0.15.2 (props @mehidi258, @iamdharmesh, @amdd-tim, @darylldoyle, @jeffpaul, @cadic). - Changed: Bump WordPress version “tested up to” 5.9 (props @BBerg10up, @jeffpaul, @cadic).
- Changed: Updated library location and added a new build step (props @darylldoyle, @dkotter).
- Changed: Updated plugin assets and added docs and repo management workflows via GitHub Actions (props Brooke Campbell, @jeffpaul).
- Fixed: Double slash being added in SVG file URL for newer uploads (props @mehulkaklotar, @smerriman).
- Fixed: Float value casting for SVGs when fetching width and height (props @mehulkaklotar, @smerriman).
- Fixed: Use calculated size for SVGs instead of using
false
(props @dkotter, @darylldoyle, @fritteli). - Fixed: Add better file type checking when looking for SVG files (props @davidhamann, @dkotter, @darylldoyle).
1.9.9 – 2020-05-07
- Fixed: Issue where 100% width is accidentally converted to 100px width (props @joehoyle).
1.9.8 – 2020-05-07
- Changed: Underlying library update.
1.9.7 – 2019-12-10
- Changed: Underlying library update.
1.9.6 – 2019-11-07
- Security: Underlying library update that fixes a security issue.
1.9.5 – 2019-11-04
- Security: Underlying library update that fixes some security issues.
1.9.4 – 2019-08-21
- Fixed: Bug causing lots of error log output to do with
safe_svg::fix_direct_image_output()
.
1.9.3 – 2019-02-19
- Fixed: Bug causing 0 height and width SVGs.
1.9.2 – 2019-02-14
- Fixed: Warning about an Illegal string offset.
- Fixed: Issue if something other than a WP_Post object is passed in via the
wp_get_attachment_image_attributes
filter.
1.9.1 – 2019-01-29
- Fixed: Warning that was being generated by a change made in 1.9.0.
1.9.0 – 2019-01-03
- Changed: If an image is the correct ratio, allow skipping of the crop popup when setting header/logo images with SVGs.
1.8.1 – 2018-11-22
- Changed: Don’t let errors break upload if uploading an empty file
- Fixed: Featured image display in Gutenberg. Props @dmhendricks 🙂
1.8.0 – 2018-11-04
- Added: Pull SVG dimensions from the width/height or viewbox attributes of the SVG.
- Added: role=”img” attribute to SVGs.
1.7.1 – 2018-10-01
- Changed: Underlying lib and added new filters for filtering allowed tags and attributes.
1.7.0 – 2018-10-01
- Added: Allow devs to filter tags and attrs within WordPress.
1.6.1 – 2018-03-17
- Changed: Images will now use the size chosen when inserted into the page rather than default to 2000px everytime.
1.6.0 – 2017-12-20
- Added: Fairly big new feature – The library now allows
<use>
elements as long as they don’t reference external files! - Fixed: You can now also embed safe image types within the SVG and not have them stripped (PNG, GIF, JPG).
1.5.3 – 2017-11-16
- Fixed: 1.5.2 introduced an issue that can freeze the media library. This fixes that issue. Sorry!
1.5.2 – 2017-11-15
- Changed: Tested with 4.9.0.
- Fixed: Issue with SVGs when regenerating media.
1.5.1 – 2017-08-21
- Fixed: PHP strict standards warning.
1.5.0 – 2017-06-20
- Changed: Library update.
- Changed: role, aria- and data- attributes are now whitelisted to improve accessibility.
1.4.5 – 2017-06-18
- Changed: Library update.
- Fixed: some issues with defining the size of an SVG.
1.4.4 – 2017-06-07
- Fixed: SVGs now display as featured images in the admin area.
1.4.3 – 2017-03-06
- Added: WordPress 4.7.3 Compatibility.
- Changed: Expanded SVG previews in media library.
1.4.2 – 2017-02-26
- Added: Check / fix for when mb_* functions are not available.
1.4.1 – 2017-02-23
- Changed: Underlying library to allow attributes/tags in all case variations.
1.4.0 – 2017-02-21
- Added: Ability to preview SVG on both grid and list view in the wp-admin media area
- Changed: Underlying library version.
1.3.4 – 2017-02-20
- Fixed: SVGZ uploads failing and not sanitising correctly.
1.3.3 – 2017-02-15
- Changed: Allow SVGZ uploads.
1.3.2 – 2017-01-27
- Fixed: Mime type issue in 4.7.1. Mad props to @LewisCowles1986.
1.3.1 – 2016-12-01
- Changed: Underlying library version.
1.3.0 – 2016-10-10
- Changed: Minify SVGs after cleaning so they can be loaded correctly through
file_get_contents
.
1.2.0 – 2016-02-27
- Added: Support for camel case attributes such as viewBox.
1.1.1 – 2016-07-06
- Fixed: Issue with empty svg elements self-closing.
1.1.0 – 2015-07-04
- Added: I18n.
- Added: da, de ,en, es, fr, nl and ru translations.
- Fixed: Issue with filename not being pulled over on failed uploads.
1.0.0 – 2015-07-03
- Initial Release.