テーマの作成

既存のテーマをコピーし、コピーに変更を加えることによって、新しいテーマを作成できます。新しいテーマにブートストラップ・コンテンツをインポートして使用することもできます。

注:

新しいテーマを作成するか既存のテーマを更新するかとは関係なく、常にテーマのコピーを作成し、そのコピーを操作してください。これをサンプル・サイトまたは実際のサイトのコピーとともにテストし、正常に機能することを確認してください。既存のテーマに対する変更は改訂されたテーマが公開された直後に実装されることに注意してください。

テーマのコピー

ホーム・ページで、「開発者」をクリックします。

「開発者」ページが表示されます。
「すべてのテーマの表示」をクリックします。

既存のテーマのリストが表示されます。「表示」アイコンをクリックしてリストからオプションを選択することにより、テーマがどのように表示されるかを制御できます。
テーマを選択して、右クリック・メニューの「コピー」を選択するか、アクション・バーのをクリックします。

サンプル・ページやコンテンツを含め、テーマのフォルダとファイルがすべてコピーされます。

注:
テーマをコピーする場合、共有情報はコピーされません。
コピーしたテーマの名前を入力します。別のテーマで使用されている名前は使用できません。

名前には、文字、数字、アンダースコア(_)およびハイフン(-)を使用できます。スペースを入力した場合、ハイフンに自動的に置換されます。

テンプレート、テーマ、コンポーネント、サイトまたはサイト・ページについて、authsite、content、pages、scstemplate_*、_comps、_components、_compsdelivery、_idcservice、_sitescloud、_sitesclouddelivery、_themes、_themesdeliveryといった名前を使用しないでください。documentsおよびsitesは、サイト・ページには使用できますが、テンプレート、テーマ、コンポーネントまたはサイトには使用しないでください。
オプションで、テーマの説明を入力します。
「コピー」をクリックします。

進行状況バーに、新しいテーマ名とコピー・ステータスが表示されます。テーマがコピーされると、名前がテーマのリストに表示されます。テーマのリストのテーマ名をクリックすると、テーマを構成するフォルダとファイルを検索できます。
Oracle Content Managementデスクトップ・アプリケーションを使用して、テーマのフォルダとファイルをローカル・システムに同期化します。これにより、ローカル・フォルダを検索し、ファイルを直接操作できるようになります。テーマに対する変更は自動的に同期化されます。お気に入りのHTML、コードまたはテキスト編集ツールを使用して変更を行うことができます。

サイトでカスタム・スタイルを使用できるかどうかの設定

テーマ管理者は、テーマに伴うスタイルを指定したり、スタイルをカスタマイズしたりできます。

テーマのcomponents.jsonファイル内の設定で、サイト・ビルダーでカスタム・スタイル設定が行えるかどうかを指定します。これにより、サイト・コントリビュータがサイトの構築時にサイトのスタイルの範囲内にとどまり、他のフォントや色などを使用しないようにするかどうかを管理します。

サイト内でカスタム・スタイルの使用を禁止するには:

コンポーネントの「設定」パネルの「カスタマイズ」オプションを非表示にします。
テーマのcomponents.jsonファイルで、次のオブジェクトとともに他のコンポーネント定義を追加します:
```
[
    {
        "showStyleClassOnly": "true"
    }
]
```

CKEditorのツールバー・グループおよびボタンをカスタマイズし、カスタム・スタイルを削除します:

テーマのcomponents.jsonファイルで、CKEditorのtoolbarGroupsおよびremoveButtonsプロパティを指定し、TitleおよびParagraphコンポーネントのグループおよびグループ内のボタンをカスタマイズできます。

たとえば、次のオブジェクトとともに他のコンポーネント定義を追加し、Stylesグループからスタイル、フォントおよび色を削除します:

[
    {
        "name": "",
        "list": [
            {
                "type": "scs-title",
                "id": "scs-title",
                "config": {
                    "toolbarGroups": [
                        {
                            "name": "basicstyles",
                            "groups": ["basicstyles"]
                        },
                        {
                            "name": "styles",
                            "groups": ["styles"]
                        },
                        {
                            "name": "colors",
                            "groups": ["colors"]
                        },
                        "/",
                        {
                            "name": "undo",
                            "groups": ["undo"]
                        },
                        {
                            "name": "links",
                            "groups": ["links"]
                        },
                        {
                            "name": "paragraph",
                            "groups": ["list", "indent"]
                        },
                        {
                            "name": "align",
                            "groups": ["align"]
                        },
                        {
                            "name": "cleanup",
                            "groups": ["cleanup"]
                        }
                    ],
                    "removeButtons": "Styles,Subscript,Superscript,Strike,Anchor,Blockquote,Link,Unlink,Font,TextColor,BGColor"
                }
            },
            {
                "type": "scs-paragraph",
                "id": "scs-paragraph",
                "config": {
                    "toolbarGroups": [
                        {
                            "name": "basicstyles",
                            "groups": ["basicstyles"]
                        },
                        {
                            "name": "styles",
                            "groups": ["styles"]
                        },
                        {
                            "name": "colors",
                            "groups": ["colors"]
                        },
                        "/",
                        {
                            "name": "undo",
                            "groups": ["undo"]
                        },
                        {
                            "name": "links",
                            "groups": ["links"]
                        },
                        {
                            "name": "paragraph",
                            "groups": ["list", "indent"]
                        },
                        {
                            "name": "align",
                            "groups": ["align"]
                        },
                        {
                            "name": "insert",
                            "groups": ["image", "table"]
                        },
                        {
                            "name": "cleanup",
                            "groups": ["cleanup"]
                        }
                    ],
                    "removeButtons": "Styles,Subscript,Superscript,Strike,Anchor,Blockquote,Link,Unlink,Font,TextColor,BGColor"
                }
            }
        ]
    }
]

