ワードプレスにカラーミーのプラグイン入れてみた | 商品登録代行 専門店

カラーミーショップでショップを運営している方のなかには、それとは別にWordPressでメディアサイトなどを開設している方も多いのではないでしょうか。カラーミーの公式WordPressプラグイン活用することで、ショップとサイトを連動させてより自由な発想でECを構築することができます。

ヒント：「カラーミー WPオプション 実際に入れみた」の記事はこちらから御覧ください。

プラグインのインストール手順

デベロッパー登録

WordPressにカラーミープラグインをインストールするにあたって、カラーミーデベロッパーアカウントが必要です。デベロッパー登録の画面からメールアドレスとパスワードを入力して登録手続きを行います。

アプリ作成

登録が完了したら、ログイン画面からログインします。

アプリ一覧画面で「アプリを作成する」をクリックします。

アプリ名は何でもOKなので、分かりやすい名前を入力します。リダイレクトURIは「https（またはhttp）://（ドメイン名）/wp-admin/admin-ajax.php」とします。

アプリが作成できました。画面に表示された「クライアントID」と「クライアントシークレット」がこのあとの手順で必要になるので、控えておきます。

インストール

デベロッパー登録とアプリ作成が完了したら、いよいよWordPressプラグインをインストールします。

WordPressにログインします。プラグイン > 新規追加に進み、「ColorMeShop WordPress Plugin」を検索します。

「カラーミーショップWordPressプラグイン」が見つかったら、「今すぐインストール」をクリックします。

インストールが完了するとボタンが「有効化」に変わるので、クリックします。

カラーミーショップ連携設定

有効化が完了すると、管理画面左側のメニューに「カラーミーショップ」の項目が現れます。これをクリックすると「カラーミーショップ連携設定」の画面が表示されます。

先ほどアプリ作成の際に発行されたクライアントIDとクライアントシークレットを入力し、「変更を保存」をクリックします。

カラーミーショップアカウントで認証する

保存が完了したら、「カラーミーショップアカウントで認証する」をクリックします。

カラーミーのログイン画面が表示されます。カラーミーショップのログインIDとパスワードを入力してログインします。ここで入力するのはデベロッパーアカウントではないので注意して下さい。

画面に表示されたアプリ内容を確認し、同意項目にチェックを入れて「アプリを連携」をクリックします。

連携ができると、WordPressのカラーミーショップ連携設定の「トークン」の欄が入力されます。

WordPressでのページ生成

固定ページの作成

カラーミーショップに登録されている商品情報を表示させるための固定ページを作成します。

WordPressの管理画面のメニューから、固定ページ > 新規追加 に進みます。

ページ名とスラッグは何でもOKですが、ここでは「商品ページ」「colorme」とします。

ページ内容には、ショートコードで「colormeshop_page」と記述します。

作成したら、固定ページ一覧を開き、先ほど作成したページにマウスカーソルを当てます。ブラウザの下部に表示されたURLの「post=」に続く数字がこのページの固定ページIDなので、控えておきます。

連携設定

もう一度WordPressの管理画面のメニューから「カラーミーショップ」をクリックし、カラーミーショップ連携設定の画面に移動します。商品ページIDの欄に、先ほど控えておいた固定ページIDを入力し、「変更を保存」をクリックします。

保存が完了すると、「変更を保存」ボタンの下に、商品・商品カテゴリー・商品一覧・サイトマップのURLが表示されます。

ページの表示例

実際に、カラーミーショップで運営しているショップ「熊本の味　馬刺し屋」をこのサイトと連携してみました。

商品ページ（生 冷蔵 おせち料理 2020 和洋折衷 白木三段重　村上元彦シェフ手作りが入る 送料無料 お節 冷蔵 生詰め 【代引き・キャンセル・同梱不可】）：https://商品登録ドットコム.com/colorme/?colorme_item=141836984

商品カテゴリー：https://商品登録ドットコム.com/colorme/?colorme_page=categories

商品一覧：https://商品登録ドットコム.com/colorme/?colorme_page=items

