Макет определяет организацию контента на странице сайта. Разные макеты могут содержать разное количество именованных ячеек. Ячейка – это область, которая занимает всю ширину страницы и может вмещать содержимое одного или нескольких типов.
В каждой теме есть несколько макетов страниц. См. О темах.
При добавлении страницы на сайт требуется выбрать ее макет. В каждом макете есть области на странице (известные как ячейки), в которые можно перетаскивать контент. Перемещаемое в ячейки содержимое полностью зависит от вас. Это может быть все что угодно - от заголовков, текста и разделителей до мультимедиа, галерей и социальных сетей.
Макет содержит допустимые HTML-конструкции, а также специальную разметку, понятную рендереру Oracle Content Management. Макет должен начинаться с инструкции DOCTYPE, чтобы настроить браузер на отображение страницы в режиме, соответствующем стандартам. Например: <!DOCTYPE html>
. Эта инструкция требуется для определенных компонентов для достижения наилучших результатов.
В этом примере кода показан минимальный макет:
1 <!DOCTYPE html> 3 <head> 4 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 5 6 <script src="/_themes/[!--$SCS_THEME_NAME--]/assets/js/topnav.js"></script> 7 <link rel="stylesheet" type="text/css" 8 href="/_themes/[!--$SCS_THEME_NAME--]/assets/css/main.css"> 9 <link rel="stylesheet" type="text/css" 10 href="/_themes/[!--$SCS_THEME_NAME--]/designs/[!--$SCS_DESIGN_NAME--]/design.css"> 11 12 <!--$SCS_RENDER_INFO--> 13 <!--$SCS_SITE_HEADER--> 13 <!--$SCS_PAGE_HEADER--> 14 </head> 15 <body> 16 <div id="topNavigation"></div> 17 <div id="mainContentSlot" class="scs-slot scs-responsive"></div> 18 19 <script data-main="/_sitescloud/renderer/renderer.js" 20 src="/_sitescloud/renderer/require.js"></script> 21 <!--$SCS_SITE_FOOTER--> 22 </body> 23 </html>
При отображении страницы в браузере раскрываются различные маркеры.
[!--$SCS_THEME_NAME--]
Этот маркер разворачивается в имя темы, выбранной в данный момент для сайта. Использование этого маркера позволяет копировать тему, поскольку URL-адреса, использующие этот маркер, будут ссылаться на текущую тему.
[!--$SCS_DESIGN_NAME--]
Этот маркер разворачивается в имя дизайна, выбранного в данный момент для сайта. Это позволяет использовать макет для нескольких дизайнов в рамках темы.
[!--$SCS_RENDER_INFO--]
Этот маркер разворачивается в тег сценария, содержащий сведения об иерархии страниц и рендеринге компонентов для страницы. Его следует поместить в раздел <head>
макета.
[!--$SCS_SITE_HEADER--]
Этот маркер разворачивается в значение верхнего колонтитула сайта, указанного в поле "Верхний колонтитул" в свойствах поисковой оптимизации (SEO). Здесь можно ввести общую для всего сайта разметку, которую требуется разместить на всех страницах. См. Настройка свойств поисковых систем.
[!--$SCS_PAGE_HEADER--]
При этом расширяется значение верхнего колонтитула страницы, которое находится в поле "Заголовок страницы" в свойствах "Настройки страницы" в Site Builder. Здесь можно ввести специфическую для страницы разметку, которую требуется разместить для этой страницы.
[!--$SCS_SITE_FOOTER--]
Этот маркер разворачивается в значение нижнего колонтитула сайта, указанного в поле "Нижний колонтитул" в свойствах поисковой оптимизации (SEO). Здесь можно ввести общую для всего сайта разметку, которую требуется разместить на всех страницах. См. Настройка свойств поисковых систем.
Примечание.:
В маркерах также могут использоваться префикс<!--$
и суффикс -->
в качестве разделителей вместо [!--$
и --]
.Когда сайт находится в оперативном режиме, приведенные ниже маркеры в ссылке заменяются действительными значениями, которые учитывают контекст, в котором они используются. Это позволяет использовать такую ссылку и при редактировании сайта, и при его публикации в сети.
/_sitescloud/
заменяется на /_sitesclouddelivery/
/_themes/
заменяется на /_themesdelivery/
Ячейки — это элементы DIV в макете, для которых в атрибуте класса указано значение "scs-slot"
. Ячейка — это место, куда пользователи добавляют компоненты для заполнения сайта контентом. Несколько элементов DIV можно назначить в качестве ячеек, назначив атрибут класса "scs-slot"
. Каждая ячейка должна иметь уникальный атрибут id
.
Примечание.:
Ячейки не могут быть вложенными, но можно предложить, что их можно накладывать с помощью CSS. Для этого используйте группу компонентов или макет раздела. См. Создание макета раздела.Ячейки, для которых также задано значение атрибута класса "scs-responsive"
, обновляют свое содержимое по мере изменения разрешения окна просмотра браузера. Это позволяет ячейкам должным образом отображаться на больших настольных дисплеях или небольших мобильных устройствах.
Последний тег <script>
(строка 19 в данном примере) загружает код рендеринга Oracle Content Management. Этот код отвечает за рисование компонентов на странице, а также предоставляет пользовательскому коду получить доступа к API для рендеринга. Без тега <script>
страницы, основанные на данном макете, не могут быть изменены приложением Site Builder.