はじめに
ServiceNowの個人開発環境でポータルを作ってヘッダーとフッターの作成もしてみました。
「ポータル作成ってどんな機能あるの？」「ヘッダーとフッターってどうやって付けるの？」 となったので作成のメモを残しておきます。
環境
- 個人用開発インスタンス（PDI）
- バージョン：Utah
- 権限：admin
PDI作成方法は下記ページなどご参照ください
参考：[ServiceNow]10分で掴む! Utah版の開発インスタンス(PDI)の作成
ポータル作成機能の整理
ポータル作成はService Portal Configurationで行います。
Service Portal Configurationには主に下記の機能があります
| 機能 | 内容 |
|---|---|
| Branding Editor | CSS style設定。タイトル、ロゴ、テーマカラーのカスタマイズ |
| Designer | ウィジェットのレイアウトをドラック＆ドロップで作成 |
| Page Editor | ページの詳細設定 |
| Widget Editor | 既存ウィジェットのカスタマイズとオリジナルウィジェットの作成 |
| New Portal | ポータルの新規作成 |
| Portal Table | ポータルのテーブル情報を編集 |
ポータルの新規作成方法については下記ページなどをご参照ください。
参考： 【ServiceNow】Service Portalの作成
ポータルの作成ができましたが、ヘッダーとフッターがなくて少し寂しいです。
ヘッダーにあるPortal Tableから「ヘッダーとフッターの追加作業」をしていきたいと思います。
ヘッダーフッターの作成とポータルへの追加
今回実施した内容は以下です
- 既存ヘッダーを編集し、ヘッダーのアイテム一覧に「Knowledge」と「My Request」を追加
- 編集したヘッダーと既存フッターのポータルへの追加
（フッターは編集していません）
手順は以下です
1.Portal Tableから「Header|Footer」を選択
2.Stock Headerを選択して「Clone Widget」を選択
既存ヘッダーはPackageが指定されており編集できませんでした。クローンしたものはPackageがGlobalになり編集可能になります。今回はStock Headerをクローンし、既存テンプレから少し追加をしたいと思います。
3.ヘッダーを編集
クローンしたものを「Stock Header_edited」に名前変更しました。
Body HTML templateを選択します
Body HTML templateの27行目当たりに以下のリストを加えてSaveします。
xxxxxx の部分は各々の開発インスタンス名になります。
<li role="presentation">
<a href="https://xxxxxx.service-now.com/testp?id=kb_view" role="menuitem">Knowledge</a>
</li>
<li role="presentation">
<a href="https://xxxxxx.service-now.com/testp?id=requests" role="menuitem">My Request</a>
</li>
4.Portal Tableから「Theme」を選択
5.Themeを新規作成し、ヘッダーとフッターを選択
Newをクリックし、テーマ名を記入（今回はTest Theme）
Headerで先ほど作成した「Stock Header_edited」を選択。Footerは既存の「Sample_Footer」を選択しSave。
6.ポータルへ追加
ヘッダーの「Portals」から作成したポータル名を選択（今回は「Test Portal」）
Themeから先ほど作成したTest Themeを選択しSaveをクリック
無事に「Knowledge」と「My Request」がヘッダーに追加され、フッターも表示されました。
おわりに
今回はServiceNowポータルについて学ぶきっかけがあったのでまとめてみました。
ServiceNowは機能が豊富が故にわたしは迷子になりがちですが、整理してみると良く出来ていてわかりやすいなと思いました。今後もServiceNowの実装で学びがありましたら、まとめていきたいと思います。
ここまで読んでいただけた方はぜひいいねとストックよろしくお願いします。
参考文献：