ショートコード

1. ショートコードとは?

ショートコードとは、WordPressで**「複雑な機能や定型文を、短いコード(記号)だけで呼び出す仕組み」**のことです。

通常、ボタンを作ったり、新着記事一覧を表示したりするには、長いHTMLやプログラミング(PHP)の知識が必要ですが、ショートコードを使えば [ ] で囲まれた短い文字列を入力するだけで、それらの機能を簡単に配置できます。

Cocoonにおける役割

Cocoonは非常に多機能なテーマであるため、標準機能として多くの便利なショートコードが用意されています。これにより、初心者でもプロのようなデザインや機能を1行で実装できます。


2. ショートコードの具体的な使い方

手順A:ブロックエディタ(Gutenberg)で使う

現在のWordPress(ブロックエディタ)では、専用のブロックを使って配置するのが最もスムーズです。

  1. 投稿編集画面で「+(ブロックを追加)」をクリックします。
  2. 検索窓に「ショートコード」と入力し、ショートコードブロックを選択します。
  3. 表示された入力欄に、使いたいコード(例:
    Googleドライブ オーナー権限の移譲
    会員だけ閲覧可能なページ
    ショートコード
    ツールチップ
    メールの使い方
    )を貼り付けます。
  4. プレビューまたは公開して、実際の画面で機能しているか確認します。

手順B:Cocoon専用のツールバーから挿入する

Cocoonには、よく使うショートコードをマウス操作だけで挿入できる機能があります。

  1. 編集画面の「段落ブロック」を選択します。
  2. ツールバーにある「ショートコード」というドロップダウンメニューをクリックします。
  3. 「新着記事一覧」「人気記事一覧」「評価スター」など、挿入したい項目を選ぶだけで、自動的にコードが入力されます。

3. Cocoonでよく使われる便利なショートコード例

Cocoonで特によく使われるショートコードをいくつか紹介します。

機能ショートコードの書き方説明
新着記事一覧
Googleドライブ オーナー権限の移譲
会員だけ閲覧可能なページ
ショートコード
ツールチップ
メールの使い方
最新の記事を5件表示します。
人気記事一覧
GIMP 選択範囲を透明にする
QRコードのURLへジャンプする方法
エクセル表(の内容)をGoogleKeepで表示する方法
WordpressにGoogle スプレッドシートを埋め込む
nuro光に変更
全期間のPV数に基づいた人気記事を表示します。
評価スター4.55つ星形式で4.5の評価アイコンを表示します。
ログイン限定[login]〜[/login]ログインしているユーザーにだけ中身を表示します。

4. 注意点

  • 半角入力を守る: []、中の文字はすべて半角である必要があります。全角([ ])だと正しく動作しません。
  • プレビューで確認: ショートコードは編集画面上ではただの文字列に見えます。実際の見た目を確認するには、必ず「プレビュー」ボタンを押してください。

プロのヒント:

自分でよく使う定型文(挨拶や広告コードなど)をショートコード化したい場合は、WordPress管理画面の [Cocoon設定] → [アフィリエイトタグ] や、別プラグインの「Shortcoder」などを使うと、さらに作業が効率化できます。

コメント