Preflight 설정

범용 편집기에서 Preflight 기능을 설정하려면 다음과 같은 단계를 따릅니다.

1. 다음 위치에서 Extension Manager ​를 엽니다.
   https://experience.adobe.com/#/@org/aem/extension-manager/universal-editor

2. AEM Sites Optimizer Preflight 확장 기능 ​의 위치를 확인하고 활성화를 위한 요청을 제출합니다.

3. Adobe AEM 팀 ​이 조직에 대한 확장 기능을 검토하고 활성화합니다.

4. 확장 기능 활성화 후 범용 편집기 ​에서 페이지를 하나 엽니다. 예:
   https://author-p12345-e123456.adobeaemcloud.com/ui#/@org/aem/universal-editor/canvas/author-p12345-e123456.adobeaemcloud.com/content/en/example/home.html

5. Preflight 확장 기능 ​이 사이드 레일 ​에 나타납니다.

6. 사이드 레일에서 Preflight 확장 기능 ​을 선택하여 현재 페이지의 Preflight 감사 ​를 시작합니다.

문서 기반 작성을 위해 Preflight를 설정하려면 다음과 같은 단계를 따릅니다.

1. Edge Delivery Services 프로젝트의 GitHub 저장소에서 /tools/sidekick/config.json에 다음과 같은 구성을 추가합니다.

   code language-json
   { "plugins": [ { "id": "preflight", "titleI18n": { "en": "Preflight" }, "environments": ["preview"], "event": "preflight" } ] }

2. 새 파일(/tools/sidekick/aem-sites-optimizer-preflight.js)을 만들고 다음과 같은 내용을 추가합니다.

   code language-javascript

   (function () { let isAEMSitesOptimizerPreflightAppLoaded = false; function loadAEMSitesOptimizerPreflightApp() { const script = document.createElement('script'); script.src = 'https://experience.adobe.com/solutions/OneAdobe-aem-sites-optimizer-preflight-mfe/static-assets/resources/sidekick/client.js?source=plugin'; script.onload = function () { isAEMSitesOptimizerPreflightAppLoaded = true; }; script.onerror = function () { console.error('Error loading AEMSitesOptimizerPreflightApp.'); }; document.head.appendChild(script); } function handlePluginButtonClick() { if (!isAEMSitesOptimizerPreflightAppLoaded) { loadAEMSitesOptimizerPreflightApp(); } } // Sidekick V1 extension support const sidekick = document.querySelector('helix-sidekick'); if (sidekick) { sidekick.addEventListener('custom:preflight', handlePluginButtonClick); } else { document.addEventListener('sidekick-ready', () => { document.querySelector('helix-sidekick') .addEventListener('custom:preflight', handlePluginButtonClick); }, { once: true }); } // Sidekick V2 extension support const sidekickV2 = document.querySelector('aem-sidekick'); if (sidekickV2) { sidekickV2.addEventListener('custom:preflight', handlePluginButtonClick); } else { document.addEventListener('sidekick-ready', () => { document.querySelector('aem-sidekick') .addEventListener('custom:preflight', handlePluginButtonClick); }, { once: true }); } }());

3. 다음과 같이 /scripts/scripts.js에서 loadLazy() 함수를 업데이트하여 미리보기 URL에 대한 Preflight 스크립트를 가져옵니다.

   code language-javascript
   if (window.location.href.includes('.aem.page')) { import('../tools/sidekick/aem-sites-optimizer-preflight.js'); }

4. 감사하려는 페이지의 미리보기 URL(*.aem.page)을 엽니다.

5. Sidekick ​에서 Peflight 버튼을 클릭하여 현재 페이지에 대한 감사를 시작합니다.

AEM Sites 페이지 편집기에서 Preflight를 사용하기 위해 웹 브라우저 내에 북마클릿을 만들 수 있습니다. 다음 단계를 수행하십시오.

1. 다음과 같이 웹 브라우저에 북마크 바 ​를 표시합니다.

   • Ctrl+Shift+B(Windows) 또는 Cmd+Shift+B(Mac)를 누릅니다.

!. 다음과 같이 브라우저에 새 북마크를 만듭니다.

• 북마크 바를 마우스 오른쪽 버튼으로 클릭하고 새 페이지 또는 북마크 추가 ​를 선택합니다.
• 주소(URL) 필드에 다음 코드를 붙여 넣습니다.

javascript:(function(){const script=document.createElement('script');script.src='https://experience.adobe.com/solutions/OneAdobe-aem-sites-optimizer-preflight-mfe/static-assets/resources/sidekick/client.js?source=bookmarklet&target-source=aem-cloud-service';document.head.appendChild(script);})();

1. 북마크의 이름을 Preflight(또는 원하는 이름)로 지정합니다.

2. AEM Sites 페이지 편집기 ​에서 감사하려는 페이지의 미리보기 URL(*.aem.page)을 엽니다.

3. 북마크 바에서 Preflight 북마크를 클릭해 현재 페이지에 대한 감사를 시작합니다.