Gebruikersinterface voor maken van correspondentie aanpassen customize-create-correspondence-ui

Overzicht overview

Met Correspondence Management kunt u het servicesjabloon van de oplossing herdefiniƫren voor een betere merkwaarde en kunt u voldoen aan de brandstandaarden van uw organisatie. Als u de gebruikersinterface opnieuw brandt, wijzigt u het bedrijfslogo, dat in de linkerbovenhoek van de interface Correspondentie maken wordt weergegeven.

U kunt het logo in de interface Correspondentie maken wijzigen met het logo van uw organisatie.

Het aangepaste pictogram in de gebruikersinterface voor correspondentie maken

Het aangepaste pictogram in de gebruikersinterface voor correspondentie maken

Het logo wijzigen in de gebruikersinterface Correspondentie maken changing-the-logo-in-the-create-correspondence-ui

Ga als volgt te werk om een door u gekozen logoafbeelding in te stellen:

  1. Maak de juiste mapstructuur in CRX.

  2. Het nieuwe logobestand uploaden in de map die u in CRX hebt gemaakt.

  3. CSS instellen op CRX om naar het nieuwe logo te verwijzen.

  4. De browsergeschiedenis wissen en De interface Correspondentie maken vernieuwen.

De vereiste mapstructuur maken creatingfolderstructure

Maak de mapstructuur, zoals hieronder wordt uitgelegd, voor het hosten van de aangepaste logoafbeelding en het stijlblad. De nieuwe mapstructuur met de hoofdmap /apps is vergelijkbaar met de structuur van de map /libs.

Voor elke aanpassing maakt u een parallelle mapstructuur, zoals hieronder wordt uitgelegd, in de tak /apps.

De /apps vertakking (mapstructuur):

  • Zorgt ervoor dat uw bestanden veilig zijn als het systeem wordt bijgewerkt. Als er een verbetering, eigenschapspak, of een hete moeilijke situatie is, /libs vertakking wordt bijgewerkt en als u uw wijzigingen in het dialoogvenster /libs vertakt, worden ze overschreven.
  • Het huidige systeem of de huidige vertakking mag niet worden verstoord. U kunt dit probleem per ongeluk oplossen als u de standaardlocaties gebruikt voor het opslaan van de aangepaste bestanden.
  • Helpt uw middelen een hogere prioriteit krijgen wanneer AEM naar middelen zoekt. AEM wordt gevormd om te zoeken /apps eerst de vertakking en vervolgens de /libs vertakking om een bron te zoeken. Dit mechanisme houdt in dat het systeem uw bedekking gebruikt (en de aanpassingen die daar zijn gedefinieerd).

Gebruik de volgende stappen om de vereiste mapstructuur te maken in het dialoogvenster /apps vertakking:

  1. Ga naar https://'[server]:[port]'/[ContextPath]/crx/de en aanmelden als beheerder.

  2. Maak in de map Apps een map met de naam css met een pad/structuur die vergelijkbaar is met de css-map (in de map ccrui).

    Stappen voor het maken van de css-map:

    1. Klik met de rechtermuisknop op de knop css map op het volgende pad en selecteer Overlayknooppunt: /libs/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/css

      Overlay-knooppunt

    2. Zorg ervoor dat het dialoogvenster Overlay-knooppunt de volgende waarden heeft:

      Pad: /libs/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/css

      Locatie bedekking: /apps/

      Identieke knooppunttypen: Ingeschakeld

      Pad overlay-knooppunt

      note note
      NOTE
      Wijzig de instelling /libs vertakking. Alle wijzigingen die u aanbrengt, kunnen verloren gaan, omdat deze vertakking wijzigingen kan ondergaan wanneer u:
      code language-none
      * Upgrade op uw exemplaar
      * Een hotfix toepassen
      * Een functiepakket installeren
      
    3. Klikken OK. De css-map wordt gemaakt in het opgegeven pad.

  3. Maak in de map Apps een map met de naam imgs met een pad/structuur die vergelijkbaar is met imgs in de map ccrui.

    1. Klik met de rechtermuisknop op de knop imgs map op het volgende pad en selecteer Overlayknooppunt: /libs/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/imgs

    2. Zorg ervoor dat het dialoogvenster Overlay-knooppunt de volgende waarden heeft:

      Pad: /libs/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/imgs

      Locatie bedekking: /apps/

      Identieke knooppunttypen: Ingeschakeld

    3. Klikken OK.

      note note
      NOTE
      U kunt de mapstructuur ook handmatig in de map /apps maken.
  4. Klikken Alles opslaan om de wijzigingen op de server op te slaan.

