ウェブサイト(Website)

WordPressからOdooへ、サイトをAIで移行

会社のウェブサイトを、AIと一緒にWordPressからOdooへ移行しました。WordPressのパソコンからOdooのパソコンへ、AIのロボットが荷物を運ぶイラスト

はじめに

私たちマルウェブは、会社のウェブサイトをWordPressからOdooへ移行しました。
Odooへ移行するにあたって、AI(Claude Code)と一緒に構築を進めました。

移行したのは、5つのサイトです。

  • コーポレートサイト(日本語・英語・中国語・ベトナム語)
  • オウンドメディア3つ:中国マーケティングノート Byマルウェブ、Magento Owned Media By Maruweb、Odoo Owned Media By Maruweb(このメディアです)
  • Wiki:ミニプログラムの情報サイト

この記事では、次のことを紹介します。

  • Odooでウェブサイトを作るには、どんな方法があるのか
  • 私たちが、どんな形でOdooに移行したのか
  • AIと一緒に進めてよかったこと、大切だったこと

どうしてOdooに移行したの?

これまでは、ウェブサイトはWordPressで作り、お問い合わせフォームやチャット、お客様の情報はHubSpotで管理していました。

ウェブサイトとお客様の情報が別々のサービスに分かれていると、管理に手間がかかります。
そこで、ウェブサイトもお問い合わせもお客様の管理も、Odooひとつにまとめることにしました。

なぜOdoo.shを選んだのか

Odooを使う方法は、大きく3つあります。自社のサーバーで動かすCommunity版、Odoo社のクラウドをそのまま使うOdoo Online、開発・ステージング・本番をまとめて使えるクラウド環境のOdoo.sh

Odooを使う方法は、大きく3つあります。
無料のCommunity版を自社のサーバーで動かす方法、Odoo社のクラウドをそのまま使うOdoo Online、そしてOdoo.shです。私たちがOdoo.shを選んだ理由は、次の3つです。

サーバーの管理をOdoo社に任せたかった

Community版を自社のサーバーで動かす場合、バックアップやOdooの更新、サーバーの見守り(監視)は、すべて自分たちで行う必要があります。
Odoo.shなら、こうしたサーバーの管理をOdoo社に任せられます。

Enterprise版だけの機能を使いたかった

電子署名の「Sign」、毎月の請求を自動で作る「定期請求」、画面を自由に作り変えられる「Studio」、会計の「繰延」(前受けした売上や前払いした費用を、月ごとに分けて計上するしくみ)など、使いたい機能の多くはEnterprise版だけのものでした。

自社用のプログラムを入れたかった

金額の端数処理、社内の承認の流れ、PDFの帳票など、Studioやアプリの設定だけでは対応できないことがありました。
Odoo Onlineでは、自社で作ったプログラム(モジュール)を入れられません。
Odoo.shなら、自社用のプログラムを入れて動かせます。

請求書をMisocaからOdooへ移したときの話は、MisocaからOdooへ請求書を数千件移した実録で紹介しています。

まとめると、Odoo.shは「自社用のプログラムを動かせる」うえに、「サーバーの管理(バックアップ・更新・監視)はOdoo社に任せられる」環境です。
自社のサーバーにCommunity版を入れて運用するよりも、ずっと手間が少なくすみます。

Odoo.shについて詳しくは、Odoo.shとは?はじめての人向けに解説で紹介しています。

Odooの「ウェブサイト」アプリとは

Odooには、ウェブサイトを作るための「ウェブサイト」アプリが最初から入っています。

Odooのウェブサイトアプリの編集画面。右側に「イントロ」「カラム」「画像」などのブロックが並んでいる
ウェブサイトアプリの編集画面。右側のブロックを選んで、ページに並べていきます

