【スワロー】41種類のショートコードの使い方を知ってブログ作業を快適に！

こんな悩みを解決する記事を書きました。

 

ショートコードというのは、複雑なHTMLや埋め込みコードの心配をすることなく、コンテンツを簡単に作成、変更できるものです。

 

 

簡単に言うと、吹き出しや四角の囲いなどが簡単に作れるというものです。

 

この記事では、スワローのショートコードを内容別にまとめています。

 

 

この記事を読み終えると、スワローのショートコードで、キレイでシンプルなブログを簡単に作り上げることができます。

＼シンプルでオシャレな理由を丁寧に解説 ／

スワローのショートコードの使い方一覧

スワローのショートコード①：吹き出し

吹き出し機能は3つ用意されています。

吹き出しのオプションを説明しておきます。

オプション	説明
icon=””	アイコン画像を設定。””の間にURLを入力
name=””	アイコンの名前を設定。””の間に任意のテキストを入力
type=””	デザインタイプを選択。（複数設定可能。複数設定する場合は半角スペースをあけて入力していく）””の間に   アイコンを左 … l   アイコンを右 … r   アイコンを大きく … big   Facebook風… fb   LINE風… lineなどを入力

[voice icon="アイコンURL" name="名前" type="タイプ"]コメント[/voice]

上記の部分に自分で設定することで、いろいろな吹き出しを作ることができますよ。

ノーマル（左）

[voice icon="アイコンURL" name="あなた" type="l"]コメント[/voice]

ノーマル（右）

[voice icon="アイコンURL" name="あなた" type="r"]コメント[/voice]

LINE風（左）

[voice icon="アイコンURL" name="あなた" type="l line"]コメント[/voice]

LINE風（右）

[voice icon="アイコンURL" name="あなた" type="r line"]コメント[/voice]

Facebook風（左）

[voice icon="アイコンURL" name="あなた" type="l fb"]コメント[/voice]

Facebook風（右）

[voice icon="アイコンURL" name="あなた" type="r fb"]コメント[/voice]

アイコンを大きく

[voice icon="アイコンURL" name="あなた" type="r big"]コメント[/voice]

アイコン枠（赤色）

[voice icon="アイコンURL" name="あなた" type="l icon_red"]コメント[/voice]

アイコン枠（黄色）

[voice icon="アイコンURL" name="あなた" type="l icon_yellow"]コメント[/voice]

アイコン枠（青色）

[voice icon="アイコンURL" name="あなた" type="l icon_blue"]コメント[/voice]

アイコン枠（黒色）

[voice icon="アイコンURL" name="あなた" type="l icon_black"]コメント[/voice]

スワローのショートコード②：BOX

BOX（青色）

[box class="blue_box" title="ここにタイトル"]ここにコンテンツを記載[/box]

BOX（赤色）

[box class="red_box" title="ここにタイトル"]ここにコンテンツを記載[/box]

BOX（黄色）

[box class="yellow_box" title="ここにタイトル"]ここにコンテンツを記載[/box]

BOX（緑色）

[box class="green_box" title="ここにタイトル"]ここにコンテンツを記載[/box]

BOX（ピンク色）

[box class="pink_box" title="ここにタイトル"]ここにコンテンツを記載[/box]

BOX（グレー色）

[box class="glay_box" title="ここにタイトル"]ここにコンテンツを記載[/box]

BOX（黒色）

[box class="black_box" title="ここにタイトル"]ここにコンテンツを記載[/box]

BOX（タイトルなし）

[box class="box"]ここにコンテンツを記載[/box]

補足説明

[aside] 
　補足説明を追加することができます。 
[/aside]

注意書き

[aside type="warning"]
注意説明を追加することができます。 
[/aside]

アコーディングタイトル

[[open title="ここにタイトル"]目次のようにタイトルを閉じておけます。[/open]]

[open title=”ここにタイトル”]目次のようにタイトルを閉じておけます。[/open]

スワローのショートコード③：ボタン

ボタンの種類は主に4つあります。

デフォルトボタン

[btn]デフォルトボタン[/btn]

デフォルトボタン（大）

[btn class="big"]デフォルトビッグボタン[/btn]

シンプルボタン

[btn class="simple"]シンプルボタン[/btn]

シンプルボタン（大）

[btn class="simple big"]シンプルビッグボタン[/btn]

立体的なボタン（黄色）

[btn class="rich_yellow"]立体的なボタン（黄色）[/btn]

立体的なボタン（ピンク色）

[btn class="rich_pink"]立体的なボタン（ピンク色）[/btn]

立体的なボタン（オレンジ色）

