WordPressにWooCommerce入れてネットショップ構築する

概要

お客様からネットショップを作りたいけど、複数の検索を実地したい
というお問い合わせをいただきました。

ネットショップならEC-CUBEかなぁ🤔
って思ったけど、デフォルトでSKU検索とか必要なことができないのに加えて、細かいデザインとかいじるのが、苦手意識あって初心者でも簡単に手が出せることで有名なWordPressを使いたいなって思ってたんですよね。

だから、WordPressのプラグインのWooCommerceを選択しました。
日本語情報少ないけどね。

今回の目標

  • WooCommerceのプラグインを導入
  • サンプルテーマで商品一覧を出力する

上記2つが目標ですね
1つづつやっていきましょう。

WooCommerceのプラグインを導入

まずは、今インストールされているプラグインを確認します。
そもそも初期状態のままだとWooCommerceは入ってないですね。

プラグインの横の「新規追加」をクリックして[Woo]と検索をすれば、なんとなく関連しているプラグインは表示されますが、どれかわからないですよね。

WordPressの管理画面から、「プラグイン」>「新規追加」>”WooCommerce”で検索するとWooCommerceが表示されますので、「今すぐインストール」を押します。

【WooCommerce設定ガイド】 インストールと簡易初期設定

上の通りしたら、一発でヒットした。
検索する文字間違えてたんだな。

ひとまず、WooCommerceのインストールは完了したので、導入までは進めた。

WooCommerce導入
WooCommerce導入

導入は以上となります。

サンプルテーマで商品一覧を出力する

プラグイン導入して有効化すると、上記のようにショップのリンクがあるので、商品を追加するだけで表示がされそうですね。

管理画面にある商品から新規商品を追加します。

商品を追加すると、こういう感じで表示がされる。
ショップページがあって、商品も掲載のしかたが簡単なので、何も気にする必要はないのかなぁ?
商品一覧を出力するもサクッといけましたね。

複数のSKUを絞り込む

これですよね。
ここが一番時間かかりそう。
WooCommerceにも絞り込む設定をする箇所が標準であったのですが、これもこれで使いにくいかなという印象だったので、プラグインを追加して対応をしようと思います。

定番の
Custom Post Type UI
カスタムフィールドテンプレート

上記2つを追加しました。

非常に簡単でした。
カスタムポストタイプ (カンマ区切り)に対して、WooCommerceのスラッグproductを設定するだけで、カスタム投稿が設定できます。

商品作成ページにある商品作成時に指定したカスタム投稿が設定できるようになりましたね。
知ってる人からすると、これって何でもないかと存じますが、
これ知らなかった自分はいつも検索ロジックをPHPで作成する人でしたので、技術力は少し上がるかもですけど、時間がかかり過ぎてました。
結論、あとはこれを検索するだけですね。

それも、この記事でやろうと思いましたが、次の記事でやろうかと思います。

ここまでの苦労話
ローカルでWordPressが構築できなくなってた

WordPressのインストール時に大量のエラーが発生!

どしどしコメントで質問してくれたら答えます。

Follow me!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA