SWELL専用ボタンリンクに矢印を追加する方法

今回は以下のようなSWELL専用ボタンリンクについてのご紹介です。

SWELL専用ボタンリンクブロックは、クリック数やボタンが見られた回数など分析に役立つ情報が標準で備わっていますが、標準で用意されているボタンリンク用のアイコン一覧に矢印アイコンがありません。

SWELLボタンのアイコンリスト
SWELLボタンのアイコンリストに矢印アイコンは無い
目次

ボタンリンクに矢印アイコンを設定する方法

SWELLボタンに矢印アイコンを設定するのは簡単です。

アイコンのクラスという欄に「fas fa-chevron-circle-right」と入力するだけです。

SWELLボタンに矢印アイコンを表示させる設定
SWELLボタンに矢印アイコンを表示させる設定

通常アイコンを利用するには、WebフォントのFont Awesomeを読み込む必要がありますが、SWELLの場合は、Font Awesomeを読み込んでいなくても一部矢印アイコンを使うことが出来ます。

なお、SWELLで使えるアイコンについては、下記公式サイトの解説記事が詳しいです。

ボタンリンクにアイコンが設定できないケースもある

SWELL専用ボタンブロックを使ったリンクに矢印アイコンを設定する方法について紹介しましたが、アイコンが表示されないケースもあります。

それが、広告タグを直接設定した場合です。

SWELLボタンには、広告タグを直接入力できるエリアがあります。

SWELLボタンにアイコンが表示されないケース
SWELLボタンにアイコンが表示されないケース

ここに、ASPからコピーしたテキスト広告タグを直接貼り付けると広告リンクのボタンが出来るので非常に便利なんですが、この設定を使った場合は、ボタンにアイコンは表示されません。

広告タグ設定に直接テキストリンクタグを設定してるとアイコンは表示されない

SWELLのバージョン2.4.0ではアイコンを選択出来ますが、ボタンリンクにアイコンは表示されません。

SWELLのフォーラムで問い合わせたところ、ここについては、アイコンが表示されないのは正常なので、今後広告タグを直接入力欄を使った場合は、アイコン自体が選択できないように改善される予定とのことです。

よかったらシェアしてね!
目次
閉じる