Download SVG-Template von Xon 2.7.0

XF-Kompatibilität

2.3.x
2.2.x

Kurzbeschreibung: Abhängig von der Konfiguration benötigt dieses Add-on die Unterstützung für URL-Rewrite auf Webserver!

Benötigt Standardbibliothek v1.12.0+
Abhängig von der Konfiguration benötigt dieses Add-on Webserver-URL-Rewrite-Sicherheit!

SVG-Vorlage

Abhängig von der Konfiguration benötigt dieses Add-on Webserver-URL-Rewrite-Sicherheit!
Es ermöglicht die Speicherung von SVG-Bildern (Scalable Vector Graphics) als Vorlagen.
Dies erstellt ein neues svg.php-Datei im XF-Wurzelverzeichnis.
Um einen Link zu einer SVG-Vorlage zu generieren (Die Vorlage muss einen .svg am Ende des Namens haben!) ;

Code:

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

Rendern in PNG

Die Übertragung von SVGs in PNGs benötigt externe Unterstützung und abhängig von der Betriebsumgebung können unangenehme Einschränkungen oder schlechte Darstellungen auftreten.

php-imagick Unterstützung

Es ist nicht empfohlen Imagick zu verwenden, wenn es geht!
Ubuntu (Verwenden von https://launchpad.net/~ondrej/+archive/ubuntu/phpPPA[/heading]);
Code:

Code:

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

Notiz: Einige Distro's erfordern die Installation der Bibliothek libmagickcore-6.q16-3-extra, um SVG-Sicherheit zu aktivieren.
Alte Versionen von Imagick haben schlechte SVG-Sicherheit und eine schlechte Rufweiterung.

CLI-Unterstützung

Dies ist ein allgemeiner Ausfallschacht, um beliebige PNG-Konvertierungen zu platzieren, indem proc_open in PHP verwendet wird.
Configure Render mit der proc_open-Option wie folgt:
{sourceFile} ist die Quell-SVG, die als temporäre Datei geschrieben wird {destFile} ist die Ziel-PNG-Datei als temporäre Datei.
Alternativ können Eingabe-/Ausgabe über Pipes durchgeführt werden.
Notiz: Vorlagennamen sind nur alphanumerische Zeichen, die durch die Validierung vor der CLI-Option eingehalten werden.

resvg CLI-Unterstützung

Beispiel mit resvg, configure CLI-Befehl wie folgt:

Code:

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

Pre-geschaffter Linux x86_64-Binärdatei ist verfügbar hier. Auf CentOS 7 kompiliert, funktioniert es auf Ubuntu 18.04/20.04.

Compilierung

Die Kompilierung kann an neue Versionen von glibc gebunden sein, was Portabilitätsprobleme verursachen kann.

Code:

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-Unterstützung

Notiz: Verwenden Sie Snap, ansonsten ist es wahrscheinlich zu alt!

Code:

sudo snap install inkscape

Configure CLI-Pipe-Befehl wie folgt:

Code:

inkscape --export-type=png -p

Funktionen

Bedingte Rendern von SVGs in PNG (für CSS/LESS)

Beispiel für bedingte CSS, um PNG anstelle von SVG für Mobilgeräte zu verwenden.
Less:

Code:

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

Eindeutige Verwendung in Templates;

Code:

<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-Routing-Integration

Obwohl Webserver-URL-Rewrite-Richtlinien empfohlen sind, unterstützt dieses Add-on die Erweiterung des Routing-Systems von XenForo, um SVG-Vorlagen ohne Konfiguration zu unterstützen.

Nginx-URL-Rewrite-Konfiguration

Code:

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

Apache-URL-Rewrite-Konfiguration

Fügen Sie die Richtlinie vor der endgültigen index.php hinzu;

Code:

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

ie, sollte ähnlich aussehen:

Code:

    #    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 [OR]
    RewriteCond %{REQUEST_FILENAME} -l [OR]
    RewriteCond %{REQUEST_FILENAME} -d
    RewriteRule ^.*$ - [NC,L]
    RewriteRule ^(data/|js/|styles/|install/|favicon\.ico|crossdomain\.xml|robots\.txt) - [NC,L]
    RewriteRule ^data/svg/([^/]+)/([^/]+)/([^/]+)/([^\.]+\..*)$ svg.php?svg=$4&s=$1&l=$2&d=$3 [B,NC,L,QSA]
    RewriteRule ^.*$ index.php [NC,L]

Mitwirkungsfunktionen oder Fehlerbehebungen
Bitte erstellen Sie eine GitHub-Pull-Anfrage über den "Weitere Informationen"-Link.

SVG-Template von Xon 2.7.0

Neueste Aktualisierungen

Weitere Ressourcen von anne51

Ähnliche Ressourcen