レポート作成が捗る!?Microsoft Wordアドインの作り方

2017年1月29日


Microsoft Student Partnersマーケティングチームのがりっち( @garicchi )です。

学生の皆さんはMicrosoft Wordというソフトを使っておられますでしょうか。

多くの学校では教授からのレポート提出形式がPDFだったりWordだったりするのでWordでレポートを書いている学生は多いと思います。

しかし学生の皆さんはWordに不満を持ったことが一度はあると思います。

「あんな機能があったらいいのに…」

と思った方、なんとMicrosoft Wordはプログラミングで拡張機能を作ることができます。

今回はそんなMicrosoft Wordの拡張機能の作り方をご紹介します。

Office アドイン

Wordの拡張機能はアドインと呼ばれます。最新のOffice アドインではHTMLとJavaScriptを利用し、まるでWebアプリを作っている感覚で拡張機能を作ることができます。

Officeアドインについてはこちらのサイトが非常によくまとまっているのでまずはこちらのサイトを見て概要を理解してもらうと良いと思います。

開発環境

Officeアドインの開発環境は以下になります。

  • VisualStudio 2015

Visual Studio 2015についてはこちらの記事を参考にしてインストールしてください。

アドインプロジェクトを作る

では実際にアドインプロジェクトを作っていきましょう。

Visual Studioのメニューバーから[ファイル]>[新規作成]>[プロジェクト]を選択します。

左側のテンプレートから[Office/SharePoint]を選択し、真ん中のリストから[Word アドイン]を選択します。

名前はなんでもいいですが今回は[TestWordAddin]としました。

名前を入れたら[OK]を押します。

プロジェクトが新規作成されると下図のようなプロジェクトになると思います。

この中で重要なファイルは以下の3つになります。

  • Home.html – アドインの見た目を記述するHTMLファイル
  • Home.css – アドインのデザインを決定するcssファイル
  • Homr.js – アドインの機能を書くJavaScriptファイル

Web開発をしたことがある人ならば見たことがある構成だと思います。

この状態でF5キーを押してデバッグ開始してみましょう。

Wordが起動すると思います。

[ホーム]タブを見てみると、[ShowTaskpane]というボタンができていると思います。

これをクリックします。

クリックすると右側にアドインのペインが表示されます。

これが開発したアドインになります。

Home.htmlファイルを見てみると、この見た目と同じようなコードが記述されています。

実際にテキストを選択して[強調表示!]ボタンを押すとテキストがハイライトされます。

アドインの機能を理解する

ではVisualStudioに戻ります。Home.htmlを見てみます。

id=”highlight-button”となっているbuttonタグが先ほどの[強調表示]ボタンとなります。

Home.jsファイルを見てみると、highlight-buttonに対してjQueryでクリックイベントをフックしていることがわかります。

Click時に呼び出されているhighlightLongestWord関数を見てみましょう。

この関数の中ではWord.run関数にfunctionを渡し、その中でwordを操作する処理が記述されています。

Office アドインではこのようにWord.run関数にfunctionを渡すことで処理を実行することができます。

アドインに機能を追加する

ここまで見るとわかる通り、Officeアドインの開発は、jQueryを用いたWebアプリとそう大差はありません。

今回は新しくボタンを1つ作成し、Wordを操作する処理を記述してみましょう。

先ほどのidがhighlight-buttonの下に以下のコードを追記しましょう。

続いてHome.jsに下記のコードを追加します。追加場所はhighlight-buttonのクリックイベントの下です。下図を参考にしてください。

処理内容としては、wordの文字列を取得し、後ろに”テスト”という文字列を追加してwordに反映します。

wordの文字列を取得するにはload関数を呼び出した後にsync関数を呼び出す必要があります。

実行し、[テストボタン]を押すとwordに書かれている文字列の後ろに”テスト”という文字列を入れる処理を実行することができました。

終わりに

今回はWord アドインを開発することでWordをJavaScriptから操作してみました。

Officeアドインはまだまだ資料が少ないのですが、VisualStudioで開発するとコード補間がしっかりしているので自分でいろいろいじってみると楽しいと思います。

みなさんもOfficeアドインを開発してWordにオリジナル機能を付け、レポート作成を効率化しましょう。