SWELLでアイコンをショートコードを使わずに(使って)呼び出す
2025
2/04
SWELL - シンプル美と機能性両立を両立させた、圧巻のWordPressテーマ
¥17,600(税込)※ お支払いは一度限りです。月額や年額ではありません。
シンプル美と機能性を両立させた、最高峰の国産WordPressテーマ『SWELL』。ぜひ、この感動の使い心地を体験してみてください。
SWELL - シンプル美と機能性両立を両立させた、圧巻のWordPressテーマ
¥17,600(税込)※ お支払いは一度限りです。月額や年額ではありません。
シンプル美と機能性を両立させた、最高峰の国産WordPressテーマ『SWELL』。ぜひ、この感動の使い心地を体験してみてください。
SWELLでアイコンを使う方法を教えてほしいです。
こういった悩みにお答えします。
アイコンをショートコードを使わずに呼び出す方法
アイコンをショートコードを使って呼び出す方法
是非、最後までご覧ください。
本記事の内容
SWELLでアイコンをショートコードを使わずに呼び出す
ブロックツールバーのアイコンから選択して呼び出す
トップツールバーから、「 (アイコン)」を選択します。
アイコンを選択から、「 」>「ロゴ」>「 」を選択します。
が表示されました。
アイコンの一例
Regular
SVGタグを直接入力して呼び出す
下記画像の赤枠部分にSVGタグを入力することでアイコンを表示できます。
表示させたいSVG画像をクリックしてから、「このアプリケーションで開く」>「テキストエディット.app」を選択します。
「テキストエディット」はMacに標準搭載されているテキストエディタで、Windowsでは「メモ帳」になります。
以下の方法でもSVGタグを表示させることはできますがインストールや設定が必要です。
方法①
表示させたいSVG画像をクリックしてから、「このアプリケーションで開く」>「Visual Studio Code.app」を選択します。
方法②
表示させたいSVG画像をクリックしてから、「クイックアクション」>「Open with Code」を選択するとVisual Studio Code.appで開きます。
SVGタグ
あわせて読みたい
【Macは超簡単】VSCodeをインストールと日本語対応する方法
【Macは超簡単】VSCodeをインストールと日本語対応する方法を知りたいですか?本記事では、VSCodeをインストールする方法から日本語対応させる方法までを解説しています。VSCodeをインストールと日本語対応する方法を知りたい方は非是ご覧ください。
あわせて読みたい
【VSCode】MacのFinderでクイックアクションを実行する
【VSCode】MacのFinderでクイックアクションを実行する方法を知りたいですか?本記事では、Finderでクイックアクションを実行するために必要なワークフロー(「クイックアクション」>「Open with Code」)の作成や削除方法を解説しています。MacのFinderでクイックアクションを実行する方法を知りたい方は是非ご覧ください。
SVGタグをコピペ後、「決定」をクリックします。
SVG画像が表示されます。
SVGタグを直接入力して呼び出せない時の対処法
こちらの記事を参考にしてみて下さい。
あわせて読みたい
WordPressでSVG画像をアップロードする【SWELL可】
WordPressでSVG画像をアップロードする方法を知りたいですか?本記事では、functions.phpにコードを書く方法とプラグインを入れてアップロードする方法を解説しています。WordPressにSVG画像をアップロードしたい方は是非ご覧ください。
SWELLでアイコンをショートコードを使って呼び出す
IcomoonやFont Awesomeのアイコンをショートコードを使って呼び出すこともできます。
詳しくはこちらの記事で解説しています。
あわせて読みたい
SWELLで用意されているショートコードの使い方【大全】
SWELLで用意されているショートコードの使い方を知りたいですか?本記事では、「ブロック化されていない」「ブロック化もされている」「アイコン」全てのショートコードについて解説しています。SWELLで用意されているショートコードの使い方を知りたい方は是非ご覧ください。
今回は以上です。