マジセミドライブ

ウェビナー関連のニュースやITサービス&ツールの最新情報を随時配信します。

AIツール実験室

2023.06.30

【ChatGPT使ってみる実験室】 WordPress関数を作って記事リストを出力

【ChatGPT使ってみる実験室】 WordPress関数を作って記事リストを出力

コンテンツ

はじめに

日本全国の「WordPress管理者組合構成員」のみなさま、
おつかれさまです。

狩野英孝氏の「逆転裁判」実況動画で、「エイコー氏の全キャラフルボイスアテレコ」「クセが強すぎるキャラクター達」「仕組まれすぎているシナリオ」などを楽しく拝見している、
マジセミ担当者Aでございます。

今回は、
「【ChatGPTプラグイン探訪】記事リストポータル」ページを作成してみたいと思います。

そこらのプラグインを使えば手っ取り早そうですが、
あえて作ってみることにします。

※本記事は、担当者Aの主観により作成されていますので、なにとぞ、そういうことでよろしくお願いします。

今回の作戦概要

WordPressの「functions.php」にPHP関数を追加します。

記事内にショートコードを配置するだけで、
「記事リストがしれっと出てきてしまう」ことを期待するわけであります。

よいこのお約束

やってみる同志がいるのかわかりませんが、
ちゃんとバックアップを取ってからやりましょう。そうしましょう。

大変なことになってしまっても、
「自業自得」「自己責任」「諸行無常」ということでお願いします。

タスク①PHP関数を作成します(作成してもらいます)

プロンプト

■指示
WordPressの「functions.php」に関数を作成します。
関数のコードを作成してください。

■関数仕様
・関数名=「staffA_get_article_chatGptPlugin」
※補足:他の関数名とうっかりかぶらないように、「staffA」の冠を付けています。
・記事リストを出力する
・記事カテゴリID=「339」のみを出力する
※補足:記事カテゴリ「ChatGPTプラグイン探訪」のIDを指しています。
・ショートコードを設定する

■出力形式
テーブル形式

■出力項目
①記事登録日
②記事名
③記事URL

■ソート条件
「①記事登録日」降順

■HTMLタグ
作成した関数を実行して表示するための「ショートコードタグ」を出力してください。

■備考
その他、注意点や補足情報などがあったら、教えてください。

実行結果

らくちんです。
助かります。

ChatGPT4が作ってくれたコード(一部修正)

function staffA_get_article_chatGptPlugin() {
    // WP_Query arguments
    $args = array(
        'category'         => 339,
        'orderby'          => 'date',
        'order'            => 'DESC',
    );

    // The Query
    $query = new WP_Query( $args );

    // The Loop
    if ( $query->have_posts() ) {
        $output = '<table>';
        $output .= '<tr><th>登録日</th><th>記事名</th><th>URL</th></tr>';
        while ( $query->have_posts() ) {
            $query->the_post();
            $output .= '<tr>';
            $output .= '<td>' . get_the_date() . '</td>';
            $output .= '<td>' . get_the_title() . '</td>';
            $output .= '<td><a href=""' . get_permalink() . '"">' . get_permalink() . '</a></td>';
            $output .= '</tr>';
        }
        $output .= '</table>';
    } else {
        // no posts found
        $output = '該当する記事が見つかりませんでした。';
    }

    // Restore original Post Data
    wp_reset_postdata();

    return $output;
}

//★ちょっと修正★
//ショートコード名がかぶらないように、フル名称にしておきます。
//add_shortcode('staffA_get_article', 'staffA_get_article_chatGptPlugin');
add_shortcode('staffA_get_article_chatGptPlugin', 'staffA_get_article_chatGptPlugin');

「functions.php」にコピペします

staffA専用領域を確保しました。

タスク②WordPressページを作ります

作りました

「★start★」と「★end★」の間に記事リストを出してみます。

タスク③ページを開いて実行します(1回目)

思っていたよりたくさん出てしまいました

2件だけ出るはずなのに、どっさり出ました。

◯:ショートコード実行は機能している
✕:カテゴリIDによる抽出がうまくいっていない

直してもらいましょう。

タスク④コード修正 カテゴリID抽出機能

プロンプト

■指示
WordPressの「functions.php」で関数を作成しています。
関数のコードを修正してください。

■修正点
以下のコードでは全記事が出力されてしまいます。
記事カテゴリID=「339」のみを出力するように修正してください。

■備考
関連する情報を検索して、最新情報をベースとして修正してください。

実行結果

「category」ではなく「cat」が正しいようです。

修正してもらったコード

function staffA_get_article_chatGptPlugin() {
    // WP_Query arguments
    $args = array(
        'cat'              => 339,
        'orderby'          => 'date',
        'order'            => 'DESC',
    );

    // The Query
    $query = new WP_Query( $args );

    // The Loop
    if ( $query->have_posts() ) {
        $output = '<table>';
        $output .= '<tr><th>登録日</th><th>記事名</th><th>URL</th></tr>';
        while ( $query->have_posts() ) {
            $query->the_post();
            $output .= '<tr>';
            $output .= '<td>' . get_the_date() . '</td>';
            $output .= '<td>' . get_the_title() . '</td>';
            $output .= '<td><a href=""' . get_permalink() . '"">' . get_permalink() . '</a></td>';
            $output .= '</tr>';
        }
        $output .= '</table>';
    } else {
        // no posts found
        $output = '該当する記事が見つかりませんでした。';
    }

    // Restore original Post Data
    wp_reset_postdata();

    return $output;
}
add_shortcode('staffA_get_article_chatGptPlugin', 'staffA_get_article_chatGptPlugin');