専門的な知識がなくても、画面の上でウェブサイトを作れるのが特長です。

  • ブロックを並べてページを作れる:見出しや画像、文章のまとまりを選んで並べるだけで、ページができます。
  • デザインを選べる:テーマを選べば、サイト全体の見た目をそろえられます。
  • ページやメニュー、検索対策も管理できる:ページの追加やメニューの変更、検索エンジン向けの設定も、同じ画面でできます。
  • ほかのアプリとつながる:お問い合わせフォームから届いた内容を、CRM(顧客管理)にそのまま入れられます。

これからウェブサイトを作るなら、このウェブサイトアプリで作るのが手軽です。

ウェブサイトアプリでは作らなかった理由

ウェブサイトアプリでは作り直さず、AIと一緒に作った独自モジュールで、今のウェブサイトのデザインとURLを保ったままOdooで公開した流れを表したイラスト

私たちは、このウェブサイトアプリでページを作り直すことはしませんでした。

一番の理由は、今のウェブサイトのデザインをそのままに、Odooに移行したかったからです。
ウェブサイトアプリで作ったページには、Odooがもともと持っている見た目のしくみ(※Bootstrap)が自動で入ります。
そのため、今のデザインと混ざってしまい、同じデザインをそのままOdooで再現することができません。

※ウェブサイトアプリのページには、「Bootstrap」というフレームワークが読み込まれます。

また、ページのアドレス(URL)も変えずに移したいと考えていました。
ウェブサイトアプリで作り直すと、ブログの記事などのアドレスが変わってしまい、Google検索などの検索順位(SEO)に影響が出るからです。

そこで、AIと一緒に自社用のアプリ(独自のモジュール)を作り、今のサイトをそのままOdooで動かせるようにしました。
独自のモジュールを入れられるのは、Odoo.shを使っているからこそです。Odoo.shについては、Odoo.shとは?はじめての人向けに解説で紹介しています。

標準アプリと組み合わせて作った

自社用のアプリだけで作ったわけではありません。
Odooに最初から入っている標準のアプリとも組み合わせています。

自社用のアプリのアイコン(Odooの標準のアプリアイコン)

自社用のアプリ

ページや記事を表示し、管理画面から更新できるようにしました。

Odoo CRMアプリのアイコン

CRM(顧客管理)

ウェブサイトのお問い合わせが、お客様の情報としてそのまま入ります。

Odooライブチャットアプリのアイコン

ライブチャット

ウェブサイトを見ている方と、チャットでその場でやりとりできます。

Odooウェブサイトアプリのアイコン

ウェブサイト

ドメインの設定など、ウェブサイトを公開するための土台として使っています。

自社に合わせた部分は自社用のアプリで作り、標準で足りる部分は標準のアプリを使う。
この組み合わせで、手間をかけすぎずに作り上げることができました。

進め方は3つのステップ

移行は、次の3つのステップで進めました。

  1. 今のサイトをそっくり写す:まずは、今のウェブサイトを、見た目もアドレスもそのままOdooで表示できるようにしました。
  2. 社内の人が更新できる形にする:写しただけでは更新できないので、記事やページを管理画面から書きかえられるようにしました。
  3. お問い合わせとチャットもOdooで受ける:お問い合わせフォームはOdooのCRMに、チャットはOdooのライブチャットに切りかえました。お問い合わせの内容はお客様の情報としてCRMに入り、ウェブサイトを見ている方とはライブチャットでその場でやりとりできます。

社内の人が使いやすい管理画面も作った

移行したあとにウェブサイトを更新するのは、社内の担当者です。
WordPressに慣れた人が、Odooでも迷わず更新できるように、管理画面にも工夫をしました。

自社用のアプリで作った記事の管理画面。タイトル、本文のエディタ、公開や分類の設定が並んでいる
記事の管理画面(この記事を書いている画面)
  • Wordのように書けるエディタ:プログラムの知識がなくても、記事の本文を書けます。
  • 保存する前に見た目を確かめられる:ウェブサイトでどう見えるかを、その場で確認できます。
  • 画像を選んで入れられる:アップロード済みの画像から選んで、記事に入れられます。
  • 入力の手間を減らす:ページのアドレスや更新日などは、自動で入るようにしました。

