WordPress SVG -Unterstützung: So aktivieren Sie SVGs in WordPress

In diesem Tutorial wird WordPress SVG -Unterstützung hinzufügen und seine Anzeige in der Medienbibliothek optimieren. SVGs bieten Skalierbarkeit, Reaktionsfähigkeit und kleinere Dateigrößen im Vergleich zu Rasterbildern, aber WordPress unterstützt sie aufgrund von Sicherheitsbedenken hinsichtlich der potenziellen JavaScript -Injektion nicht nativ.

Warum WordPress SVGs nicht unterstützt (standardmäßig): Das Kernproblem ist die Sicherheit. Im Gegensatz zu Rasterbildern sind SVGs vektorbasiert und können möglicherweise böswilliges JavaScript enthalten, was ein Risiko darstellt, wenn sie von Benutzern mit unterschiedlichen Zugriffsstufen hochgeladen werden.

Aktivieren von SVG -Uploads: Um SVG -Unterstützung hinzuzufügen, ändern Sie den upload_mimes Filter mithilfe eines untergeordneten Themas functions.php oder einem benutzerdefinierten Plugin:

function add_svg_upload_support($file_types){
    $new_filetypes = array('svg' => 'image/svg+xml');
    return array_merge($file_types, $new_filetypes);
}
add_filter('upload_mimes', 'add_svg_upload_support');

Dieser Code fügt 'SVG' mit seinem MIME -Typ zu den zulässigen Dateitypen hinzu.

SVG -Anzeige in der Medienbibliothek verbessert: WordPress -Standardanzeige von SVGs in der Gitteransicht ist suboptimal. Um dies zu verbessern, verwenden Sie JavaScript und AJAX mit Mutationsbeobachtern, um die Vorschau dynamisch zu aktualisieren. Dies beinhaltet das Erstellen einer benutzerdefinierten AJAX -Funktion, um die SVG -URL zu holen und den Standardeinstellungsschützer durch das tatsächliche SVG -Bild zu ersetzen. Admin -CSS -Anpassungen sind ebenfalls erforderlich, um sicherzustellen

Admin CSS -Optimierungen: Um zu verhindern, dass SVGs aufgrund fehlender Höhen-/Breitenattribute einstürzen, fügen Sie diesbezüglich ein: zu verhindern:

table.media .column-title .media-icon img[src*='.svg'],
img[src*='.svg'] {
    width: 100%;
    height: auto;
}

Dies stellt eine ordnungsgemäße Anzeige im Raster- und Spaltenansichten der Medienbibliothek sowie im Front-End sicher.

Dieser umfassende Ansatz sorgt für ein besseres Management und die Anzeige von SVGs in WordPress und verbessert die Benutzererfahrung. Denken Sie daran, Sicherheitsauswirkungen zu berücksichtigen und möglicherweise ein Plugin zu verwenden, das hochgeladene SVGs für zusätzlichen Schutz bereinigt wird.

Das obige ist der detaillierte Inhalt vonWordPress SVG -Unterstützung: So aktivieren Sie SVGs in WordPress. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!