Tworzenie motywu

Można utworzyć nowy motyw, kopiując istniejący motyw i dokonując zmian w kopii. Można także zaimportować zawartość Bootstrap i użyć jej w nowym motywie.

Uwaga:

Bez względu na to, czy jest tworzony nowy motyw, czy są dokonywane aktualizacje istniejącego motywu, zawsze należy sporządzić kopię motywu i nad nią pracować. Następnie — aby się upewnić, że poprawnie działa — należy ją przetestować, używając przykładowego serwisu lub kopii swojego rzeczywistego serwisu. Należy pamiętać, że zmiany, dokonane w istniejącym motywie, zostaną zaimplementowane we wszystkich używających go serwisach, gdy tylko ten zmodyfikowany motyw zostanie opublikowany.

Kopiowanie motywu

  1. Na stronie startowej wybrać opcję Programista.

    Zostanie wyświetlona strona Programista.

  2. Nacisnąć przycisk Wyświetl wszystkie motywy.

    Zostanie wyświetlona lista istniejących motywów. Można określić, jak motywy będą wyświetlane, klikając na ikonie "Widok", po czym wybierając odpowiednią opcję z listy.

  3. Wybrać motyw, po czym wybrać z menu podręcznego opcję Kopiuj albo kliknąć na ikonie Ikona "Kopiuj" (na pasku czynności).

    Wszystkie foldery i pliki motywu są kopiowane, w tym wszystkie przykładowe strony i ich zawartość.

    Uwaga:

    Gdy motyw jest kopiowany, nie są kopiowane informacje dotyczące jego udostępniania.
  4. Należy podać nazwę kopii. Nie może to być nazwa już używana dla innego motywu.

    W nazwie można używać liter, cyfr, znaków podkreślenia (_) i łączników (-). Użyta spacja zostanie automatycznie zastąpiona łącznikiem.

    Dla szablonów, motywów, składników, serwisów ani stron serwisów nie wolno używać następujących nazw: authsite, content, pages, scstemplate_*, _comps, _components, _compsdelivery, _idcservice, _sitescloud, _sitesclouddelivery, _themes, _themesdelivery. Następujących nazw można używać dla stron serwisów, ale nie można używać dla szablonów, motywów, składników ani serwisów: documents, sites.

  5. Opcjonalnie: podać opis motywu.

  6. Nacisnąć przycisk Kopiuj.

    Na pasku postępu są pokazywane nowa nazwa motywu i status operacji kopiowania. Gdy motyw zostanie skopiowany, jego nazwa pojawi się na liście motywów. Foldery i pliki, wchodzące w skład motywu, można eksplorować po kliknięciu na nazwie motywu wyświetlanej na liście motywów.

  7. Do synchronizacji folderów i plików motywu z systemem lokalnym należy użyć aplikacji Oracle Content Management typu Desktop. Dzięki temu można przechodzić do folderów lokalnych i pracować bezpośrednio nad plikami. Zmiany dokonywane w motywie są automatycznie synchronizowane. Zmian można dokonywać, używając swoich ulubionych narzędzi do edytowania kodu HTML, tekstu czy kodu programistycznego.

Określenie, czy style niestandardowe mogą być używane w serwisie

Administrator motywów może określać style, które są dostępne wraz z motywem, lub je dostosowywać.

Ustawienia w pliku components.json motywu określają, czy style niestandardowe można wprowadzać w konstruktorze serwisów. Dzięki temu osoba współtworząca serwis zachowuje styl w obrębie serwisu i nie używa — na przykład — innych czcionek lub kolorów.

Aby nie zezwolić na używanie niestandardowych stylów w serwisie, należy:

  1. Ukryć w panelu Ustawienia dla składników opcję Dostosuj.

    W pliku components.json motywu dodać następujący obiekt wraz z innymi definicjami składników:

    [
        {
            "showStyleClassOnly": "true"
        }
    ]
  2. Dostosować grupy i przyciski z pasków narzędzi edytora CKEditor, uniemożliwiając w ten sposób stylizację niestandardową:

    W pliku components.json motywu można określić właściwości toolbarGroups i removeButtons edytora CKEditor w celu dostosowania grup i zawartych w nich przycisków dla składników "tytuł" (title) i akapit (paragraph).

    Na przykład można dodać następujące obiekty wraz definicjami innych składników, aby usunąć style, czcionki i kolory z grupy 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"
                    }
                }
            ]
        }
    ]
  3. Zapobiec wklejaniu stylizacji do edytora CKEditor.

    Podczas wklejania jest zachowywana zgodność ze skonfigurowanymi stylami i przyciskami. W poprzednim przykładzie jest z wklejanych danych usuwane ustawienie czcionki Font.

