COLUMN コラム

運用

佐々木悠

佐々木悠

Chrome拡張機能を開発して、入れ込み作業のスピードアップを図る

Chrome拡張機能を開発して、入れ込み作業のスピードアップを図る

入れ込み作業時に発生していた煩雑な作業を、Chrome拡張機能により解消・効率化した取り組みをご紹介します。

LYZONは年間20件を超えるSitecore案件を構築・運用しています。しかし、限られたリソースの中でこれらの件数を対応するのは相当な時間を要します。なかでも構築案件では、原稿をCMSに起こす入れ込み作業が多くの比重を占めています。

私たちは、職種の枠組みを超えて、絶えず業務効率化の手法を模索しています。業務効率化をすることでより多くの作業をさばけ、さらに人的ミスを減らし品質の向上にもつながります。

そこで今回は、入れ込み作業を効率化するために、社内向けのChrome拡張機能を開発し、入れ込み作業者の業務を効率化する取り組みを行いました。今回はこの取り組みの背景や、機能についてご紹介いたします。

入れ込み作業で起きていたトラブル

Sitecoreはページや画像を1つの「アイテム」と考え、アイテムごとに固有の32文字の「アイテムID」で管理されています。通常入れ込みする場合はリッチテキストエディターなどを用いるため、インタラクティブにページリンクや画像を挿入でき、直接アイテムIDを見かけることは多くありません。

Sitecoreのリッチテキストエディターを利用してページリンクと画像を入れる場合、以下のようなHTMLが出力されます。

リッチテキストエディターで入れ込みしたコンテンツをHTMLとして表示した図

しかしLYZONの入れ込み作業では、HTMLを記述して入れ込みを行うことがほとんどです。よってアイテムIDも手動で取得しなければなりません。

このとき、アイテム内のQuick Infoセクションにある「Item ID」をコピーするのですが、{110D559F-DEA5-42EA9-C1C8A-5DF7E70EF9}という形式でコピーされてしまいます。そのため、リンク等のページアイテムでは/sitecore/service/notfound.aspx?item=prod%3a%7b110D559F-DEA5-42EA-9C1C-8A5DF7E70EF9%7d%40ja-JPという形式に、画像等のメディアアイテムであれば-/media/110D559FDEA542EA9C1C8A5DF7E70EF9.ashxという形式に、毎回変換しなければなりません。1つのアイテムIDだけでも、何回も文字の追加や削除が発生するため、たとえ技術を持った人であっても、大きな負担となりミスにもつながっていきました。

私たちは、この問題を早急に解決する必要がありました。

ヒアリングをもとにChrome拡張機能を開発

こうした負担やミスを防ぐために、Sitecoreの画面を拡張する社内向けのChrome拡張機能「Sitecore ItemID Viewer」を開発しました。

なおChrome拡張機能は、あくまでJavaScriptによるDOM操作(HTMLの追加や変更)を行うだけなので、Sitecoreそのものには影響することなく、安全に利用できます。

機能の検討にあたっては、入れ込み作業者とヒアリングを重ね、2タイプのコピーボタンを用意しました。

  1. Copy ID:修正等でアイテムIDのみ変更したい場合に、アイテムIDのみがコピーできること
  2. Copy Path<link href="***"></link><img src="***" alt="">などへ属性値を入れる場合に、パスそのものがコピーできること

これら2つのコピーボタンを、各アイテムの「Item ID」フィールドの横にレイアウトすることで、アイテムを確認後すばやくコピーできるようにしました。さらに、コンテンツエディターのアイテムとメディアライブラリーのアイテムでパスが異なるため、アイテムの種類を自動判定し、適切なパスがコピーできるようにしました。

Sitecore ItemID Viewerを導入しコピーボタンが追加されたSitecoreの管理画面

入れ込み作業のスピードアップに貢献

現在はほとんどの入れ込み作業者がインストールをして、活用しています。

入れ込み作業者からはさっそく、「コピーボタンによって作業スピードがあがり、短時間で多くの作業を進められた」との反響があり、実際に業務の効率化や生産性の向上を実感したとのことでした。ほかにも、手作業で行っていた変換の手間も省け、変換ミスによる不具合の発生回数も減らすことに貢献できました。

また、複数のSitecoreバージョン、複数の画面モードでも利用できるため、入れ込み作業者の使用環境を限定することなく、さまざまな案件で活用しています。

入れ込み作業者からいただいたレビューの一部を紹介します。

  • リンクの設置が格段に速くなりました
  • とても仕事が捗り、使いやすいです
  • 何倍もラクになりました
  • 煩わしさが解消されました

また理論値にはなりますが、手作業で変換しようとすると平均30秒近く掛かりますが、コピーボタンであれば1秒程度で済みますので、おおよそ30倍の効率化が可能になったといえます。

まとめ

LYZONではこの機能以外でも、職種の枠組みを超えてさまざまな業務効率化を行い、品質の高い成果物をお客さまにご提供できるような取り組みを進めています。今回ご紹介した機能は社内向けですが、お客さま向けに開発することも可能です。

入れ込みや運用方法などでお困りごとがありましたら、お気軽にお問い合わせください。



※エントリーの内容・画像等は、公開時点での情報に基づきます。
※Sitecoreのバージョンによって実装されている機能が異なります。

この記事を読んだ人はこちらの記事も読んでます

Sitecore導入に関するご相談・資料ダウンロード

導入をご検討・ご依頼の方や、サービスについてご不明点がございましたらお気軽にお問い合わせください。

5分でわかる!CMS比較資料ダウンロード

クリック・タップで拡大、試し読みできます
掲載コンテンツ
  • 世界のCMSについて
  • CMSポイント全体像
  • 大規模向けCMSの優れた機能
  • Web マーケティング...etc