MENU
WP-Search
WP-Search
SEOキーワードツール
SEOキーワードツール
note
WP-Search

【PHPカスタマイズ】Post Snippetsの使い方と設定方法【WordPress】

この記事では、WordPressプラグイン「Post Snippets」の使い方と設定方法を、画像を用いてわかりやすくご紹介します。

Post Snippets(ポストスニペット)」を使えば、ショートコードでPHPカスタマイズを挿入できます。

サイト内のいろんな場所でPHPを実行できるので、Web制作にも大変便利です。

suya

ショートコードなので場所を選びません。

なるほどくん

なるほど!便利そうですね。

Post Snippets」は日本語化されていませんが、英語でも使い方は簡単です。

「Post Snippets」と似た名前のプラグイン「Code Snippets」については、以下をご覧ください。

「Code Snippets」は、子テーマなしでfunction.phpのカスタマイズが可能です。

この記事でできること
  • Post Snippets」のインストールが完了できる
  • Post Snippets」の使い方がわかる
この記事を書いた人

suya @suyasite

この記事を最後まで読めば、WordPress(ワードプレス)のショートコードでPHPカスタマイズを挿入できます。

ぜひ最後まで進めてみてください。

目次

ショートコードとは

ショートコードとは、あらかじめ作成したPHPコードをWordPressサイト・ブログ内のいろいろな場所で呼び出して実行できる短いコードです。

[shortcode]のように書くこともできますし、変数を渡したい場合は、[shortcode variable="value"]のように書くこともできます。

いずれにしろ[]で囲われた文字列がショートコードになります。

説明ショートコードの例
変数を渡さない[shortcode]
変数を渡す[shortcode variable=”value”]
ショートコードの種類

プラグイン「Post Snippets」のメリット

プラグイン「Post Snippets」を使うことで、ショートコードを自由に追加・作成できるようになります。

つまり、ショートコードを通してサイト内のさまざまな場所でPHPコードが実行できます。

function.phpで実現できないPHPカスタマイズを行うには、通常テーマのテンプレートファイル編集などが必要です。

Post Snippets」であれば、テーマファイルの編集なしにPHPカスタマイズが可能となります。

PHPコード以外の定型文の呼び出しも可能

プラグイン「Post Snippets」は、別にPHPコードを登録しないといけないわけではありません。

たとえば「【2023年最新】」などのような定型文を登録しておけば、ショートコードで呼び出せるようになります。

ショートコードに登録しておけば、後から簡単に一括変更することができます

1) プラグイン「Post Snippets」をインストール

WordPress(ワードプレス)にログインしたら、左メニューの[プラグイン][新規追加]をクリックして、[プラグインの検索]をします。

WordPress(ワードプレス)のプラグインを検索して新規追加
[プラグイン]→[新規追加]から、[プラグインの検索]

Post Snippets」を検索して、[今すぐインストール]した後に[有効化]します。

WordPressプラグイン「Post Snippets」のインストール
「Post Snippets」をインストール・有効化

メール通知設定が開くので、[許可して続ける][スキップ]します。

WordPressプラグイン「Post Snippets」の通知設定
Post Snippetsの新規追加

以上で、プラグイン「Post Snippets」のインストール・有効化は完了です。

2) プラグイン「Post Snippets」の使い方

初期設定は必須ではないので、そのままコードを書いていっても大丈夫です。

1) コードの新規追加

左メニューの[Snippets]から[All Snippets]を開きます。

[Add Custom Code][Add New]をクリックします。

WordPressプラグイン「Post Snippets」のコード新規追加
Post Snippetsの新規追加

a) PHP以外の場合(テキスト、HTML、CSS、JavaScript)

[Title]を設定したら、[Code Editer]にPHP以外(テキスト、HTML、CSS、JavaScript)を入力します。

忘れずに[Shortcode]をチェックして、Statusを[InActive]から[Active]に変更して[Save]をクリックします。

WordPressプラグイン「Post Snippets」のHTMLコード追加
Post Snippetsのコード編集(PHP以外)

Title(タイトル)は、ショートコードを呼び出す際の[]の中身(文字列)になります。

[Title]を「test」と設定したら、ショートコード[test]で呼び出せるということです。

作成したショートコードを投稿や外観ウィジェットなどで呼び出してみましょう。

  • ブロックエディタ用のブロックも準備されています。

PHP以外では、テキスト、HTML、CSS、JavaScritpなどが使えます。

ブロックエディタで言うと、カスタムHTMLをショートコードで呼び出すイメージです。

テキストのみの例