スタイルがCKEditorに貼り付けられないようにします。
貼付けは、構成されているスタイルおよびボタンに従います。前の例では、貼り付けられたデータからFontが削除されています。

カスタム・スタイルを禁止すると、次のような影響があります:

すべての組込みコンポーネントで、styleタブのカスタマイズ・オプションが非表示になります。
CKEditorで、スタイルを設定するためのツールバー・ボタンが非表示になり、フォント・ファミリ、フォントの色などの仕様がオーバーライドされます。
また、CKEditorで、貼り付けたテキストを使用してスタイルを設定できなくなります。太字または斜体は使用できます。

テーマのコンポーネントおよびセクション・レイアウトの非表示

テーマのcomponent.jsonファイルを編集して、コンポーネントやセクション・レイアウトを非表示にし、サイト開発者が使用しないようにすることができます。一貫性のあるルック・アンド・フィールを奨励するために、この実行が必要になる場合があります。テーマのコンポーネントおよびセクション・レイアウトの非表示を参照してください。

サイトでのテーマの確認

テーマの編集が完了した後、すべての部分がサイトで計画どおりに機能することを確認する必要があります。

コピーしたフォルダおよびファイルがOracle Content Managementデスクトップ・アプリケーションに同期化されていること、および変更がすべて保存されていることを確認します。
サイト・ビルダーでサイト(テスト・サイトである場合や既存のオフライン・サイトである場合があります)を開き、新しいテーマを使用するようサイトを切り替えます。
ページを追加し、設定を使用し、イメージを表示し、ナビゲーション、および新しいテーマで変更したすべての内容を確認することにより、このテーマでサイトをテストします。
すべてのファイルおよびリンクを含むすべてが適切にレンダリングされることを確認します。
サイトにテーマの変更が実装されるようテーマを公開し、ランタイム環境で確認します。

テーマの公開を参照してください。

ブートストラップ・テーマの使用

Oracle Content Managementのテーマとブートストラップ・テーマには類似点があるため、既存のブートストラップ・テーマのページおよびコンテンツを変換してOracle Content Managementのテーマで使用可能にすることができます。

ブートストラップは、WebサイトやWebアプリケーションを作成するための無料かつオープンソースのツール・コレクションです。これには、インタフェース・コンポーネントとJavaScript拡張機能用のHTMLおよびCSSベースのデザイン・テンプレートが含まれます。

テーマを作成するために同じ手順に従いますが、(どのようなエディタを使用しようとも)コードを操作して、必要な任意のページまたはコンテンツをブートストラップ・テーマからインポートして編集します。

すべてのブートストラップ・テーマをそのすべてのページおよびコンテンツとともに使用することはめったにありません。通常、Oracle Content Managementのテーマで使用するテーマの部分を選択します(おそらく、いくつかのページ・テンプレートのみ、およびこれらのいくつかの部分のみ)。たとえば、ブートストラップ・テーマには、ヘッダー、ナビゲーション・ブロック、本文ブロックおよびフッター・ブロックを含むテンプレート内の複数のブロックが含まれます。ブートストラップ・テーマがファイル・システムから(Webサーバーなしで)直接表示できるファイルのコレクションとして出荷される方法のため、ブートストラップ・テーマには、各ページ内に多数の複製が含まれます(ページ・アセンブリ・エンジンが関連していないため、このように多数の複製が含まれる必要があります)。Oracle Content Managementのテーマでこの情報を使用する場合、これらの部分を採用し、再使用可能なOracle Content Managementのページ・テンプレートに追加してから、Oracle Content Managementを使用してこれらのテンプレートから複数のページを動的にアセンブルする必要があります。

再使用可能なテンプレートに情報を追加する例の1つに、ナビゲーション・セクションがあります。通常のブートストラップ・テーマ内のナビゲーションはすべてのページで複製されますが、これをOracle Content Managementのテーマに移動する場合、JavaScriptコードを使用して、サイトの階層内を動的に移動し、ナビゲーション構造を生成する必要があります。これにより、このスクリプトをすべてのページに含めるだけで、すべてのページにナビゲーションが使用され、サイトでのページの追加または削除にそのナビゲーションが適応します。

BootstrapまたはWebサイト・デザイン・テンプレートからのサイト・テンプレートの作成を参照してください。