数百ページの Concrete CMS へのコンテンツ移行も楽々！Macareux Content Importer アドオンの使い方紹介

新しいCMSに乗り換える際に必ず必要になるのがコンテンツ移行です。長年CMSを使ってコンテンツの更新を行なっていると、たくさんのコンテンツが溜まってきます。コンテンツは資産ですので、もし新しいCMSに乗り換えたい場合でも、これまでのコンテンツを移行したいと思うのは当然のことです。ところが、コンテンツ移行は１ページ１ページ手作業で積算される場合も少なくなく、膨れ上がったコンテンツ移行費用がネックになり、結局同じCMSを使い続けるという選択肢をとられる場合もあるようです。

弊社では、創業以来多くのプロジェクトで Concrete CMS ではないCMSから Concrete CMSへのコンテンツ移行を行なってきました。その経験をもとに「誰でもノーコードでコンテンツ移行できるアドオン」を開発し、また実際の移行プロジェクトで多数使ってきました。本記事ではその Macareux Content Importer アドオンの使い方をご紹介したいと思います。このアドオンがあれば、Webサイトのリニューアルを Concrete CMS のベンダーに発注するクライアントのご担当者でも、使い方を覚えればノーコードでコンテンツ移行を行うことができます。もし費用面でCMSの変更を躊躇されているのであれば、Concrete CMS を有力な選択肢のひとつとしてご検討いただける要因になればいいなと思います。

インストール

本アドオンはオープンソースで配布しており、GitHub からダウンロードできます。

https://github.com/MacareuxDigital/md_content_importer

Zipをダウンロードしたら展開し、フォルダ名を md_content_importer に変更してください。次に、ターミナルやコマンドプロンプトでフォルダを開き、 composer install コマンドを実行して、必要なライブラリをダウンロードしてください。composer コマンドのインストールと使い方は本記事では触れませんので、Composer の公式サイト等をご確認ください。

コマンドを実行すると、フォルダ内に vendor ディレクトリが作成され、その中に必要なライブラリがダウンロードされますので、 md_content_importer フォルダごとサーバーの packages ディレクトリにアップロードしてください。管理画面の「Concrete を拡張」ページに Macareux Content Importer アドオンが表示されますので、インポートボタンをクリックしてください。

インポートバッチの作成

パッケージをインストールしたら、インポートバッチを作成します。管理画面の［システムと設定＞Content Importer＞Batches」ページにアクセスし、「Add Batch」ボタンをクリックします。

バッチの作成画面では、バッチの名前、取り込み元のソース情報、取り込み後の設定が行えます。

Source Paths には、取り込みたいページを改行区切りで入力します。ページは、URLで指定することもできますし、もしHTMLファイルが入手できるなら、サーバーにアップロードしサーバー内の絶対パスで指定することもできます。

Document Root には、取り込みたいページのルートを指定します。この情報は、Concrete CMS に取り込む際のページのパスを生成するために使われます。

例えば、ソースパスが https://www.example.com/foo/bar.html の場合、ドキュメントルートは https://www.example.com と入力してください。ただし、旧サイトがサブディレクトリ /foo/ 以下に展開されていた場合は、 https://www.example.com/foo となります。

また、ソースパスが /var/www/migrate_contents/foo/bar.html の場合は、ドキュメントルートは /var/www/migrate_contents となります。

Target Page Type, Target Page Template, Target Parent Page は、それぞれインポートしたページがどのページタイプ、ページテンプレートで作成され、どの親ページの下に作成されるかを設定できます。つまり、この組み合わせの数だけ、バッチを作成していくことになります。

セレクターの設定

バッチを作成すると、セレクターの設定画面に遷移します。この画面では、選択したページタイプのコンポーザーフォーム要素が一覧表示され、それぞれの要素に対して旧ページのどの部分を抽出するかを設定します。

各要素に対して、「Set Selector」ボタンが表示されますので、クリックすると、セレクターの設定画面に遷移します。

旧ページ内の要素を抽出するために、いくつかの手段が用意されています。Xpath や CSS Selector は、HTML内の一部分を選択するのに便利な手段です。例えば、「main」というidがついた要素を選択したい場合、Xpath では //*[@id="main"] , CSSセレクターでは #main というように書くことができます。JavaScript の経験がないと馴染みがない記述だと思いますが、どちらもブラウザの開発ツールから、対象の要素を右クリックすることでも取得することができます。

