ブランディングエディターで提供できるよりも多くのカスタマイズが必要な場合は、独自のカスタムテーマを作成できます。

CSS を理解しているユーザーのみがカスタムテーマを作成する必要があります。

1. 移動先 サービスポータル > テーマをクリックし、[ 新規] を選択します。
2. フォームフィールドに入力し、フォームのコンテキストメニューから [保存] を選択します。

   表 : 1. テーマフォームフィールド

   フィールド	説明
   名前	テーマの名前。この名前を使用して、テーマをポータルに関連付けます。この名前はユーザーには表示されません。
   SCSS コンパイルをオフにする	SCSS のコンパイルをオフにし、プレーン CSS ファイルをクライアントに直接送信します。
   アプリケーション	レコードスコープ。ヘッダーメニューレコードとソーステーブルのアプリケーションスコープは同じである必要があります。
   ヘッダー	ポータルテーマに関連付けることができるsp_header_footerテーブルのヘッダーとフッターのリスト。ヘッダーとフッターはウィジェットであり、同じ方法で設定できます。
   フッター	ポータルテーマに関連付けることができるsp_header_footerテーブルのヘッダーとフッターのリスト。
   固定ヘッダー	ページ上部のヘッダーをロックして、スクロールしてもヘッダーが画面に表示されたままになるようにします。
   固定フッター	ページの下部にあるフッターをロックして、スクロールしてもフッターが画面に表示されたままになるようにします。
   CSS 変数	ポータルの色とスタイルを変更するために使用できる CSS カスタムプロパティ。たとえば、在庫テーマでは、次の変数の一部を使用します。 $sp-logo-margin-x: 15px !default; $sp-tagline-color: $text-color !default; $navbar-inverse-bg: #3a3f51 !default; 注: [CSS 変数] フィールドを使用して CSS 変数のみを定義します。CSS ルールを定義するには、CSS インクルードを使用します。Madrid リリースの時点で、Sass および LESS を CSS インクルード内で使用できます。

3. スタイルシートをテーマに追加するには、[ CSS インクルード ] 関連リストで [新規] を選択します。
4. スタイルシートフォームのフィールドに入力し、[ 送信] を選択します。

   表 : 2. スタイルシートフォームフィールド

   フィールド	説明
   名前	CSS インクルードの名前。CSS インクルードをテーマに関連付けるには、この名前を覚えておいてください。
   アプリケーション	レコードスコープ。ヘッダーメニューレコードとソーステーブルのアプリケーションスコープは同じである必要があります。
   ソース	次のオプションのいずれかを選択します。 スタイルシート:CSS テーブル [sp_css] にアップロードされた内部スタイルシートを追加します。たとえば、ng-sortable.min.css などです。内部スタイルシートは、CSS フィールドで標準 CSS を使用します。 URL:外部スタイルシートへのリンク。外部スタイルシートを使用して、企業の Web サイトやその他のオンラインリソースと同じ CSS を使用します。
   スタイルシート	テーマに関連付ける内部スタイルシート。
   CSS ファイル URL	テーマに関連付ける外部スタイルシートへの URL。
   遅延ロード	CSS インクルードを非同期にロードしてページのロード時間を短縮するオプション。このオプションはテーマのすべての CSS インクルードに対して同じ値に設定する必要があります。テーマに関連付けられた一部の CSS インクルードに対してのみ非同期ロードを有効にすることはお勧めしません。 注: スタイル設定されていないコンテンツが点滅しているポータルで [遅延ロード] を有効にすることはお勧めしません。 [遅延ロード] が有効になっている CSS インクルードは、テーマレコードの [遅延ロード CSS インクルード] 関連リストに一覧表示されます。
   RTL CSS ファイル URL	セッション言語がヘブライ語などの右から左に記述する言語である場合に、ポータルの方向をミラーリングするための外部スタイルシートへの URL。 右から左に記述する言語のサポートについては、「 ポータルでの右から左に記述する言語のスタイリング」を参照してください。

5. JavaScript インクルードをテーマに追加するには、[ JS インクルード ] 関連リストで [新規] を選択します。
6. [JS インクルード] フォームフィールドに入力し、[ 送信] を選択します。

   表 : 3. JS インクルードフォームフィールド

   フィールド	説明
   表示名	JS インクルードの名前。JS インクルードをテーマに関連付けるには、この名前を覚えておいてください。
   アプリケーション	レコードスコープ。ヘッダーメニューレコードとソーステーブルのアプリケーションスコープは同じである必要があります。
   ソース	次のオプションのいずれかを選択します。 UI スクリプト:UI スクリプトテーブル [sys_ui_script] にアップロードされた内部 UI スクリプトを追加します。UI スクリプトを使用してクライアント側の JavaScript を作成し、それを複数の場所で再利用します。UI スクリプトの詳細については、「 UI スクリプト」を参照してください。 URL:外部 JavaScript ファイルへのリンク。外部 URL を使用して、企業 Web サイトやその他のオンラインリソースと同じ JavaScript を使用します。
   UI スクリプトまたは JS ファイルの URL	[ソース] フィールドで選択したオプションに応じて、内部 UI スクリプトまたは JavaScript ファイルの URL を関連付けます。
   更新日時	JS インクルードが最後に更新された日時
   パッケージ	JS インクルードが関連付けられているサービスポータルパッケージ。たとえば、サービスポータル設定ページなどです。このフィールドはデフォルトで入力されています。