【期間限定 1/7(水) まで】エックスサーバー最大30%OFFキャンペーン実施中!

【SWELL非公式マニュアル】アイコンを簡単に呼び出せるショートコードの使い方

SWELLでは、数種類のアイコンをフォントとして読み込まれています。

この記事では、これらのアイコンを文中で簡単に呼び出すためのショートコードの使い方を紹介します。

(例) / /

目次

\ 初心者におすすめ /

以下の3つを利用すると
最短最速でブログ収益化ができます

【レンタルサーバー】

エックスサーバー

【WordPressテーマ】

SWELL

【SEOツール】

ラッコキーワード

上記のリンクを選択すると、各サービスの詳しい記事に移動します。

ショートコードの使い方

使い方はとても簡単で、[icon]または[アイコン]というショートコードでアイコンを呼び出すことが可能です。

[icon ここにアイコンクラス名]

または

[アイコン ここにアイコンクラス名]

とするだけです。

もしくは、Font Awesomeのアイコンを使う時などにクラス名が複数必要な場合、

[icon class="ここにアイコンのクラス名"]

または

[アイコン class="ここにアイコンのクラス名"]

としてもクラスを指定できます。

SWELLで読み込んでいるアイコンのクラス名については、以下の記事で一覧にまとめられています。

また、SWELLでFont Awesomeを使う方法は以下の記事を参考にしてください。

アイコンの使用例

本文中

グッドです! 

上記の文章は、以下のようにエディターに記述しています。

アイコン使用例1
SWELL公式サイト:アイコン使用例1

キャプション付きブロックのタイトル部分

  ここにも使える!

これは、以下のようにエディターに記述しています。

アイコン使用例2
SWELL公式サイト:アイコン使用例2

ボタンの中

これは、以下のようにエディターに記述しています。

アイコン使用例3
SWELL公式サイト:アイコン使用例2

SWELL公式マニュアル:アイコンを簡単に呼び出せるショートコードの使い方

この記事を書いた「ブルー」です。
プログラマー×ブロガー
へなちょこシステムエンジニアが副業ブログで月収10万円を達成。エックスサーバー、SWELL、ラッコキーワードを使った稼げるブログを作る方法を解説します。

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次