Création d'un thème

Pour créer un thème, vous pouvez copier un thème existant et effectuer des modifications sur la copie. Vous pouvez également importer et utiliser du contenu Bootstrap dans un nouveau thème.

Remarque :

Peu importe si vous créez un thème ou si vous en modifiez un existant, faites toujours une copie du thème et utilisez la copie. Testez le thème à l'aide d'un exemple de site ou d'une copie du site réel pour vérifier qu'il fonctionne correctement. Les modifications apportées à un thème existant sont implémentées sur tous les sites utilisant le thème immédiatement après la publication du thème révisé.

Copie d'un thème

Sur la page d'accueil, cliquez sur Développeur.

La page Développeur apparaît.
Cliquez sur Afficher tous les thèmes.

La liste des thèmes est affichée. Vous pouvez contrôler la façon dont les thèmes sont affichés en cliquant sur l'icône Visualiser et en sélectionnant une option dans la liste.
Sélectionnez un thème, puis choisissez Copier dans le menu contextuel ou cliquez sur dans la barre d'actions.

Tous les dossiers et fichiers du thème sont copiés, y compris les exemples de contenu et de page.

Remarque :
Lorsque vous copiez un thème, les informations de partage du thème ne sont pas copiées.
Entrez un nom pour le thème copié. Vous ne pouvez pas utiliser un nom déjà utilisé par un autre thème.

Vous pouvez utiliser des lettres, des chiffres, des traits de soulignements (_) et des traits d'union (-) dans le nom. Si vous entrez un espace, il est automatiquement remplacé par un tiret.

N'utilisez pas les noms suivants pour les modèles, les thèmes, les composants, les sites ou les pages de site : authsite, content, pages, scstemplate_*, _comps, _components, _compsdelivery, _idcservice, _sitescloud, _sitesclouddelivery, _themes, _themesdelivery. Bien que vous puissiez utiliser les noms suivants pour les pages de site, ne vous en servez pas pour les modèles, les thèmes, les composants ou les sites : documents, sites.
Si vous le souhaitez, entrez la description du thème.
Cliquez sur Copier.

Une barre de progression affiche le nom du nouveau thème et le statut de la copie. Lorsque le thème est copié, son nom apparaît dans la liste des thèmes. Vous pouvez explorer les dossiers et les fichiers qui constituent le thème en cliquant sur le nom du thème dans la liste.
Utilisez l'application de bureau Oracle Content Management pour synchroniser les dossiers et fichiers du thème avec votre système local. Vous pouvez ainsi parcourir les dossiers locaux et utiliser directement les fichiers. Les modifications que vous apportez au thème sont automatiquement synchronisées. Vous pouvez effectuer des modifications à l'aide de vos outils de modification de texte, HTML ou de code favoris.

Définition des styles personnalisés pouvant être utilisés sur un site

Un administrateur de thème peut indiquer des styles fournis avec le thème ou personnaliser les styles.

Dans le fichier components.json d'un thème, un paramètre permet d'indiquer si un style personnalisé peut être appliqué dans le générateur de site. Il permet de s'assurer que les contributeurs de site restent fidèles au style du site lors de la création et qu'ils n'utilisent pas, par exemple, d'autres polices et couleurs.

Pour interdire l'utilisation de styles personnalisés sur un site, procédez comme suit :

Masquez l'option Personnaliser dans le panneau Paramètres des composants.
Dans le fichier components.json du thème, ajoutez l'objet suivant avec les autres définitions de composant :
```
[
    {
        "showStyleClassOnly": "true"
    }
]
```

Personnalisez les boutons et groupes de barre d'outils de CKEditor pour enlever les options de style personnalisé :

Dans le fichier components.json du thème, vous pouvez indiquer les propriétés toolbarGroups et removeButtons de CKEditor pour personnaliser les groupes et les boutons au sein des groupes des composants de titre et de paragraphe.

Par exemple, ajoutez les objets suivants avec les autres définitions de composant pour enlever les styles, la police et les couleurs du groupe 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"
                }
            }
        ]
    }
]

