ショートコード一覧

画像・ボタンなどの中央寄せ

[center]中央寄せしたいコンテンツ[/center]

ボタン

[btn1 href="リンクのURL"]ボタンの中に表示するテキスト[/btn1]

ボタンのデザインは「外観」⇒「カスタマイズ」⇒「ボタン」から設定できます。

デザインは最大で3パターン設定できるので、例えばボタン2を挿入したいときは[btn2][/btn2]というように、数字を変更してください。

中央寄せするには、[center][btn1]テキスト[/btn1][/center]などと、ボタン全体を[center][/center]で囲います。

2つ以上のボタンを横に並べる

横並びにしたいボタン全てに「class=”parallel”」を追加します。

[btn1 href="" class="parallel"]テキスト[/btn1][btn1 href="" class="parallel"]テキスト[/btn1]

リンクを新しいタブで開く

「target=”_blank”」を追加します。

[btn1 href="" target="_blank"]テキスト[/btn1]

アフィリエイトリンクをボタンにする方法

ブロックエディタの場合

まずは「カスタム HTML」ブロックを配置し、アフィリエイトリンクのコードを貼り付けます。

あとは、コードの中のaタグに、btn・btn〇の2つのクラスを追加するだけです(〇の数字はボタンの番号に合わせて変更してください)。

<a class="btn btn1" href="">ボタン</a>

クラシックエディタの場合

テキストエディタにアフィリエイトリンクのコードを貼り付けます。

あとは、ブロックエディタの場合と同じようにクラスを追加してください。

<a class="btn btn1" href="">ボタン</a>

ボックス

[box2]ボックスの中に入れるコンテンツ[/box2]

ボックスのデザインは「外観」⇒「カスタマイズ」⇒「ボックス」から設定できます。

デザインは最大で5パターン設定できるので、ボックスの番号に合わせて数字を変更してください。

ボックスにタイトルを付ける

ボックスにタイトルを付けるには「title=””」を追加します。

タイトル付きボックス
[box2 title="タイトル付きボックス"]ボックスの中に入れるコンテンツ[/box2]

リスト

オリジナルのリストの作り方

オリジナルのリストを挿入するには、ビジュアルエディタなら「番号なしリスト」や「番号付きリスト」から、テキストエディタなら「ul」「ol」「li」タグで通常のリストを作り、全体をショートコード([list1][/list1]など)で囲むだけです。

箇条書きリスト

リスト1

[list1]コンテンツ[/list1]

  • リスト
  • リスト
  • リスト

リスト2

[list2]コンテンツ[/list2]

  • リスト
  • リスト
  • リスト

リスト3

[list3]コンテンツ[/list3]

  • リスト
  • リスト
  • リスト

リスト4・リスト5

リスト4([list4][/list4])・リスト5([list5][/list5])では、アイコンの色だけでなく種類も自由に設定できます。

設定の仕方はこちらを参考にしてください。

数字リスト

数字リスト1

[olist1]コンテンツ[/olist1]

  1. リスト
  2. リスト
  3. リスト

数字リスト2

[olist2]コンテンツ[/olist2]

  1. リスト
  2. リスト
  3. リスト

リストをボックスの中に入れる

リストをボックスの中に入れるには、リスト全体を[box1][/box1]などで囲めばOKです。

[box3][list1]コンテンツ[/list1][/box3]

  • リスト
  • リスト
  • リスト

リンク

リンク1

[link1 href="リンクのURL"]表示したいタイトル[/link1]

表示したいタイトル

リンク2

[link2 href="リンクのURL"]表示したいタイトル[/link2]

表示したいタイトル

リンクを新しいタブで開く

「target=”_blank”」を追加します。

[link1 href="" target="_blank"]タイトル[/link1]

表は、ショートコードで囲めば特殊な装飾を施すことができるようになっています。

表1

[table1]テーブル[/table1]

ああああああああああああああ ああああああああああああああ ああああああああああああああ
ああああああああああああああ ああああああああああああああ ああああああああああああああ
ああああああああああああああ ああああああああああああああ ああああああああああああああ
ああああああああああああああ ああああああああああああああ ああああああああああああああ

表2

[table2]テーブル[/table2]

ああああああああああああああ ああああああああああああああ ああああああああああああああ
ああああああああああああああ ああああああああああああああ ああああああああああああああ
ああああああああああああああ ああああああああああああああ ああああああああああああああ
ああああああああああああああ ああああああああああああああ ああああああああああああああ

最上段の背景色は、「外観」⇒「カスタマイズ」⇒「表」から設定できます。

表3

[table3]テーブル[/table3]

ああああああああああああああ ああああああああああああああ ああああああああああああああ
ああああああああああああああ ああああああああああああああ ああああああああああああああ
ああああああああああああああ ああああああああああああああ ああああああああああああああ
ああああああああああああああ ああああああああああああああ ああああああああああああああ

左端の段の背景色は、「外観」⇒「カスタマイズ」⇒「表」から設定できます。

YouTube埋め込みのレスポンシブ対応

ページにYouTubeの動画を埋め込むには動画のURLを貼り付けるだけでOKです。

ただし、そのままだと幅の狭い端末で見たときに表示が崩れるので、[youtube][/youtube]で囲うようにしてください。

[youtube]動画URL[/youtube]

【重要】ビジュアルエディタでの装飾について

ビジュアルエディタでは、「スタイル」からいろいろな装飾を施すことができます。

例えば、「ボタン」「ボックス」「リスト」「リンク」「表の装飾」はショートコードを使ったときと同じ効果が得られます。

実際の表示さながらの見た目で記事が書けるので、こちらの方法をおすすめします。

※色の変更などのカスタマイズは、ショートコードと同じように「外観」⇒「カスタマイズ」から設定します。

注意

ボックスの中にボタンを入れるなど、「スタイル」での装飾を入れ子にしようとしても、うまく反映されないことがあります。

その場合は、片方をショートコードにするなどしてください。

また、ボタン1⇒ボタン2のようにスタイルを変える場合は、ボタン1を解除してからボタン2を当てるようにしてください。