日付の一括変更が簡単になります。

【2023年最新】
  • 記事のタイトルなどでは、テーマによってはショートコードが正常に展開(変換)されない場合があります。

HTMLの例

定型文にHTMLやCSSで装飾が可能です。

<span style="font-weight:bold;">【2023年最新】</span>

JavaScriptの例

アドセンスコードをショートコード化して、さまざまな場所に挿入できるようになります。

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-0000000000000000"
     crossorigin="anonymous"></script>
<!-- manuon.com-display-square -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-0000000000000000"
     data-ad-slot="0000000000"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

b) PHPの場合(変数なし)

[Title]を設定したら、[Code Editer]にPHPコードを入力します。

今度は[Shortcode]に加えて[PHP Code]をチェックします。

Statusを[InActive]から[Active]に変更して[Save]で保存します。

WordPressプラグイン「Code Snippets」のPHPコード追加
Post Snippetsのコード編集(PHP)

Title(タイトル)は、ショートコードを呼び出す際の[]の中身(文字列)になります。

[Title]を「test」と設定したら、ショートコード[test]で呼び出せるということです。

作成したショートコードを投稿や外観ウィジェットなどで呼び出してみましょう。

  • ブロックエディタ用のブロックも準備されています。

PHPコード(変数なし)の例

最新の年月を自動取得して更新します。

echo '【' . date('Y') . '年' . date('m') . '月最新】';
  • 記事のタイトルなどでは、テーマによってはショートコードが正常に展開(変換)されない場合があります。

「Post Snippets」がうまく動かないのはなぜですか?

「Post Snippets」がうまく動かない場合は、PHPコードの記述が誤っていることがあります。

セミコロン;のつけ忘れなどに注意しましょう。

c) PHPの場合(変数あり)

[Variable]に変数(文字列)を,カンマ(コンマ)区切りで入力します。

設定した変数は、$variable = "{variable}";のようにして使えます。

WordPressプラグイン「Code Snippets」のPHP変数設定
Post Snippetsのコード編集(PHP変数)

Descriptionには、ショートコードの説明などを記載できます。

PHPコード(変数あり)の例

$year = "{year}";
$month = "{month}";
echo '【' . $year . '年' . $month . '月最新】';

PHP変数(Variable)の例

year,month

変数は、タイトルと一緒に指定してショートコードで呼び出します。

[Title]を「test」と設定した場合、ショートコード[test year="2023" month="12"]で呼び出せるということです。

作成したショートコードを投稿や外観ウィジェットなどで呼び出してみましょう。

  • ブロックエディタ用のブロックも準備されています。

2) カスタムCSS・カスタムJSの新規追加

プラグイン「Post Snippets」では、カスタムCSSやカスタムJSも追加できるようになっています。

WordPressテーマ側で機能を持っている場合も多いですが、テーマに機能がない場合に使えます。

カスタムCSS作成画面

[In Front-End]で読み込む設定にすると、画面下部で読み込むページの詳細設定ができます。

WordPressプラグイン「Code Snippets」のカスタムCSS追加
Post SnippetsのカスタムCSS編集

カスタムJS作成画面

[In Front-End]で読み込む設定にすると、画面下部で読み込むページの詳細設定ができます。

読み込む順番も、[Header][Footer]から選べます。

WordPressプラグイン「Code Snippets」のカスタムJS追加
Post SnippetsのカスタムJS編集

3) プラグイン「Post Snippets」の設定方法

Post Snippets」の設定画面も見ておきましょう。

オプション設定

左メニューの[Post Snippets]から[Options]を開きます。

特に変更の必要はありません。

WordPressプラグイン「Code Snippets」のオプション設定
Post Snippetsのオプション設定

4) プラグイン「Post Snippets」のバックアップ方法

Post Snippets」は、設定データをバックアップできます。

インポート/エクスポート

左メニューの[Post Snippets]から[Import/Export]を開きます。

[Export Snippets]からバックアップデータをエクスポートします。

WordPressプラグイン「Code Snippets」のバックアップ画面
Post Snippetsのバックアップ

バックアップデータから復旧する場合は、[ファイルを選択]して[Import Snippets]します。

この記事のまとめ

プラグイン「Post Snippets」の設定方法と使い方を見てきました。

ショートコードでPHPカスタマイズできるのはとても便利なので、ぜひ使ってみてください。

なるほどくん

試してみます。

SSLプラグイン

この記事の参考情報

Post Snippets公式サイト
この記事が役に立ったらご紹介ください!

コメント

コメントする

目次