WordPressテーマJINにはオリジナルアイコンが多数用意されています。
今回は、このJINのオリジナルアイコンを記事内で使う方法を解説します。
記事の中で使うといいアクセントになりますので、JINをお使いの方はぜひご活用ください。
JINのオリジナルアイコンを記事で使う方法
ショートコードをコピーする
JINアイコン一覧からアイコンのショートコード（[ ]で囲まれたコード）をコピーします。
記事に貼り付ける
コピーしたショートコードを記事に貼り付けます。
プレビューで確認するとアイコンが表示されています。
アイコンの色とサイズを変える場合は、以下の方法で変更してください。
アイコンの色・サイズを変更する
色を変更する
記事中のアイコン色をまとめて変更する方法と、個別に色を変更する方法の2パターンがあります。
一括で変更する場合
① 外観＞カスタマイズ＞カラー設定に進みます。
② 記事中のアイコンの色に#db7093などのカラーコードを入力して[公開]します。
カラーコードはWEB色見本などをご参照ください。
これで記事中のアイコン色が全て変更されます。
個別にアイコンの色を変更する
その部分だけアイコンの色を変えたい場合は、以下の方法で変更してください。
①下記のショートコードをコピーします。
※アイコンの種類（jin_icon_homeの箇所）は使用するアイコンの内容に置き換えてください。
[jin_icon_home color="#e9546b"]② ショートコードを記事に貼り付け、「color=”#e9546b”」部分のカラーコード（#6桁の英数字）を変更します。
カラーの例↓
#e9546b | #db7093 | #8fbc8f |
#4682b4 | #ff8c00 | #da70d6 |
カラーコードはWEB色見本などをご参照ください。
サイズを変更する
①下記のショートコードをコピーします。
※アイコンの種類（jin_icon_homeの箇所）は使用するアイコンの内容に置き換えてください。
[jin_icon_home size="16px"]②「size=”16px”」部分の数字を変更することで、アイコンの大きさを自由に変更できます。
大きさの目安↓
16px | 20px | 24px |
30px | 40px | 50px |
以上、JINのオリジナルアイコンを記事内で使う方法でした。
Dressingでは、ブログ作成中の疑問やお悩みにチャットを使ってお答えしています。
- WordPressが思ったより難しくて挫折しそう
- 使い方が分からない、なぜか上手くいかない
- 自分のブログはこのままでいいの？
など、お困りの際はお気軽にご相談ください。
今すぐ解決！
