WordPress шорткоды для SVG
Я устал от этих значков, если я продолжу, я сломаю свой сайт.
http://slembas.esy.es — посмотрите на красные круглые кнопки в нижнем колонтитуле.
Я пытаюсь вставить иконки SVG. Они должны иметь настраиваемую «заливку». Но я не хочу копировать и вставлять один и тот же код везде, потому что если я что-то изменяю в значке, я должен переписывать каждый SVG на сайте отдельно. Я просто хочу отредактировать один шорткод, и он изменит все автоматически.
Я даю вам, например, иконку SVG:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="24" height="24" viewBox="0 0 24 24">
<path class="button-icon" d="M23,11H21V9H19V11H17V13H19V15H21V13H23M8,11V13.4H12C11.8,14.4 10.8,16.4 8,16.4C5.6,16.4 3.7,14.4 3.7,12C3.7,9.6 5.6,7.6 8,7.6C9.4,7.6 10.3,8.2 10.8,8.7L12.7,6.9C11.5,5.7 9.9,5 8,5C4.1,5 1,8.1 1,12C1,15.9 4.1,19 8,19C12,19 14.7,16.2 14.7,12.2C14.7,11.7 14.7,11.4 14.6,11H8Z"/>
</svg>
class="button-icon" — класс, который должен настроить заливку.
Я не профессионал в веб-дизайне, особенно в PHP.
Решение
Простое решение — переместить значок в файл, возможно, icon_facebook.php или что-то еще, а затем использовать include вот так:
// icon_facebook.php
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="24" height="24" viewBox="0 0 24 24">
<path class="button-icon" d="M23,11H21V9H19V11H17V13H19V15H21V13H23M8,11V13.4H12C11.8,14.4 10.8,16.4 8,16.4C5.6,16.4 3.7,14.4 3.7,12C3.7,9.6 5.6,7.6 8,7.6C9.4,7.6 10.3,8.2 10.8,8.7L12.7,6.9C11.5,5.7 9.9,5 8,5C4.1,5 1,8.1 1,12C1,15.9 4.1,19 8,19C12,19 14.7,16.2 14.7,12.2C14.7,11.7 14.7,11.4 14.6,11H8Z" />
</svg>
а затем включите этот значок, где вам это нужно.
// some_page.php
...
include 'icon_facebook.php';
Просто и должно соответствовать вашим требованиям. Надеюсь, это поможет.
Другие решения
Других решений пока нет …