Tema de Plantel SVG por Xon 2.7.0

Compatibilidade com XF

2.3.x
2.2.x

Descrição curta: XenForo 2 SVG Template Add-on v1.12.0+: Allows storing and generating SVG templates for easy image management. Supports URL rewriting for clean URLs and rendering to PNG using CLI or pre-compiled binaries like php-imagick, resvg, and Inkscape. Compatible with XenForo 2 routing system via Nginx/Apache rewrite rules.

RequererStandard Library By Xonv1.12.0+
Dependendo da configuração, este add-on requer suporte de reescrita de URL do servidor web!

SVG Template

Dependendo da configuração, este add-on requer suporte de reescrita de URL do servidor web!
Permite que imagens SVG (Gráficos Vectoriais Escaláveis) sejam armazenadas como modelos. Isso cria um novo arquivo svg.php na raiz do XF.
Para gerar uma link para um modelo SVG (O modelo deve ter .svg no final do nome!);

CÓDIGO:

{{ 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>

Render para PNG

Renderizar SVGs em PNGs requer suporte externo e dependendo do SO isso pode resultar em limitações estranhas ou renderização ruim.

php-imagick-suporte

É quenão recomendadouso de Imagick se possível!
Ubuntu (usando )https://launchpad.net/~ondrej/+archive/ubuntu/phpPPA); Code:

CÓDIGO:

sudo apt install php7.4-imagick libmagickcore-6.q16-3-extra
sudo systemctl restart php7.4-fpm

Nota; algumas distros requerem o libmagickcore-6.q16-3-extra instalado para habilitar suporte a SVG. Versões antigas do Imagick têm um suporte pobre para SVG, além de uma reputação ruim em segurança.

SUporte CLI

Este é um escape hatch genérico para conectar conversão de PNG, usando proc_open em PHP.
Configure Render usando opção proc_open;
<CLI-binary> {destFile} {sourceFile}
{oitavaficheiro} é o SVG original escrito como arquivo temporário {resultadoficheiro} é o arquivo PNG de destino escrito como arquivo temporário
Alternativamente, entrada/saída pode ser feita através de pipes
Nota; os nomes de modelos são apenas strings alfanuméricas, que é restringido antes da chamada do opção CLI

suporte cli resvg

Exemplo usandoresvgconfigurar comando CLI com;

CÓDIGO:

/usr/local/bin/resvg --quiet {sourceFile} {destFile}

Binário pré-compilado

Binário pré-compilado Linux x86_64 está disponívelhereCompilado no CentOS 7, funciona no Ubuntu 18.04/20.04

Compilando

Compilando pode se ligar a versões mais novas do glibc, o que pode causar problemas de compatibilidade.

CÓDIGO:

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

Suporte ao CLI do Inkscape

Nota; use snap caso contrário ele provavelmente terá uma instância muito antiga!

CÓDIGO:

sudo snap install inkscape

Configurar comando PIPE do CLI com;

CÓDIGO:

inkscape --export-type=png -p

Funcionalidades

Renderings condicionais em SVG para PNG (para CSS/LESS)

Um exemplo de CSS condicional para usar o PNG sobre o SVG para clientes móveis

CÓDIGO:

.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>
}
}

Uso explícito em modelos;

CÓDIGO:

<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 integração de roteamento

Enquanto as regras de reescrita do servidor web são recomendadas, este adendo suporta a extensão do sistema de roteamento do XenForo para fornecer suporte ao sistema de rotas zero-configuração para Templates SVG

Configuração de reescrita de URL Nginx

CÓDIGO:

location ^~ /data/svg/ {
   access_log off;
   rewrite ^/data/svg/([^/]+)/([^/]+)/([^/]+)/([^\.]+\..*)$ /svg.php?svg=$4&s=$1&l=$2&d=$3$args last;
   return 403;
}

Apache reconfiguração de rewrite URL

Adicione a regra antes do final.php;

CÓDIGO:

    RewriteRule ^data/svg/([^/]+)/([^/]+)/([^/]+)/([^\.]+\..*)$ svg.php?svg=$4&s=$1&l=$2&d=$3 [B,NC,L,QSA]

ei, deve parecer como;

CÓDIGO:

    #    If you are having problems with the rewrite rules, remove the "#" from the
    #    line that begins "RewriteBase" below. You will also have to change the path
    #    of the rewrite to reflect the path to your XenForo installation.
    #RewriteBase /xenforo
    RewriteCond %{REQUEST_FILENAME} -f 
    RewriteCond %{REQUEST_FILENAME} -l 
    RewriteCond %{REQUEST_FILENAME} -d
    RewriteRule ^.*$ - 
    RewriteRule ^(data/|js/|styles/|install/|favicon\.ico|crossdomain\.xml|robots\.txt) - 
    RewriteRule ^data/svg/([^/]+)/([^/]+)/([^/]+)/([^\.]+\..*)$ svg.php?svg=$4&s=$1&l=$2&d=$3 [B,NC,L,QSA]
    RewriteRule ^.*$ index.php

Contribuindo recursos ou correções de bugsFaça um pedido de fusão no GitHub através do link "Mais Informações".