「熊本の味　馬刺し屋」の商品情報が当サイト内に表示されているのが分かります。CSSでレイアウトを調整すれば、より見栄えの良いページを作ることができます。

商品ページは、URLのクエリパラメータ「?colorme_item=」に続けてカラーミーショップの商品IDを指定します。上記のリンクでは「生 冷蔵 おせち料理 2020 和洋折衷 白木三段重　村上元彦シェフ手作りが入る 送料無料 お節 冷蔵 生詰め 【代引き・キャンセル・同梱不可】」を表示しましたが、別のIDを指定すると他の商品を表示させることができます。

商品ページ（熊本馬刺し屋 馬肉ウィンナー 5本入り 180g）：https://商品登録ドットコム.com/colorme/?colorme_item=141836932

テンプレートとショートコード

テンプレート

上記の表示例で見たページは、固定ページに記述したショートコード「colormeshop_page」に対応するデフォルトのテンプレートで定義されています。

デフォルトのテンプレートは、下記のファイルに定義されています。
/wp-content/plugins/colormeshop/templates/product/default.php

この内容を変更したい場合、上記のdefault.phpと同じ階層に別のテンプレートファイル（例えば、myshop,php）を作成します。ショートコードには、「colormeshop_page template=”myshop”」のようにテンプレートを指定する記述を追加します。

ショートコード

「colormeshop_page」以外にも、さまざまなショートコードが利用できます。

ショートコードは、固定ページだけでなく、WordPressの投稿でも表示させることができます。この投稿でも実際に表示させてみます。

商品情報

[colormeshop_product product_id="141836984" data="name"]

—▼以下がショートコードによる表示です▼—

馬刺し 馬肉 熊本 国産 大盛セット 1280g

—▲ここまで▲—

name（商品名）以外にも、下記のものが指定可能です。

id (商品ID)・model (型番)・price (定価)・regular_price (通常販売価格 (割引前の販売価格))・members_price (会員価格)・unit (単位)・weight (重量)・simple_explain (簡易説明)・
explain (商品詳細説明)

商品画像

[colormeshop_image product_id="141836984" type="main"]

パラメータ「type」を省略した場合、main（メイン画像）が表示されます。他に、thumbnail (サムネイル画像)・other1 (その他画像)が指定可能です。

商品オプション

[colormeshop_option product_id="141836984" data="title"]

—▼以下がショートコードによる表示です▼—

了承して注文する　×　12月30日着（本州）

—▲ここまで▲—

パラメータ「data」を省略した場合、title（オプション名）が表示されます。他に、stocks (在庫数)・models_number (型番)・option_price (販売価格)・option_members_price (会員価格)が指定可能です。

カートボタン

[colormeshop_cart_button product_id="141836984" style="basic"]

[colormeshop_cart_button product_id="141836984" style="cloth_blue"]

[colormeshop_cart_button product_id="141836984" style="cloth_yellow"]

[colormeshop_cart_button product_id="141836984" style="cloth_green"]

[colormeshop_cart_button product_id="141836984" style="washi"]

[colormeshop_cart_button product_id="141836984" style="check_blue"]

[colormeshop_cart_button product_id="141836984" style="check_red"]

パラメータ「style」の指定によって、さまざまなデザインのカートボタンを表示できます。

カラーミーショップでWordPressをサブディレクトリに設置できるの？

　ショップサーブ（Eストアー）やMakeshop・フューチャーショップのように、WordPressをサブディレクトリに設置して運用する事はできなそうです。カラーミーショップでは、下記のようなサブディレクトリ下に
https://basasiya.shop-pro.jp/wp/ などのように設置は現状のプランではできませんでした。因みに、現プランとよくある質問・マニュアルもチェックしてみましたが、カラーミーショップWordPressプラグイン以外の運用ななさそうです。（2020年1月現在）現在では、カラーミーWPオプションを追加する事で、ワードプレス運用が可能となっています。

待望の カラーミーWPオプション ※ 2020年4月20日追記

