ヘッダーに表示するロゴ画像は、カスタマイザーから簡単に設定できるようになっています。
しかし、WordPressの「メディア」にはSVG画像を入れることが基本的にはできないので、ロゴ画像にもSVG画像が使用できません。
こだわって作ったロゴなんだから、SVG画像で綺麗に見せたい！
という人も多いのではないかと思います。
そこで、ver. 1.2.8より、ロゴ画像をフィルターフックで書き換えることができるようにしておきました！
このページでは、そのフィルターフックを使って、ヘッダーロゴにSVG画像を使用する方法を解説していきます。
手順１：SVGのロゴ画像を子テーマのどこかにアップロードする
「メディア」にはSVGをアプロードできないので、FTPソフトなどを使ってロゴ画像をサーバー上にアップしておきましょう。
例えば、子テーマのディレクトリswell_childにimgというディレクトリを作成し、その中にlogo.svgを配置したとします。
例：SVGロゴ画像の配置
swell_child/
L img/
L logo.svg手順２：フィルターフックでロゴ画像を書き換える
あとは、子テーマのfunctions.phpにてちょろっとコードを追記するだけです。
SWELLのロゴ画像の書き換えには、'swell_head_logo'というフックがかかっていますので、これを利用します。
例：svgロゴ画像をimgフォルダ内に入れている場合
add_filter('swell_head_logo', function($logo) {
return S_DIRE_URI . '/img/logo.svg'; //ここは書き換えてね
});これだけです！
S_DIRE_URIという定数はSWELL親テーマ側で定義しているもので、子テーマディレクトリまでのパスを返してくれます。（get_stylesheet_directory_uri()の返り値を定数化したものです。）
'/img/logo.svg'の部分を、ご自身でアップロードしたSVGロゴ画像までのパスに合わせて書き換えてご利用ください。
TOPページのヘッダー透過時のロゴは'swell_head_logo_top'というフックで同様にSVG画像を利用できます。
キャッシュ機能ご利用時の注意点
SWELLのキャッシュ機能を有効化している場合、ヘッダー部分はキャッシュされているので子テーマのfunctions.phpを編集してもヘッダーのロゴは切り替わりません。
キャッシュクリア機能を使うか、カスタマイザーの設定を適当にいじってから戻したりしてもヘッダー部分のキャッシュはクリアされます。（カスタマイザーの設定保存時にキャッシュクリアされます。）
もしくは、クリアキャッシュ機能をオフにしてから編集するように注意してください。
