プラグインShortcodes Ultimateでリストのアイコンが表示できない!

ショートコード

自分のサイトを装飾するのに便利な「Shortcodes Ultimate」!

色々なビジュアルが実装されていて便利ですよね。

ボタンやアイコンを貼り付けるなどサイトを構築していくうえで、使ってみたい機能が一杯です。

私も、ショートコードでは文字に囲みをつけたりボタンを作ったり色々使ってきました。

しかし、このリストからアイコンピッカーを使ってアイコンを貼り付けるのが、なかかな上手くいきませんでした。

手順通りにやっているのに、なぜかアイコンが表示されない。。

悩むことしばし。

とても単純なことで無事表示されるようになりました。

今回は、ショートコードのリストからアイコンピッカーを使ってアイコンを表示する方法をご紹介します。

※shortcodes Ulimateのプラグインを導入している事を前提にお伝えします。



 



手順①
まず編集画面からショートコードを選択します。

ショートコード リスト

手順②
沢山ある中からリストを選択します。

ショートコード リスト

手順③
アイコンピッカーを選択します。

ショートコード リスト

手順④
お好きなアイコンを選択します。

沢山ありますね!これでも一部です。

ショートコード リスト

手順⑤
「アイコンの色」で色をお好きな色に編集します。

ショートコード リスト

スポンサーリンク
手順⑥
コンテンツに内容を記載します。

私はコンテンツにHTMLコードが必要だと知らなくて、そのまま書いていたんですね~!

HTMLコードを記載しないと表示されません。

初心者ならではですかね!

<ul>

<li>〇〇</li>

<li>〇〇</li>

</ul>

〇〇の部分に文字を記載してください。

ショートコード リスト


手順⑦
ライブプレビューで確認する

ショートコード リスト

手順⑧
「ショートコードを挿入」を押すと、編集画面ではこうなります。

ショートコード リスト

手順⑨
プレビューで確認します

ショートコード リスト

手順⑩
無事表示されました!

バンザーイ!

ショートコード リスト

まとめ



いかがでしたか?
無事アイコンが表示されましたでしょうか?
初心者は当たり前のような事でも分からないことが多いですよね。
アイコンが表示されなくて困っている方は、HTMLを記載してくださいね!

最後までお読み頂き有難うございました。
当サイトが皆様のお役に立てれば幸いです。

スポンサーリンク