Configurazione della verifica preliminare

L’identificazione dell’opportunità di verifica preliminare di AEM Sites Optimizer richiede la configurazione dell’estensione Verifica preliminare. Puoi configurarla nell’editor universale, nell’anteprima basata sul documento o in AEM Cloud Service, in modo da poter eseguire audit di verifica preliminare sulle pagine prima che vengano pubblicate.

Abilitare l’accesso degli utenti

Per utilizzare l’estensione Verifica preliminare, assicurati che l’utente sia assegnato ad almeno uno dei seguenti profili di prodotto AEM Sites Optimizer in Adobe Admin Console:

  • AEM Sites Optimizer - Suggerimento automatico utente
  • AEM Sites Optimizer - Ottimizzazione automatica utente

Abilitare l’estensione Verifica preliminare

Editor universale

Per impostare la verifica preliminare nell’editor universale, segui questi passaggi:

  1. Apri Extension Manager in:
    https://experience.adobe.com/#/@org/aem/extension-manager/universal-editor
  2. Individua l’estensione Verifica preliminare AEM Sites Optimizer.
  3. L’amministratore di sistema dell’organizzazione dovrà abilitare questa estensione.
  4. Dopo aver abilitato l’estensione, apri una pagina nell’editor universale, ad esempio:
    https://author-p12345-e123456.adobeaemcloud.com/ui#/@org/aem/universal-editor/canvas/author-p12345-e123456.adobeaemcloud.com/content/en/example/home.html
  5. L’estensione Verifica preliminare viene visualizzata nella barra laterale.
  6. Seleziona l’estensione Verifica preliminare dalla barra laterale, per avviare l’audit della verifica preliminare per la pagina corrente.
Authoring basato su documenti

Per impostare la verifica preliminare per l’authoring basato su documenti, segui questi passaggi:

  1. Aggiungi la seguente configurazione a /tools/sidekick/config.json nell’archivio GitHub del progetto Edge Delivery Services:

    code language-json
    {
      "plugins": [
        {
          "id": "preflight",
          "titleI18n": {
            "en": "Preflight"
          },
          "environments": ["preview"],
          "event": "preflight"
        }
      ]
    }
    
  2. Crea un nuovo file /tools/sidekick/aem-sites-optimizer-preflight.js e aggiungi il contenuto seguente:

    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. Aggiorna la funzione loadLazy() in /scripts/scripts.js per importare lo script di verifica preliminare per gli URL di anteprima:

    code language-javascript
    if (window.location.href.includes('.aem.page')) {
       import('../tools/sidekick/aem-sites-optimizer-preflight.js');
    }
    
  4. Apri l’URL di anteprima (*.aem.page) della pagina di cui eseguire l’audit.

  5. In Sidekick, fai clic sul pulsante Verifica preliminare per avviare il controllo di audit per la pagina corrente.

Editor pagina per AEM Sites

Per utilizzare Verifica preliminare nell’editor di pagina di AEM Sites, puoi creare un bookmarklet nel browser web. Segui questi passaggi:

  1. Mostra la Barra Segnalibri nel browser web:

    • Premi Ctrl+Maiusc+B (Windows) o Comando+Maiusc+B (Mac).
  2. Crea un nuovo segnalibro nel browser:

    • Fai clic con il pulsante destro del mouse sulla barra dei segnalibri e seleziona Nuova pagina o Aggiungi segnalibro.
    • Nel campo Indirizzo (URL), incolla il seguente codice:
    code language-javascript
    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);})();
    
  3. Assegna al segnalibro il nome Verifica preliminare (o un nome qualsiasi).

  4. Apri l’URL di anteprima (*.aem.page) della pagina di cui eseguire l’audit nell’Editor pagina per AEM Sites.

  5. Fai clic sul segnalibro Verifica preliminare nella barra Segnalibri per avviare il controllo di audit per la pagina corrente.

Adobe Managed Services
note important
IMPORTANT
Sono supportati solo gli ambienti Adobe Managed Services (AMS) che utilizzano il provider di identità di Adobe (IMS) per l’autenticazione in AEM Author. La verifica preliminare non funziona se l’organizzazione utilizza un altro provider di identità per l’autenticazione AMS.

Per utilizzare la verifica preliminare nell’Editor pagina per AEM Sites in un ambiente AMS, crea un bookmarklet nel browser web, seguendo questi passaggi:

  1. Mostra Barra Segnalibri nel browser web:

    • Premi Ctrl+Maiusc+B (Windows) o Comando+Maiusc+B (Mac).
  2. Crea un nuovo segnalibro nel browser:

    • Fai clic con il pulsante destro del mouse sulla barra dei segnalibri e seleziona Nuova pagina o Aggiungi segnalibro.
    • Nel campo Indirizzo (URL), incolla il seguente codice:
    code language-javascript
    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=ams';document.head.appendChild(script);})();
    
  3. Assegna al segnalibro il nome Verifica preliminare (o un nome qualsiasi).

  4. Apri la pagina di cui eseguire l’audit nell’Editor pagina per AEM Sites.

  5. Fai clic sul segnalibro Verifica preliminare nella barra Segnalibri per avviare il controllo di audit per la pagina corrente.

Best practice

Quando esegui gli audit di verifica preliminare, tieni presenti le seguenti linee guida:

  • Esegui sempre gli audit sulle pagine di staging o anteprima prima di pubblicarle in produzione.
  • Assegna priorità alla risoluzione di problemi ad alto impatto quali collegamenti interrotti, tag H1 mancanti o collegamenti non sicuri.
  • Prima di eseguire l’audit, verifica che l’autenticazione sia abilitata per gli ambienti di staging protetti.
  • Rivedi e applica consigli sui tag meta per migliorare le prestazioni SEO (Search Engine Optimization).
recommendation-more-help
experience-manager-sites-optimizer-help-main-toc