Rozloženia

Rozloženie definuje usporiadanie obsahu na stránke lokality. Rôzne rozloženia môžu obsahovať rôzny počet pomenovaných slotov. Slot je oblasť, ktorá sa rozprestiera po celej šírke stránky a jej súčasťou môže byť jeden alebo viac typov obsahu.

Každý motív obsahuje niekoľko rozložení stránok. Pozrite si časť Motívy.

Keď pridáte na lokalitu stránku, vyberiete rozloženie, ktoré sa pre túto stránku použije. Súčasťou každého rozloženia sú oblasti na stránke (tzv. sloty), do ktorých môžete myšou presunúť obsah. Všetok obsah, ktorý sa bude nachádzať v týchto slotoch, určíte vy. Môže ním byť čokoľvek od nadpisov, textu a oddeľovačov až po multimédiá, galérie a sociálne médiá.

Rozloženie obsahuje platné konštrukcie HTML, ako aj špeciálny markup, ktorý vykresľovač služby Oracle Content Management dokáže interpretovať. Rozloženie sa musí začínať príkazom DOCTYPE, pomocou ktorého sa prehľadávač nakonfiguruje na vykreslenie stránky v režime kompatibility so štandardmi (napríklad <!DOCTYPE html>). Tento príkaz vyžadujú určité komponenty na dosiahnutie najlepších výsledkov.

Tento vzorový kód znázorňuje minimálne rozloženie:

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>

Po vykreslení stránky v prehľadávači sa rozbalia rôzne tokeny.

  • [!--$SCS_THEME_NAME--]

    V tomto tokene sa zobrazí názov motívu, ktorý je aktuálne vybraný pre lokalitu. Pomocou tohto tokenu možno motív skopírovať, pretože adresy URL, ktoré tento token používajú, budú odkazovať na aktuálny motív.

  • [!--$SCS_DESIGN_NAME--]

    V tomto tokene sa zobrazí názov návrhu, ktorý je aktuálne vybraný pre lokalitu. Umožňuje to používať rozloženie viacerými návrhmi v rámci motívu.

  • [!--$SCS_RENDER_INFO--]

    V tomto tokene sa zobrazí značka skriptu, v ktorej je uložená hierarchia stránok a informácie o vykreslení komponentov pre stránku. Tento token by sa mal nachádzať v sekcii <head> rozloženia.

  • [!--$SCS_SITE_HEADER--]

    V tomto tokene sa zobrazí hodnota hlavičky lokality, ktorá je zadaná v poli Hlavička vo vlastnostiach optimalizácie pre vyhľadávacie nástroje (SEO). Môžete sem zadať markup pre celú lokalitu, ktorý chcete umiestniť na všetky stránky. Pozrite si časť Nastavenie vlastností vyhľadávacích nástrojov.

  • [!--$SCS_PAGE_HEADER--]

    V tomto tokene sa zobrazí hodnota hlavičky stránky, ktorá sa nachádza v poli Hlavička stránky vo vlastnostiach nastavení stránky v generátore lokalít. Môžete tu zadať markup konkrétnej stránky.

  • [!--$SCS_SITE_FOOTER--]

    V tomto tokene sa zobrazí hodnota päty lokality, ktorá sa nachádza v poli Päta vo vlastnostiach optimalizácie pre vyhľadávacie nástroje (SEO). Môžete sem zadať markup pre celú lokalitu, ktorý chcete umiestniť na všetky stránky. Pozrite si časť Nastavenie vlastností vyhľadávacích nástrojov.

Poznámka:

Namiesto oddeľovačov [!--$ a --] sa môže v tokenoch používať predpona <!--$ a prípona -->.

Keď je lokalita online, nasledujúce tokeny v prepojení sa nahradia skutočnými hodnotami zohľadňujúcimi kontext, v ktorom sa používajú. Prepojenie tak môže fungovať aj pri upravovaní lokality a na publikovanej lokalite, ktorá je online.

  • /_sitescloud/ sa nahradí reťazcom /_sitesclouddelivery/

  • /_themes/ sa nahradí reťazcom /_themesdelivery/

Sloty sú prvky DIV v rozložení s hodnotou "scs-slot" v atribúte triedy. Slot je miesto, kam môžu používatelia pridať komponenty a vyplniť tak lokalitu obsahom. Priradením atribútu triedy "scs-slot" možno ako sloty nastaviť viacero prvkov DIV. Každý slot musí mať jednoznačný atribút id.

Poznámka:

Sloty nie je možné vnárať, pomocou šablóny CSS ich však môžete prekryť a vytvoriť tak dojem, že vnorené sú. Ak to chcete urobiť, použite rozloženie skupiny komponentov alebo sekcie. Pozrite si časť Vytvorenie rozloženia sekcie.

Sloty, ktoré majú atribút triedy s hodnotou "scs-responsive", budú obnovovať svoj obsah pri zmene rozlíšenia okna prehľadávača. Môžu sa tak responzívne vykresľovať na veľkom displeji počítača aj malom mobilnom zariadení.

Posledná značka <script> (riadok 19 v príklade) načítava kód vykresľovania služby Oracle Content Management. Tento kód je zodpovedný za vykreslenie komponentov na stránke a umožňuje tiež prístup vlastného kódu do rozhrania Render API. Bez tejto značky <script> nie je možné pomocou generátora lokalít zmeniť stránky založené na danom rozložení.