Sitenavigatie

De hiërarchie van een site wordt opgeslagen in het bestand structure.json dat aan de site is gekoppeld. De hiërarchie wordt in het geheugen geladen en beschikbaar gemaakt in de paginacontext als het object SCS.structureMap.

Het bestand structure.json wordt met de sitebuilder gelezen om de sitestructuur te tekenen in de sitebuilder. Het bestand structure.json bevat code voor de sitepagina's. Bijvoorbeeld:

"pages": [  {        
     "id": 100,      
     "name": "Home",                                    
     "parentId": null,             
     "pageUrl": "index.html",      
     "hideInNavigation": false,    
     "linkUrl": "",                
     "linkTarget": "",             
     "children": [ 200,            
                   300,            
                   400,            
                   500 ],          
     "overrideUrl":false           
     } 
   
     {
     "id":200,
     "name":"Products"
     "parentId":100,                
     "hideInNavigation":false,      
     "LinkUrl":"",                  
                 "linkTarget":"",               
                 "children":[ 204, 205],        
                 "overrideUrl":false            
     }                              

     {
     "id":204,
     "name":"Hiking Boots",
     "parentId":200,
                 "pageUrl":"products/hiking_boots.html",
                 "hideInNavigation":false,
                 "linkUrl":"",
     "linkTarger":"",
     "children":[],
     "overrideUrl":false
     }

JavaScript-code voor navigatie is nodig binnen de sitepagina's om ook die structuur te lezen en de navigatiekoppelingen voor de site op te maken. Sjablonen die met Oracle Content Management worden geleverd, bevatten JavaScript-voorbeeldbestanden voor navigatie die laten zien hoe dit werkt.

Het bestand topnav.js dat in sommige thema's wordt gebruikt die worden geleverd met Oracle Content Management is een voorbeeld van hoe u het object SCS.structureMap samen met de weergave-API-aanroepen zoals SCSRenderAPI.getPageLinkData kunt gebruiken om de sitestructuur te doorlopen en de HTML-markup op te stellen die nodig is om de navigatiemenu's op de pagina weer te geven. Hieronder ziet u code uit het voorbeeldbestand topnav.js:

function renderNode(id, navBar)
{
        if (id >= 0)
        {
                var navNode = SCS.structureMap[id];
                if( navNode &&
                        (
                                ( typeof navNode.hideInNavigation != "boolean" ) ||
                                ( navNode.hideInNavigation === false )
                        ) )
                {
                        var navItem = document.createElement("li");
                        var navLink = document.createElement("a");
                        var navText = document.createTextNode(navNode.name);
                        
                        var linkData = SCSRenderAPI.getPageLinkData(navNode.id) || {};
                        if( linkData.href ) {
                                navLink.href = linkData.href;
                        }
                        if( linkData.target ) {
                                navLink.target = linkData.target;
                        }

                        navLink.appendChild(navText);
                        navItem.appendChild(navLink);

                        if (navNode.children.length > 0)
                        {
                                var navSub = document.createElement("ul");
                                
                                for (var c = 0; c < navNode.children.length; c++)
                                {
                                        renderNode(navNode.children[c], navSub);
                                }
                                
                                navItem.appendChild(navSub);
                        }
                        navBar.appendChild(navItem);
                }
        }
}

function renderNav()
{
        var topnav = document.getElementById("topnav");         // expected to be an empty <div>

        if (topnav)
        {
                var navBar = document.createElement("ul");

                renderNode(SCS.navigationRoot, navBar);

                topnav.appendChild(navBar);
        }
}

// Must wait for all our script to be ready...
if (document.addEventListener)
{
        document.addEventListener('scsrenderstart', renderNav, false); 
}
else if (document.attachEvent)
{
        document.documentElement.scsrenderstart = 0;
        document.documentElement.attachEvent("onpropertychange",
                function(event)
                {
                        if (event && (event.propertyName == "scsrenderstart"))
                        {
                                renderNav();
                        }
                }
        );
}

U kunt weergave-API-aanroepen gebruiken om navigatiekoppelingen te genereren die in de bewerk- en voorbeeldmodi op uw site werken en in een gepubliceerde onlinesite. Zie voor meer informatie: Verwijzing weergave-API.

Het is handig om navigatiegegevens in één JavaScript-bestand te zetten, bijvoorbeeld in topnav.js. Het JavaScript-bestand wordt doorgaans opgeslagen in de map /assets/js/ van het thema, zoals u kunt zien in de voorbeeldthema's die worden meegeleverd bij Oracle Content Management.