[btn class="rich_orange"]立体的なボタン（オレンジ色）[/btn]

立体的なボタン（緑色）

[btn class="rich_green"]立体的なボタン（緑色）[/btn]

立体的なボタン（青色）

[btn class="rich_blue"]立体的なボタン（青色）[/btn]

角丸ボタン

[btn class="maru"]角丸ボタン[/btn]

スワローのショートコード④：カラム表示

カラム表示は、写真やテキストを横並びに表示できるようになります。

2カラム表示

[colwrap]
[col2]デスクトップの時のみ2カラムになるよ[/col2]
[col2]タブレット＆スマホでは1カラムだよ[/col2]
[/colwrap]

3カラム表示

[colwrap]
[col3]デスクトップの時のみ3カラムになるよ[/col3]
[col3]ショートコードを使うと簡単だよ[/col3]
[col3]タブレット＆スマホでは1カラムだよ[/col3]
[/colwrap]

スワローのショートコード⑤：関連記事のリンク

関連記事のショートコードをまとめてみました。

記事のIDが必要になります。

[kanren postid="記事のID"]

通常表示（関連記事付き）

[kanren postid="1326"]

あわせて読みたい

ワードプレステーマ『スワロー』をたった10分でオシャレにカスタマイズする方法こんな悩める方に記事を用意しました。スワローはシンプルであっという間にオシャレになるんですけど、さすがに何も分からない状態でパソコンの画面をいじるのは厳しい...

通常表示（関連記事なし）

[kanren2 postid="1326"]

あわせて読みたい

ワードプレステーマ『スワロー』をたった10分でオシャレにカスタマイズする方法こんな悩める方に記事を用意しました。スワローはシンプルであっという間にオシャレになるんですけど、さすがに何も分からない状態でパソコンの画面をいじるのは厳しい...

投稿日非表示

[kanren postid="1326" date="none"]

あわせて読みたい

ワードプレステーマ『スワロー』をたった10分でオシャレにカスタマイズする方法こんな悩める方に記事を用意しました。スワローはシンプルであっという間にオシャレになるんですけど、さすがに何も分からない状態でパソコンの画面をいじるのは厳しい...

ラベル非表示

[kanren postid="1326" label="none"]

あわせて読みたい

ワードプレステーマ『スワロー』をたった10分でオシャレにカスタマイズする方法こんな悩める方に記事を用意しました。スワローはシンプルであっという間にオシャレになるんですけど、さすがに何も分からない状態でパソコンの画面をいじるのは厳しい...

別ウィンドウで開く

[kanren postid="1326" target="on"]

あわせて読みたい

ワードプレステーマ『スワロー』をたった10分でオシャレにカスタマイズする方法こんな悩める方に記事を用意しました。スワローはシンプルであっという間にオシャレになるんですけど、さすがに何も分からない状態でパソコンの画面をいじるのは厳しい...

ラベルと投稿日を非表示

[kanren postid="1326" date="none" label="none"]

あわせて読みたい

ワードプレステーマ『スワロー』をたった10分でオシャレにカスタマイズする方法こんな悩める方に記事を用意しました。スワローはシンプルであっという間にオシャレになるんですけど、さすがに何も分からない状態でパソコンの画面をいじるのは厳しい...

複数まとめて表示

[kanren postid="1326,1415,1524"]

あわせて読みたい

ワードプレステーマ『スワロー』をたった10分でオシャレにカスタマイズする方法こんな悩める方に記事を用意しました。スワローはシンプルであっという間にオシャレになるんですけど、さすがに何も分からない状態でパソコンの画面をいじるのは厳しい...

あわせて読みたい

スワローのピックアップコンテンツの設置の仕方【カスタマイズ】この悩みを解決する記事を用意しました。 ピックアップコンテンツは、めちゃくちゃ便利かつキレイに記事やカテゴリーを読者さんに見せることが出来るんです。&nbsp...

あわせて読みたい

iPad だけでWordPressブログの更新するのは可能なの？【PCはいらない？】こんな悩みを解決するための記事を用意しました。 結論から言うと、iPadだけでブログの更新は可能です！ なぜなら、実際に、この記事をiPadだけで書き上げて...

スワローのショートコードの使い方をマスターしよう

スワローのショートコードを紹介しました。

 

ショートコードを利用すると、記事が見やすくなって、読者に与える印象が良くなります。

 

今回挙げたショートコードをコピー＆ペーストして、うまく使いこなして、読者の回遊率を上げましょう。

 

スワロー関連の記事はほかにもあるので、それを見て、シンプルでオシャレなブログにしていきましょう。