また、ファイル名やファイルパスを抽出することができ、これらは移行後のページのURLスラッグを設定するのに役立ちます。

Content Type では、セレクターで選択したHTML要素からどのような情報を取得するかを選択します。Inner HTML は内部のHTMLをそのまま取得します。主にページの本文を抽出するのに便利です。Inner Text は、内部のテキスト情報のみ取得し、HTMLタグを除外します。主にページのタイトルやテキスト属性など、HTMLタグを含められない要素の取得に便利です。Attribute は、要素の属性情報を取得します。例えば、ページに設定されている og:image 情報を取得したい場合、CSSセレクターに meta[property=og\:image] と記述し、Attribute で content 属性を指定すると、うまく取得できます。

セレクターでちゃんと目的の情報が抽出できているかは、「Preview」ボタンをクリックすることで確認できます。

最後に「Add Selector」ボタンをクリックすることで、セレクターの追加が完了です。これを繰り返し、ページの移行に必要な情報を揃えていきます。

トランスフォーマーの設定

セレクターの設定が完了したあとは、必要に応じてトランスフォーマーの設定を行なっていきます。トランスフォーマーは、旧ページから抽出したHTML情報やテキスト情報を加工することができる仕組みです。例えば、次のような加工が可能です。

• タイトルからURLスラッグを生成
• HTML内の特定の要素を正規表現で抽出して加工する（classを変更するなど）
• HTML内の画像やリンクされているPDFファイルなどを、Concrete CMSのファイルマネージャーにアップロードして置き換え
• 旧サイトの記事ページに表示されているタグ情報を、トピック属性にインポート
• など

トランスフォーマーを追加するには、「Add Transformer」ボタンをクリックします。クリックすると、利用可能なトランスフォーマーの一覧が表示されます。

トランスフォーマーもプレビュー機能を備えていますので、実際にどのように加工されるのかを確認しながら設定を進めていくことができます。

特に設定が必要なのはファイルをファイルマネージャーに取り込むためのトランスフォーマーです。

Import files to では、ダウンロードしたファイルをファイルマネージャーのどのフォルダにアップロードするかを選択できます。 

Document Root は、リンク先のURLが https:// から始まっていなかった場合に、入力した情報を前につけることができます。例えば、旧サイトでは画像のURLが /uploads/foo.jpg のように / から始まっていたとします。これでは、URLとして不完全なのでファイルがダウンロードできません。Document Root に https://www.example.com と入力すると、 https://www.example.com/uploads/foo.jpg のようにURLを補完して正しいファイルをダウンロードします。

File Extensions to allow download には、ダウンロードを許可する拡張子の一覧を入力することができます。通常、リンク先の拡張子が .html や .php などであった場合、それらのリンク先はページとして取り込むべきなので、ファイルマネージャーにアップロードしないように除外します。

Allowed host to download files には、ダウンロードを許可するサーバーのドメイン名を入力します。通常、旧サイトでも外部のファイルを参照していた場合、リニューアル後もそのまま外部のファイルを参照してよいため、そのようなファイルもファイルマネージャーにはアップロードしない方が良いはずです。ここで入力した以外のドメインのファイルは無視されます。

インポートの実施とログ

セレクターとトランスフォーマーの設定が完了したら、あとはインポートを実施するだけです。バッチ一覧画面で「Import」ボタンをクリックすると、インポートが実施できます。インポートの際はモーダルが表示され、すでにインポート済みのページをスキップするかどうかを選択できます。

インポートの実施結果は、Batch Logs ページから確認できます。また、インポート中にファイルマネージャーにアップロードしたファイルは、 File Logs ページから確認できます。どちらもログに残すことで、重複取り込みを避ける仕組みになっています。

カスタマイズ

本アドオンでは、属性としてはテキスト・テキストエリア・ファイル・日付・トピックの５タイプ、ブロックは記事ブロックにしか対応しておりません。ほとんどの場合、これで足りますが、もしそれ以外の属性やブロックに対応したい場合は、カスタマイズすることができます。

カスタマイズ方法については、GitHubリポジトリのREADMEに記載していますので、参考にしてください。

また、カスタマイズのご依頼も受け付けておりますので、お問い合わせフォームからお問い合わせください。