Empêchez le collage de style dans CKEditor.
Le collage suit les styles et les boutons configurés. Dans l'exemple précédent, Font est enlevé des données collées.

Conséquences de l'interdiction des styles personnalisés :

Dans tous les composants intégrés, l'onglet Style masque l'option de personnalisation (o).
Dans CKEditor, les boutons de la barre d'outils permettant de définir les styles sont masqués et les spécifications de famille de polices, de couleur de police, etc., sont remplacées.
Dans CKEditor, il ne doit pas être possible de définir un style à l'aide de texte collé. Le gras et l'italique sont autorisés.

Masquage de composants et de présentations de section pour un thème

Vous pouvez masquer des composants et des présentations de section pour empêcher un développeur de site de les utiliser en modifiant le fichier component.json d'un thème. Cela peut servir par exemple à uniformiser la présentation. Reportez-vous à Masquage de composants et de présentations de section pour un thème.

Vérification du thème avec un site

Lorsque vous avez terminé de modifier le thème, vous devez vérifier que toutes les pièces fonctionnent avec le site, tel que vous l'avez planifié.

Assurez-vous que vous avez synchronisé les dossiers et fichiers copiés avec l'application de bureau Oracle Content Management et enregistré toutes les modifications.
Ouvrez un site (un site de test ou un site hors ligne existant) dans le générateur de site et appliquez le nouveau thème au site.
Testez le site avec le thème : ajoutez des pages, utilisez les paramètres, visualisez les images, vérifiez la navigation et toutes les modifications que vous avez apportées au thème.
Vérifiez que tous les éléments sont affichés correctement, y compris tous les fichiers et les liens.
Publiez le thème afin que le site implémente les modifications, puis vérifiez-le dans un environnement d'exécution.

Reportez-vous à Publication de thèmes.

Utilisation d'un thème Bootstrap

En raison des similarités entre les thèmes Oracle Content Management et Bootstrap, il est possible de convertir du contenu et des pages de thème Bootstrap existants afin de les utiliser dans un thème Oracle Content Management.

Bootstrap est une collection gratuite et open source d'outils de création de sites et d'applications Web. Cet outil contient des modèles de conception HTML et CSS pour les composants d'interface et les extensions JavaScript.

Les instructions sont les mêmes que celles de création d'un thème, mais vous utilisez du code (avec l'éditeur de votre choix) pour importer et modifier les pages ou le contenu souhaités provenant du thème Bootstrap.

Il est peu probable que vous souhaitiez utiliser l'intégralité d'un thème Bootstrap avec toutes ses pages et tout son contenu. Généralement, vous sélectionnez seulement des parties du thème à utiliser dans un thème Oracle Content Management, quelques modèles de page et quelques parties de ces modèles seulement. Par exemple, un thème Bootstrap contient plusieurs blocs dans les modèles, notamment un en-tête, un bloc de navigation, un bloc de corps et un bloc de pied de page. En raison de la façon dont les thèmes Bootstrap sont envoyés, sous forme de collection de fichiers pouvant être visualisés directement à partir du système de fichiers (sans serveur Web), ils contiennent de nombreux éléments dupliqués dans chaque page (ce qui est nécessaire car il n'existe aucun outil d'assemblage). Lorsque vous utilisez ces informations dans un thème Oracle Content Management, vous devez extraire ces parties et les ajouter à des modèles de page Oracle Content Management réutilisables, puis assembler de façon dynamique plusieurs pages de ces modèles à l'aide d'Oracle Content Management.

Prenons la section de navigation comme exemple d'ajout d'information à des modèles réutilisables. La navigation d'un thème Bootstrap classique est dupliquée sur toutes les pages, mais lorsque vous passez à un thème Oracle Content Management, vous devez employer du code JavaScript pour explorer la hiérarchie du site et générer les structures de navigation de façon dynamique. Il vous suffit ensuite d'inclure ce script sur toutes les pages afin que ces dernières obtiennent la navigation. Cette navigation s'adapte aux ajouts et aux suppressions de page sur le site.

Reportez-vous au manuel Création d'un modèle de site à partir de Bootstrap ou d'un modèle de conception de site Web.