タスク⑤ページを開いて実行します(2回目)

修正コード成功です

予定通り2件のみ出てきました。
グッドですね。

次は、表示フォーマットを修正してもらいましょう。

タスク⑥コード修正(1回目)

プロンプト

■指示
WordPressの「functions.php」で関数を作成しています。
関数のコードを修正してください。

■修正点①:テーブルタイトル行項目名
「URL」→「ページ」

■修正点②:記事名修正
【ChatGPTプラグイン探訪】数学+ナレッジプラグイン「 Wolfram 」 → 数学+ナレッジプラグイン「 Wolfram 」
※【ChatGPTプラグイン探訪】をカット

■修正点③:登録日の表示データフォーマット
「2023年6月27日」→「2023/06/27」
・月と日は「2桁ゼロ埋め」

■修正点④:「URL」(ページリンク)の表示
「https://majisemi.com/topics/chatgpt-plugin/4147/」→「ページリンク」

■備考
・関連する情報を検索して、最新情報をベースとして修正してください。
・不明点は質問してください。

実行結果

修正してもらったコード

function staffA_get_article_chatGptPlugin() {
    // WP_Query arguments
    $args = array(
        'cat'              => 339,
        'orderby'          => 'date',
        'order'            => 'DESC',
    );

    // The Query
    $query = new WP_Query( $args );

    // The Loop
    if ( $query->have_posts() ) {
        $output = '<table>';
        $output .= '<tr><th>登録日</th><th>記事名</th><th>ページ</th></tr>';  // 修正点①
        while ( $query->have_posts() ) {
            $query->the_post();
            $output .= '<tr>';
            $output .= '<td>' . get_the_date('Y/m/d') . '</td>';  // 修正点③
            $title = get_the_title();
            $title = str_replace('&#8203;``oaicite:{""number"":2,""invalid_reason"":""Malformed citation 【ChatGPTプラグイン探訪】""}``&#8203;', '', $title);  // 修正点②
            $output .= '<td>' . $title . '</td>';
            $output .= '<td><a href=""' . get_permalink() . '"">ページリンク</a></td>';  // 修正点④
            $output .= '</tr>';
        }
        $output .= '</table>';
    } else {
        // no posts found
        $output = '該当する記事が見つかりませんでした。';
    }

    // Restore original Post Data
    wp_reset_postdata();

    return $output;
}
add_shortcode('staffA_get_article_chatGptPlugin', 'staffA_get_article_chatGptPlugin');


タスク⑦ページを開いて実行します(3回目)

修正結果確認

修正点①:テーブルタイトル行項目名 →OK

「URL」→「ページ」

修正点②:記事名修正 →★NG★

【ChatGPTプラグイン探訪】数学+ナレッジプラグイン「 Wolfram 」 → 数学+ナレッジプラグイン「 Wolfram 」

【ChatGPTプラグイン探訪】がカットされていません。
プロンプト指定がいまいちだったのかもですね。
修正してもらいましょう。

修正点③:登録日の表示データフォーマット →OK

「2023年6月27日」→「2023/06/27」
・月と日は「2桁ゼロ埋め」

修正点④:「URL」(ページリンク)の表示 →OK

「https://majisemi.com/topics/chatgpt-plugin/4147/」→「ページリンク」

タスク⑧コード修正(2回目)

プロンプト

■指示
WordPressの「functions.php」で関数を作成しています。
関数のコードを修正してください。

■修正点②-2:記事名修正
記事名の表示テキストから”【ChatGPTプラグイン探訪】”を削除して表示してください。
・オリジナル:【ChatGPTプラグイン探訪】数学+ナレッジプラグイン「 Wolfram 」
・削除後:数学+ナレッジプラグイン「 Wolfram 」

■修正点⑤:リンククリック時動作
「ページリンク」をクリックしたら、別タブでページが開くようにしてください。

■修正点⑥:コード内のコメント
コメントは日本語で記述してください。

■備考
・関連する情報を検索して、最新情報をベースとして修正してください。
・不明点は質問してください。

実行結果

修正してもらったコード

