バイセル Tech Blog

バイセル Tech Blogは株式会社BuySell Technologiesのエンジニア達が知見・発見を共有する技術ブログです。

バイセル Tech Blog

カスタム投稿間の連携を実装して、サイト運用の工数削減ができた話

こんにちは。開発3部 マーケティングチームの高橋です。私たちのチームでは、バイセルの買取関連サイトやコーポレートサイト等のコーディングを担当しています。
今回はWordPressカスタム投稿のデータ連携を行ない、業務の改善ができたことについて紹介します。

業務改善の背景

バイセルでは、ご利用いただける買取方法のひとつとして、実店舗からの「店頭買取」があり、買取ポータルサイトの各店舗ページに情報を掲載しています。
店舗の情報はWordPressのカスタム投稿UIから運用担当者が登録します。 しかし、その店舗に紐づく「店舗スタッフ」や、どの店舗を利用したかなどの「お客様の声」を設定する際に使用する「店舗の選択肢」については、プラグインの設定を直接編集して手動更新するのが常套的でした。

店舗展開初めの頃は、まだ手動更新に耐えうる頻度だったのですが、次第に店舗数が増えて更新頻度もあがってきたため、この作業を自動化したいと思いました。

作業自動化の要件

運用担当者がカスタム投稿から新店舗の情報を登録したら、別のカスタム投稿画面(下記)の店舗選択肢に自動で新店舗名を追加する。

  • 「店舗スタッフ情報」の担当店舗

  • 「お客様の声」の店頭買取の場合のご利用店舗

選択肢の形式は「storeslag : 日本語店舗名」で設置する(既存の形式を踏襲)

  • 例)「ikebukuro-parco : 池袋パルコ店」

同様の事例を調査

カスタム投稿間でデータ連携した例などを掲載した記事を探し、今回の要件に近しい下記の記事を参考にさせていただきました。

Advanced Custom Fieldsのセレクトボックス・プルダウン(select)で、選択肢を別のカスタムフィールドやデータから引っ張って動的に設定する方法

使用するプラグイン・ファイル

Advanced Custom Fields

Wordpressの固定ページや投稿ページに表示されるデフォルト入力欄(タイトル・記事本文)に加えて入力欄や選択項目などを追加できます。 また、登録情報専用の入力フィールドを用意して後述のCustom Post Type UIと組み合わせて使用することで、情報登録専用の入力画面を作成できます。
Advanced Custom Fields

Custom Post Type UI

Advanced Custom Fieldsで設定したフィールドを基に、カスタム投稿タイプなどを作成します。
Custom Post Type UI

functions.php

カスタムコードなどを登録できる、WordPressで汎用的に使用されるファイルです。今回は、自動反映するためのコードを記入します。

設置コードの作成

設置するフィールドの指定

反映先フィールドの指定方法は参考サイトにはありませんでしたが、下記のようにif文を指定することで特定のフィールドへの反映が可能です。

if($field['name'] === '設定先のフィールド名'){~

選択肢「storeslag : 日本語店舗名」の作成

「storeslag」は $field_key = get_field('slagフィールド名',$post->ID); で取得します。

「日本語店舗名」は $field_val = get_field('店舗名フィールド名',$post->ID); で取得します。

上記をもとに、$field['choices'][$field_key] = $field_val; で作成します。

作成したコード

// --------------------------------------------------------
// カスタム投稿 店舗名をACF選択肢に自動反映
// --------------------------------------------------------
function my_acf_load_field($field) {
    // 反映先フィールドの指定
    if (($field['name'] === '店舗スタッフ情報の担当店舗フィールド名') ||
        ($field['name'] === 'お客様の声の利用店舗フィールド名')) {
        
        // 別の投稿タイプ store_post からデータを取得
        $store_post = get_posts(array(
            'post_type' => 'store_post',
            'posts_per_page' => -1
        ));

        // 選択肢一覧を初期化
        $field['choices'] = array();

        // store_post のデータを選択肢として追加
        foreach ($store_post as $post) {
            $field_key = get_field('slagフィールド名',$post->ID);
            $field_val = get_field('店舗名フィールド名',$post->ID);

            $value = $field_key." : ".$field_val;
            if ($value) {
                $field['choices'][$field_key] = $field_val;
            }
        }
    }
    return $field;
}
add_filter('acf/load_field', 'my_acf_load_field');

※実際のコードを基に内容を編集しています。

まとめ:実装の効果

実装前までは、店舗の情報が追加される度にAdvanced Custom Fields(以下ACF)の設定画面で「店舗スタッフ」と「お客様の声」それぞれの店舗選択肢フィールドに新店舗を手動で追加していました。 しかし実装後は、その作業をおこなう必要がなくなりました。

また実装前まではACFの選択肢を追加するまでの待ち時間のため作業がスムーズに進まないこともありましたが、実装後は店舗を登録した時点で項目が自動反映されているため、その待ち時間もゼロとなり、全体の工数を削減できました。

WordPress管理画面で各店舗ページを追加する必要はありますが、自動反映・更新ができるようになったことで、手動による誤設定のリスクもなくなり、気持ちも楽になりました。

この仕組みは、他サイトでも応用できそうですので、可能なところには導入をすすめていく予定です。

最後に、バイセルではWebコーダー(マーケティングエンジニア)を随時募集しております。
興味のある方はぜひ以下の採用サイトをご覧下さい。
herp.careers