Niezezwolenie na style niestandardowe powoduje, że:
  • We wszystkich wbudowanych składnikach jest na karcie Styl ukrywania opcja "Dostosuj".
  • W edytorze CKEditor przyciski z paska narzędzi, służące do ustawiania stylów, są ukrywane, a specyfikacja rodziny czcionek, koloru czcionek itd. jest przesłaniania.
  • W edytorze CKEditor nie jest możliwe ustawianie stylu przez wklejony tekst. Dozwolone jest stosowanie kursywy i pogrubienia.

Ukrywanie składników i układów sekcji motywu

Aby uniemożliwić twórcy serwisów używanie określonych składników i układów sekcji, można je ukryć, edytując odpowiednio plik component.json motywu. Niekiedy trzeba to zrobić w celu zapewnienia spójnego wyglądu. Zob. Ukrywanie składników i układów sekcji motywu.

Weryfikowanie motywu z użyciem serwisu

Po ukończeniu edytowania serwisu trzeba sprawdzić, czy wszystkie jego elementy współpracują z nim zgodnie z oczekiwaniami.

  1. Upewnić się, że skopiowane pliki i foldery zostały zsynchronizowane przy użyciu aplikacji Oracle Content Management typu Desktop oraz że wszystkie modyfikacje zostały zapisane.

  2. Otworzyć w konstruktorze serwisów serwis (może to być serwis testowy lub istniejący serwis działający w trybie offline) i przełączyć go do używania nowego motywu.

  3. Przetestować serwis z nowym motywem, dodając strony, korzystając z ustawień, wyświetlając obrazy, sprawdzając nawigację i wszystko inne, co zostało w tym motywie zmienione.

  4. Sprawdzić, czy wszystko jest poprawnie renderowane, w tym wszystkie pliki i łącza.

  5. Opublikować motyw, aby występujące w nim zmiany zostały zaimplementowane, po czym sprawdzić go w środowisku wykonawczym.

Zob. Publikowanie motywów.

Korzystanie z motywu Bootstrap

Podobieństwo między motywami Oracle Content Management a motywami Bootstrap powoduje, że możliwe jest przekształcenie istniejących stron i zawartości z motywem Bootstrap do postaci pozwalającej ich użyć w motywie Oracle Content Management.

Bootstrap jest to bezpłatna kolekcja narzędzi typu "open-source", służących do tworzenia serwisów i aplikacji internetowych. Zawiera szablony projektowe oparte na standardzie HTML i CSS, przeznaczone dla składników interfejsu, oraz rozszerzenia JavaScript.

Tworząc motyw, postępujemy zgodnie z dotychczasowymi instrukcjami, lecz — w celu zaimportowania i edytowania stron oraz zawartości z motywu Bootstrap — pracujemy z kodem (używając dowolnego edytora).

Jest mało prawdopodobne, że zostanie użyty cały motyw Bootstrap ze wszystkimi jego stronami i całą zawartością. Zazwyczaj wybiera się niektóre części motywu do użycia w motywie Oracle Content Management, na przykład kilka szablonów stron i ich niektóre części. Na przykład motyw Bootstrap zawiera w szablonach kilka bloków, takich jak nagłówek, blok nawigacji blok treści i blok stopki. Ze względu na sposób dostarczania motywów Bootstrap jako kolekcji plików, które można wyświetlać bezpośrednio z systemu plików (bez serwera internetowego), w obrębie jednej strony występuje wiele duplikatów (wynika to z tego, że nie jest używany żaden motor składania stron). Jeśli informacje te mają zostać w motywie Oracle Content Management, trzeba wydobyć te części i dodać je do szablonów stron Oracle Content Management, a następnie użyć Oracle Content Management do dynamicznego zestawienia stron z tych szablonów.

Przykładem dodania informacji do szablonów wielokrotnego użytku jest sekcja nawigacji. Nawigacja z typowego motywu Bootstrap jest powielana na wszystkich stronach, lecz — przechodząc do motywu Oracle Content Management — trzeba użyć kodu JavaScript do dynamicznego przejścia po hierarchicznej strukturze serwisu i wygenerowania struktur nawigacyjnych. Następnie skrypt ten należy uwzględnić na wszystkich stronach a uzyskają one wszystkie odpowiednią nawigację, która będzie się zmieniać w miarę dodawania lub usuwania stron do/z serwisu.

Zob. Tworzenie szablonu serwisu z szablonu "Bootstrap" lub "Website Design".