사이트 계층은 사이트와 연관된 structure.json
파일에 저장됩니다. 계층은 메모리에 로드되고 페이지 컨텍스트에서 SCS.structureMap
객체로 사용할 수 있습니다.
사이트 작성기는 structure.json
파일을 읽고 사이트 작성기에서 사이트 트리를 그립니다. structure.json
파일에는 사이트 페이지의 코드가 포함됩니다. 예를 들어, 다음과 같습니다.
"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 코드가 있어야 해당 구조를 읽고 사이트의 탐색 링크를 그릴 수 있습니다. Oracle Content Management와 함께 제공된 템플리트에는 이 작동 방식을 시연하는 샘플 탐색 JavaScript 파일이 있습니다.
Oracle Content Management와 함께 제공된 일부 테마에서 사용되는 topnav.js
파일은 SCS.structureMap
객체를 Render API 호출(예: SCSRenderAPI.getPageLinkData
)과 함께 사용하여 사이트 구조를 순회하고 페이지의 탐색 메뉴 렌더링에 필요한 HTML 마크업을 그리는 방법의 예를 보여줍니다. 다음은 샘플 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(); } } ); }
Render API 호출을 사용하여 사이트 편집 및 미리보기 모드와 게시된 온라인 사이트에서 작동할 탐색 링크를 생성할 수 있습니다. Render API 참조를 참조하십시오.
탐색 정보를 하나의 JavaScript 파일(예: topnav.js
)에 넣는 것이 좋습니다. Oracle Content Management와 함께 제공된 샘플 테마에서 볼 수 있듯이, JavaScript 파일은 일반적으로 테마의 /assets/js/
폴더에 저장됩니다.