Upload uw aangepaste logobestand naar CRX. De standaard HTML-regels bepalen de rendering van het logo. De ondersteunde indelingen voor afbeeldingsbestanden zijn gebaseerd op de browser die u gebruikt om toegang te krijgen tot AEM Forms. Alle browsers ondersteunen JPEG, GIF en PNG. Zie de browserspecifieke documentatie over de ondersteunde afbeeldingsindelingen voor meer informatie.

  • De standaardafmetingen van de logoafbeelding zijn 48 px * 48 px. Zorg ervoor dat de afbeelding even groot of groter is als deze * 48 px.
  • Als de hoogte van de logoafbeelding groter is dan 50 px, wordt de afbeelding in de gebruikersinterface Correspondentie maken verkleind tot een maximale hoogte van 50 px, aangezien dit de hoogte van de koptekst is. Tijdens het verkleinen van de afbeelding behoudt de gebruikersinterface Correspondentie maken de hoogte-breedteverhouding van de afbeelding.
  • Als de afbeelding klein is, wordt de schaal van de gebruikersinterface Correspondentie maken niet vergroot. Zorg er dus voor dat u een logoafbeelding van minimaal 48 pixels hoog en voldoende breed gebruikt voor meer duidelijkheid.

Ga als volgt te werk om het aangepaste logobestand naar CRX te uploaden:

  1. Ga naar https://'[server]:[port]'/[contextpath]/crx/de. Meld u indien nodig aan als beheerder.

  2. Klik in CRXDE met de rechtermuisknop op de knop imgs map op het volgende pad en selecteer Maken > Bestand maken:

    /apps/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/imgs/

    Nieuw knooppunt maken in map imgs

  3. Voer in het dialoogvenster Bestand maken de naam van het bestand in als CustomLogo.png (of de naam van het logobestand).

    CustomLogo.png als nieuw knooppunt

  4. Klikken Alles opslaan.

    Onder het nieuwe bestand dat u hebt gemaakt (hier CustomLogo.png), wordt de eigenschap jcr:content weergegeven.

  5. Klik op jcr:inhoud in de mapstructuur.

    jcr:eigenschappen van inhoud worden weergegeven.

    jcrContentProperties

  6. Dubbelklik op de knop jcr:gegevens eigenschap.

    Het dialoogvenster jcr:gegevens bewerken wordt geopend.

    Klik nu op de map newlogo.png, dubbelklik vervolgens op jcr:content (grijze optie) en stel het type nt:resource in. Als deze niet aanwezig is, maakt u een eigenschap met de naam jcr:content.

  7. Klik in het dialoogvenster jcr:gegevens bewerken op Bladeren en selecteert u het afbeeldingsbestand dat u als logo wilt gebruiken (hier CustomLogo.png).

    De ondersteunde indelingen voor afbeeldingsbestanden zijn gebaseerd op de browser die u gebruikt om toegang te krijgen tot AEM Forms. Alle browsers ondersteunen JPEG, GIF en PNG. Zie de browserspecifieke documentatie over de ondersteunde afbeeldingsindelingen voor meer informatie.

    Voorbeeld van aangepast logobestand

    Voorbeeld: CustomLogo.png te gebruiken als het aangepaste logo

  8. Klikken Alles opslaan.

CSS maken voor het renderen van het logo met de gebruikersinterface createcss

Voor de aangepaste logoafbeelding moet een extra stijlpagina worden geladen in de context van de inhoud.

Gebruik de volgende stappen om de stijlpagina te maken voor het renderen van het logo met de gebruikersinterface:

  1. Ga naar https://'[server]:[port]'/[contextpath]/crx/de. Meld u indien nodig aan als beheerder.

  2. Maak een bestand met de naam customcss.css (u kunt geen andere bestandsnaam gebruiken) op de volgende locatie:

    /apps/fd/cm/ccr/gui/components/admin/clientlibs/ccrui/css/

    Stappen om het bestand customcss.css te maken:

    1. Klik met de rechtermuisknop op de knop css map en selecteer Maken > Bestand maken.

    2. Geef in het dialoogvenster Nieuw bestand de naam van de CSS op als customcss.css(u kunt geen andere bestandsnaam gebruiken) en klik op OK.

    3. Voeg de volgende code toe aan het nieuwe CSS-bestand. In inhoud:url in de code, specificeer de beeldnaam u aan de omslag van imgs in CRXDE hebt geupload.

      code language-css
      .logo, .logo:after {
      content:url("../imgs/CustomLogo.png");
      }
      
    4. Klikken Alles opslaan.

De interface Correspondentie maken vernieuwen zodat u het aangepaste logo kunt zien refreshccrui

Wis het browsercache en open vervolgens de instantie Correspondentie-UI maken in uw browser, zodat u het aangepaste logo kunt zien.

Gebruikersinterface voor correspondentie maken met aangepast logo

Het aangepaste pictogram in de gebruikersinterface voor correspondentie maken

recommendation-more-help
19ffd973-7af2-44d0-84b5-d547b0dffee2