2020年4月20日追記
待望の カラーミーWPオプション（カラーミーワードプレス プラグイン）
カラーミーのワードプレスプラグインを使って既存wordpressに商品ページ設置方法を記述しましたが、カラーミー内のディレクトリ直下に設置できる、カラーミーのプラグインがリリースされました。
https://basashiya.shop-pro.jp/apps/basashiya/ 　というような設置が可能となりカラーミーでもネットショップにおけるSEOの取り組み方が変わってくるかと思います。
　但し、1点気になる部分で言うと、月額が5,500円とお高めで、カラーミーはお安く高機能が売りでしたよね？レギュラープランが3,000円である事を考えると導入を足踏みする人も多いのではないでしょうか？

このアプリでできること
サーバーやドメインを別途契約をすることなく、ネットショップと同じドメインに「WordPress」を開設することができます。「WordPress」でオウンドメディアを運用することで、商品情報や開発背景などを発信することができ、ユーザーへのアプローチを積極的に行うことができます。また、今まで接触することができなかったユーザーへの認知拡大も可能になり新規顧客獲得にもつながります。

情報引用元： https://app.shop-pro.jp/apps/74

カラーミーWPオプション（カラーミーワードプレス プラグイン）
とは言え、ネットショップにおいても現在はオウンドメディア対策やSEOでの集客の軸となるwordpressを導入できるのは1つのメリットとと言っても良いと思います。現在運用中で、別のwordpressを設置されている場合だと2重運用はなくなりますし、元のWPからリダイレクトをうまくかけて、移行するのも1つの手かもしれません。

カラーミープラグインを活用しよう

プラグインによって、WordPressで運営するサイトへのアクセスをショップの成果に強く結びつけていくことができそうです。ぜひ活用してみてください。

　カラーミーは安くて手軽、他のカートから比べても高機能です。ワードプレスへのプラグインでのEC構築は、色々出ているものの既成のしっかりとしたカートシステムとの連携であれば安心して利用できますよね？ワードプレスではオープンソースで手軽ではありますが、まだセキュリティ面で不安という店舗様も多くいます、そんな場合に、カラーミーショップ＋Wordpress連携がオススメです。

　また、WordPressを運用していて、カラーミーショップのワードプレスへ統合して移行作業代行を依頼したいなどのご相談も可能です、中々大量コンテンツがある場合の作業は大変な部分がありますので、お気軽にお声がけ下さい。カラーミーにてワードプレスでの構築を検討されている方は一度ご相談ください。（カラーミーショップ商品登録代行もお待ちしております）

参考事例おまけ： カラーミーから楽天市場への商品登録代行事例

　カラーミーショップにて売上実績を上げて、ECモールへの展開を考えている、また少しネットショップの功名が見えてきたショップさんなどで、今後多店舗展開を考えている店舗さんからの相談も増えています。出店しやすいという事は始めやすい、始めやすいという事は、カラーミーショップの操作性や初心者の親和性が良いとも言えます。

　さて、カラーミーショップや自社サイトからの楽天市場への移行・移設では、商品数が少ない場合などではそれほど問題ではなくご自分でもできるレベルかと思われます。ただ、商品登録数が多い、店舗内カテゴリーが多い、商品画像が大量に登録されている、コンテンツページを大量に作っている等で楽天市場への移行を困難にしている店舗さんからの相談も多く受けてます。
　
　商品移行・店舗移行作業での商品登録代行依頼では、基本的には何も準備をする必要はなく、すべてお任せで問題ございません。何点か注意点があるとすれば、

• 楽天市場の1枚目の画像規約に抵触していないか？
• カラーミーショップ側に5千品以上の商品が展開している場合、楽天側の出店プランが適合しているか？
• 楽天で取り扱えない商品の取り扱いがないか

がありますのでチェックは必要ですが、お問合せ時点では商品登録ドットコム側でのチェックを行いますので、マルっとお任せ頂ければ対応可能ですので、お気軽にご相談ください。

カラーミーWPオプションを設置してみた