SVG模板由Xon制作

SVG模板由Xon制作 2.7.0

没有下载权限
XF 兼容性
  1. 2.3.x
  2. 2.2.x
摘要
取决于配置,此插件需要服务器URL重写支持!
需要 标准库 By Xon v1.12.0+
根据配置,此插件需要 Web 服务器 URL 重写支持!

SVG 模板​

根据配置,此插件需要 Web 服务器 URL 重写支持!
允许 SVG(可缩放矢量图形)图像作为模板存储。
这会在 XF 根目录中创建一个新的 svg.php 文件。
要生成指向 SVG 模板的链接(模板名称必须以 .svg 结尾!);
代码:
{{ getSvgUrl('tempate.svg') }}
Under Board information, if "Use Full Friendly URLs" (useFriendlyUrls) is set the URL generated is:
Code:
/data/svg/<style_id>/<langauge_id>/<style_last_modified>/<templateName.svg>
Otherwise
Code:
svg.php?svg=<templateName>&s=<style_id>&l=<langauge_id>&d=<style_last_modified>

渲染为 PNG​

将 SVG 转换为 PNG 需要外部支持,在不同的操作系统上可能会导致一些限制或较差的渲染效果。

php-imagick 支持​

如果可以的话, 不推荐 使用 Imagick!
Ubuntu(使用 https://launchpad.net/~ondrej/+archive/ubuntu/php PPA);
代码:
代码:
sudo apt install php7.4-imagick libmagickcore-6.q16-3-extra
sudo systemctl restart php7.4-fpm
注意:某些发行版需要安装 libmagickcore-6.q16-3-extra 才能启用 SVG 支持。
旧版本的 Imagick 对 SVG 的支持较差,再加上 Imagick 的安全记录不佳。

CLI 支持​

这是一个通用的逃生机制,用于通过 php 中的 proc_open 插件插入任意的 PNG 转换。
使用 proc_open 选项配置渲染:
{sourceFile} 是源 SVG 文件,写为临时文件 {destFile} 是目标 PNG 文件,作为临时文件
或者通过管道输入/输出
注意:模板名称只能是字母数字字符串,这在调用 CLI 选项前已被验证。

resvg CLI 支持​

使用 resvg 配置 CLI 命令:
代码:
/usr/local/bin/resvg --quiet {sourceFile} {destFile}

预编译二进制文件​

已提供了一个预编译的 Linux x86_64 二进制文件, 请在此处。在 CentOS 7 上编译,适用于 Ubuntu 18.04/20.04。

编译​

编译可能会绑定到较新的 glibc 版本,这可能导致兼容性问题。
代码:
curl https://sh.rustup.rs -sSf | sh
source $HOME/.cargo/env
cargo install resvg
cp ~/.cargo/bin/resvg /usr/local/bin/resvg
chmod +x /usr/local/bin/resvg

Inkscape CLI 支持​

注意:使用 snap 会很可能会使用较旧的实例。
代码:
sudo snap install inkscape
配置 CLI 管道命令:
代码:
inkscape --export-type=png -p

特性​

条件渲染 SVG 为 PNG(用于 CSS/LESS)​

一个使用 PNG 而不是 SVG 的示例 CSS,用于移动客户端。
Less:
代码:
.mod_interrupt--svg.mod_interrupt
{
&--stop
{
&:before
{
content: url({{ getSvgUrl('sv_bbcode_modinterrupt_stop.svg') }}) !important;
}
<xf:if is="$xf.svg.as.png">
        .is-tablet &:before,
        .is-mobile &:before
{
content: url({{ getSvgUrlAs('sv_bbcode_modinterrupt_stop.svg', 'png') }}) !important;
}
</xf:if>
}
}
在模板中显式使用;
代码:
<xf:if is="$xf.svg.enabled">
<xf:if is="$xf.svg.as.png and $xf.mobileDetect and $xf.mobileDetect.isMobile()">
<img src="{{ getSvgUrlAs('example.svg', 'png') }}"/>
<xf:else />
<img src="{{ getSvgUrlAs('example.svg', 'svg') }}"/>
</xf:if>
<xf:else />
<i class="fa fa-stop" />
</xf:if>

XenForo 2 路由集成​

虽然推荐使用 Web 服务器重写规则,但此插件支持扩展 XenForo 的路由系统,以提供零配置支持 SVG 模板。

Nginx URL 重写配置​

代码:
location ^~ /data/svg/ {
   access_log off;
   rewrite ^/data/svg/([^/]+)/([^/]+)/([^/]+)/([^\.]+\..*)$ /svg.php?svg=$4&s=$1&l=$2&d=$3$args last;
   return 403;
}
在最终的 index.php 之前添加规则;
例如,应该看起来类似;
代码:
    RewriteRule ^data/svg/([^/]+)/([^/]+)/([^/]+)/([^\.]+\..*)$ svg.php?svg=$4&s=$1&l=$2&d=$3 [B,NC,L,QSA]
贡献特性和 bug 修复
请通过 "更多信息" 链接创建一个 Github Pull 请求。
作者
anne51
浏览
583
扩展类型
zip
文件大小
37.7 KB
首次发布
上次更新
评分 0.00 星 0 个评分
Link was Broken? Please 发送消息 给 NP 团队,我们会尽快为您处理!
支持开发者 如果您对测试满意或项目已成功盈利,可点击「更多信息」按钮,通过购买来支持开发者!

最新更新

  1. 2.7.0 - change log
    Require StandardLib v1.23.0+ php 8.4+ compatibility fixes Prevent XF2.3 injecting the template...
  2. 2.6.3 - change log
    Fix falsy template name for svg's wasn't supported (ie 0.svg) Fix style variant support for...
  3. 2.6.2 - changelog
    Provide a better error message when getSvgUrl is used to request a png of an svg when svg => png...

来自 anne51 的更多资源

Childy — Kids Store & Baby Clothing WordPress Theme A
Childy is a colorful, responsive & modern Multi-purpose Children WordPress Theme.
Affirm - Marketing & Digital Agency WordPress Theme A
Affirm conforms to industry best practices at all affirms.
WPC Share Cart for WooCommerce (Premium) A
a plugin for saving, sharing, replacing, and restoring cart via an auto-generated link
顶部