【Luxeritasルクセリタス】吹き出しの作り方・設定方法（画像多めに解説）

 

上記のお悩みを解決します。

 

 

それでは、本題に入ります。

 

ルクセリタス　吹き出しの作り方

結論です。

ルクセリタスでは、吹き出しを表示する方法は、『ショートコード』と『定型文』の２つあります。

 

 

私は、『定型文』で吹き出しを挿入しています。

このあたりは実際に使われてみて、自分が使いやすいと感じたほうで良いです。

 

 

吹き出しの完成イメージは下記の通りです。

 

 

イラストACで吹き出しアイコンを無料ダウンロード

無料イラストなら【イラストAC】でお好きなアイコンを探してダウンロードします。

 

 

 

 

step
1【無料イラストなら【イラストAC】】にアクセス

無料で会員登録できます。（１分ほどで登録完了）

 

 

step
2登録が完了したら、イラストを選びます

兄弟ブログの『ぶろぐしる～』では、『麦さん』のイラストを使わせていただいています。
優しいタッチのイラストですので、お気に入りです。

 

step
3気に入ったイラストを選択して、『PNG』をクリック

 

step
4ダウンロードをクリック

 

step
5１５秒カウントが始まるので、待機

 

step
6１５秒後に、下記の画面が表示されるので、『PNG』をダウンロード

 

 

ダウンロード完了で、イラストACでの作業は終わりです。

 

ダウンロード後はPNG圧縮

PNGファイルのダウンロードが完了したら圧縮します。
小さいことの積み重ねが、のちのち大きな差となってきます。

 

 

step
1『PNGイメージをオンラインで圧縮する』にアクセス

 

step
2該当画像をアップロードして圧縮

 

step
3圧縮が完了したらダウンロードして完了

 

吹き出しアイコンに限らず、画像はすべて圧縮してからWordPressにアップロードすることをオススメします。

画像サイズを最適化することで、ページ表示速度のアップが期待できます。

 

ワードプレスにメディアファイルを取り込む

イラストACからダウンロードしたイラストをワードプレスのメディアにアップロードします。

 

ワードプレスにアップロードができたら、

 

 

 

 

 

画像をアップロードするたびに、代替テキストを入力していたら大変です。

 

 

代替テキストを自動セットするプラグインをご紹介！→『【代替テキスト】ワードプレスプラグインで時短！SEO効果も期待？！』

↑の記事で、自動で代替テキストをセットするプラグインをご紹介しています。

もちろん、当ブログにも実装しております。

 

Luxeritas（ルクセリタス）ショートコードを登録する

ひとつめの吹き出し作成方法をご紹介します。

 

 

 

step
1Luxeritas→Luxeritasショートコード登録→サンプル登録

 

 

step
2画像URLにコピーしたメディアURLを貼り付け

キャプションには、今回は例として『主婦』と入力します。

 

step
3色の設定

『変更を保存』をクリックします。

 

以上でショートコードの設定は完了しました。

実際に使ってみます。

 

ショートコードを使ってみる

登録したショートコードを使ってみましょう。

 

step
1入力した文字を選択した状態で、『ショートコード』を選択

『吹き出し（左）』をクリックします。

 

たったこれだけです。

 

左吹き出しの完成

プレビュー画面で出来上がりをチェックしてみます。

 

こんな感じで完成しました。

 

以上が、ショートコードを用いた吹き出しの作成方法です。

続いては、定型文を用いた方法をご紹介します。

 

 

Luxeritas（ルクセリタス）定型文を登録する

Luxeritas（ルクセリタス）定型文登録の方法を説明します。

 

私は『ぶろぐしる～』で記事を書くときには、定型文で吹き出しを使っています。

 

 

 

step
1Luxeritas→Luxeritas定型文登録

吹き出し（右）にチェックします。

 

step
2色の設定

『変更を保存』をクリックしてください。

 

step
3『定型文』タブを開くと、『定型文一覧』が表示されます。

一覧に、作成した『吹き出し（右）』があります。

『編集』を開きます。

 

step
4白枠で囲ってある２つのコードをメモ帳にでもコピペしておきます。

 

 

コピペできたら、『定型文編集』画面をキャンセルで閉じます。

 

step
5『新規追加』で定型文を登録

 

step
6定型文を使うときに分かりやすいラベル名を付与

 

今回は例として、『右主婦疑問？』と付けました。

左下の『囲み型』にチェックをします。

定型文とその下のボックスには、メモ帳にコピペしておいたコードを貼り付けします。

 

step
7画像で選択している部分を、吹き出しに表示させたいメディアURLに置き換え

 

step
8『Right Caption』のところを、任意の文字列に打ち替え

『Right Caption』のところを、『主婦』と入力します。

すると、吹き出しのアイコンの下に『主婦』と表示されます。

 

以上で定型文の吹き出しの設定は完了しました。

実際に使ってみます。

 

定型文を使ってみる

登録した定型文を使ってみましょう。

 

 

step
1入力した文字を選択した状態で、『定型文』を選択

 

 

step
2登録した定型文を選択

 

吹き出しが挿入されました。

 

右吹き出しの完成

プレビュー画面で吹き出しをチェックしてみます。

こんな感じで完成しました。

 

 

 

私はSWELLとAFFINGER6の両方を使っています。

両テーマの吹き出しを使ってみて、【AFFINGER6とSWELL】吹き出し機能の３つの違いを感じています。

 

 

まとめ

 

吹き出しを上手に配置することで、読者が感情移入しやすくなるメリットがあります。
上手に感情移入させてあげることで、購買意欲を高めることも可能です。

 

例えば、こんな感じです。

 

 

 

ただし、吹き出しを多用すると見づらくなるので注意です。

 

吹き出しを上手に使って、収益アップに繋げていきましょう！以上です。

 

無料で登録しておく→無料イラストなら【イラストAC】