AIと一緒に進めてよかったこと

エンジニアでなくても進められた

今回移行を進めたのは、エンジニアではなく、ウェブデザイナーなどのメンバーです。
AIで制作の流れや構成案を出し、作ってほしいものをAIに伝える。
この流れで、AIと一緒にOdooでウェブサイトを構築することができました。

作業をAIに任せることができた

ウェブサイトの移行には、時間のかかる作業がたくさんあります。
今回は、そうした作業をAIに任せることができました。

  • ページの取り込み:今のウェブサイトの約670ページを、Odooに取り込む
  • 自社用のアプリづくり:ページを表示するしくみや、記事を更新する管理画面を作る
  • 元のページとの見比べ:取り込んだページが、元のページと同じになっているかを全ページ確かめる

どれも、人が1ページずつ進めていたら、何か月もかかる作業です。

作業をAIに任せられたので、人は「どう進めるか」を決めることや、見た目や使いやすさを確かめることに集中できました。

AIに任せるときに大切だったこと

決めたことは、書き残しておく

AIは、やりとりが長くなると、前に決めたことを忘れてしまうことがあります。
そのたびに同じことを伝え直さなければならず、困りました。

そこで、決めたことや失敗から学んだことを、「CLAUDE.md」というファイルに書き残すようにしました。
CLAUDE.mdは、今回使ったAI(Claude Code)が、作業を始めるたびに読みこむ決まりごとのメモです。
こうしておくと、日が変わっても、AIが同じ前提から作業を始められます。

AIに現行サイトの情報をインプットしてもらう

AIは、渡された情報をもとに作業します。
情報が少ないと、AIは推測で作るしかなく、思っていたものと違うものができてしまいます。

そこで、作業を頼むときは、AIが判断に使える情報をできるだけ渡しました。

  • 元のウェブサイトのソースコード
  • 元のウェブサイトの画面のキャプチャ
  • WordPressの管理画面のキャプチャ

情報がそろっていると、AIは現行サイトのソースコードや実際の画面を見て作業できます。
その分、やり直しも少なく、スムーズに開発を進めていくことができました。

実際に使って確かめる

AIが作った画面は、そのまま使うのではなく、人が実際に見て、使ってみて確かめました。

AIは指示した通りに作ってくれますが、「人にとって使いやすいか」「見た目が整っているか」までは判断できません。
そこで、画面のレイアウトや配色、文字の大きさ、ボタンの置き場所、入力の手順などを、人の目で一つずつ確かめ、調整していきました。

分かりにくいところや見づらいところがあれば、AIに伝えて直してもらい、また使ってみる。
これをくり返して、見た目も使い勝手も、だれでも迷わず使える画面に仕上げていきました。

まとめ

Odooには、ウェブサイトを手軽に作れるウェブサイトアプリがあります。
一方で、私たちのようにウェブサイトのデザインやURLを保ったまま移したい場合は、Odoo.shで自社用のアプリを作るという方法もあります。
AIと一緒に進めれば、Odooへの移行も効率的に進めることができます。

Odooの導入にかかる費用は、Odoo導入費用の内訳と料金プラン【2026年版】で解説しています。
Odooでのウェブサイト構築については、Odoo導入・カスタマイズのページをご覧ください。
取引先からの受発注をWeb化したい場合は、BtoB Web受発注システムもご覧ください。

弊社ではOdoo(オドゥ)を利用した業務システムの一元管理・オールインワンな仕組みの構築・開発をして企業様をサポートしています。
ご興味ある方は是非お問い合わせください。

ABOUT ME
Otsuka
株式会社マルウェブで、Webサイトのデザインとコーディングを担当しています。
自社サイトのWordPressからOdooへの移行では、AIと一緒に設計から公開まで進めました。
AIを活用したWebサイト制作や、Odooのカスタマイズに取り組んでいます。
動物ではハムスターが1番好きです。

※注意

本ブログの投稿内容に関するお問い合わせをして頂いてもご返信できませんので、何卒ご了承ください。