function staffA_get_article_chatGptPlugin() {
    // WP_Queryの引数
    $args = array(
        'cat'              => 339,
        'orderby'          => 'date',
        'order'            => 'DESC',
    );

    // クエリ
    $query = new WP_Query( $args );

    // ループ
    if ( $query->have_posts() ) {
        $output = '<table>';
        $output .= '<tr><th>登録日</th><th>記事名</th><th>ページ</th></tr>';  // 修正点①
        while ( $query->have_posts() ) {
            $query->the_post();
            $output .= '<tr>';
            $output .= '<td>' . get_the_date('Y/m/d') . '</td>';  // 修正点③
            $title = get_the_title();
            $title = str_replace('【ChatGPTプラグイン探訪】', '', $title);  // 修正点②-2
            $output .= '<td>' . $title . '</td>';
            $output .= '<td><a href=""' . get_permalink() . '"" target=""_blank"">ページリンク</a></td>';  // 修正点⑤
            $output .= '</tr>';
        }
        $output .= '</table>';
    } else {
        // 投稿が見つからなかった場合
        $output = '該当する記事が見つかりませんでした。';
    }

    // 元の投稿データを復元
    wp_reset_postdata();

    return $output;
}
add_shortcode('staffA_get_article_chatGptPlugin', 'staffA_get_article_chatGptPlugin');


タスク⑨ページを開いて実行します(4回目)

修正結果確認

修正点②-2:記事名修正 →OK

記事名の表示テキストから”【ChatGPTプラグイン探訪】”を削除して表示してください。

修正点⑤:リンククリック時動作 →OK

「ページリンク」をクリックしたら、別タブでページが開くようにしてください。

修正点⑥:コード内のコメント →OK

コメントは日本語で記述してください。

とりあえず一応完成とします

このような感じで、とりあえずOKですかね。

このページは「実験ページ」として、引き続き、いじっていきたいと思います。

表示件数が増えてきたら、ページネーションなどが必要になってきそうですが、
それはまたその時に、いじってみようと思います。

エラーなどが出ていた場合は、「それはそれ、これはこれ」として、なまあたたかく見守ってあげてください。

→【ChatGPTプラグイン探訪】記事リストポータル

まとめ

WordPress関数を作ってみたことはなかったのですが、
それなりに動くものができました(作ってもらいました)。

「記事リストを出す」のようなちょっとしたことなら、
『業者さんに発注せずに自分達でやってしまう』
というオプションを用意しておくのも、ありかもしれません。

次回予定「AI対抗テーブル装飾デザインセンス選手権!」

とりあえずできたものの、テーブル表示がシンプルすぎます。

次回は、
「AI対抗テーブル装飾デザインセンス選手権」を開催したいと思います。

どちらのAIさんが、ナイスな装飾をしてくれるのか、期待しましょう。

【お知らせ】「マジセミ」のご紹介

「マジセミ」では、日々、多くのIT関連セミナーを開催しています。

多くのセミナーの中から「ご自身のスキルやビジネスを強化できるセミナー」を見つけて、ぜひ1度、参加してみてください。

マジセミのイメージロゴ

マジセミ関連プラットフォーム

プラットフォーム 説明 URL
マジセミ マジセミで実施されるさまざまなセミナーの開催情報を確認できます。
「IT関連セミナー」「製造業関連セミナー」など、ご自身のビジネスを強化できるセミナーを検索できます。
→majisemi.com
マジセミサービス セミナーを開催したい方向けの情報を確認できます。
トライアルからの利用が可能です。
→majisemi.com →service
マジセミドライブ 「IT関連コンテンツ」などを紹介しています。 →majisemi.com
→topics
マジセミFacebook 毎日「マジセミ関連情報」や「IT関連ニュース」などを紹介しています。
★フォローお願いします。
→facebook.com
→OSSNews
マジセミTwitter マジセミFacebookと同様に、
毎日「マジセミ関連情報」や「IT関連ニュース」などを紹介しています。
★フォローお願いします。
→twitter.com
→Majisemi_it

※「ご意見」「ご感想」「誤字がありましたよ」「こんな使い方もあるみたいですよ」などありましたら、
マジセミSNS(Facebook or Twitter)まで、お知らせください。

おすすめの記事

【トレンド解説】超入門「 スマートファクトリー 」🏭

トレンド解説

2024.04.15

【トレンド解説】超入門「 スマートファクトリー 」🏭

「 スマートファクトリー 」への理解を深めるための解説として、初心者向けにわかりやすくまとめた記事です。「新しい工場の概念」「デジタルツインの活用」「IoT技術による最適化」など、現代の製造業に必要な知識を効果的に学べます。 スマートファクトリー の導入によるメリットを具体的に解説しています。

【ChatGPT探訪】「 無限議論 」〜最強スタンド考察〜🤔

ChatGPT探訪

2024.05.07

【ChatGPT探訪】「 無限議論 」〜最強スタンド考察〜🤔

マジセミSNSに投稿した 【担当者A】の「 無限議論 」〜最強スタンド考察〜💬 を記事化したものです。 ChatGPTに課金していないみなさんにも、 AI同士の議論をお楽しみいただけます👍 ※原稿テキストを放り込むだけで、 ジョジョ風イラストを作成してしまう生成AIがすごくないですか?

【トレンド解説】米国における「 生成AI活用 」最新動向📈

トレンド解説

2024.05.07

【トレンド解説】米国における「 生成AI活用 」最新動向📈

「米国における 生成AI活用 最新動向」について解説しています。生成AIは日本企業にも多くの可能性をもたらし、「デスクワークの効率化」や「業務の自動化推進」に貢献しています。生成AIを理解し、活用することが、グローバルな競争力を高める鍵となります。