【WordPress】ボタンの種類

当サイト（cocoonテーマ使用）で利用可能なボタンは全部で3種類です。

ボタン（WordPress標準）

ボタンスタイルのリンクで、訪問者に行動を喚起しましょう。

• 横並びまたは縦並びで、同じブロックに複数ボタンを配置できる。
• リンクは、ボタンテキストに手動で設定する。

<!-- wp:buttons -->
<div class="wp-block-buttons">
<!-- wp:button /-->
</div>
<!-- /wp:buttons -->

ボタン（Cocoon）

一般的なリンクボタンを作成します。

• WordPress標準のボタンより使い勝手が良い。
• サイズ（大）は全幅表示。

ボタン設定

ボタン設定：URL、リンクの開き方（現在のタブで開く・新しいタブで開く）、サイズ（小・中・大）、円形にする、光らせる

<div class="wp-block-cocoon-blocks-button-1 button-block">
<a href="" class="btn btn-shine" target="_self" rel="noopener">ボタン</a>
</div>

囲みボタン

アスリートタグ等のタグを変更できないリンクをボタン化します。

• ブラウザ幅が狭いと全幅表示になるので、デスクトップ以外の端末では、サイズ（小・中・大）指定は意味を成さないかもしれない。
• リンクタグは「[]」で囲んで設定すること。例：［https://www.google.com/］

囲みボタン設定：リンクタグ・ショートコード、サイズ（小・中・大）、円形にする、光らせる

<!-- wp:cocoon-blocks/button-wrap-1 -->
<div class="wp-block-cocoon-blocks-button-wrap-1 btn-wrap btn-wrap-block button-block"></div>
<!-- /wp:cocoon-blocks/button-wrap-1 -->