Lägga till kontrollen rich text editor till en modellbaserad app

  • Artikel
  • 25 minuter för att läsa

Med kontrollen rich text editor får appanvändaren ett WYSIWYG-redigeringsområde där text kan formateras. Kontrollens indata- och utdataformat är HTML. Kontrollen möjliggör kopiering av RTF-format, t.ex. från en webbläsare eller Word, som ska klistras in i kontrollen.

Följande formateringsalternativ är tillgängliga:

  • Fet, kursiv, understrykning och genomstrykning
  • Textfärg, markeringsfärg
  • Teckensnitt och storlek
  • Numrerade listor och punktlistor
  • Hyperlänkar
  • Tabeller
  • Bilder

En fullständig lista med standardalternativ finns i Använda verktygsfältet för Rich Text Editor.

Rich text control editor in a model-driven app

Lägga till eller ersätta en textkolumn för redigering med RTF-format

Skapa en ny textkolumn och konfigurera kontrollen eller ersätt en befintlig textkolumn. Rich text editor-kontrollen kan användas med enkla textkolumner och kolumner med flera rader.

Enkel konfiguration

Om du vill aktivera Rich Text Editor med standardvärden i en ny eller befintlig textkolumn kan du ställa in alternativet Format till RTF genom att följa stegen nedan. Mer information om standardvärden: Använd standardwebbresursen för organisationstäckande ändringar

  1. Logga in på Power Apps.

    Anteckning

    Om du har ett befintligt RTF-textfält kan du använda API:et och ändra formatet till Richtext. Mer information: Konverteringar av datatypformat

  2. I det vänstra navigeringsfönstret väljer du Lösningar, öppnar den lösning du vill ha, öppnar tabellen du vill ha och väljer sedan området Kolumner.

  3. Välj +Lägg till > Kolumn, ange ett namn för kolumnen, välj en datatyp för text och välj sedan formatalternativet RTF.

  4. Spara kolumnen. Du kan nu lägga till den nya kolumnen i valfritt befintligt eller nytt formulär för tabellen.

Avancerad konfiguration

Kontrollen för rich text editor levereras med en mängd konfigurationsalternativ som gör det möjligt att anpassa utseendet, funktionerna och beteendet. Gör så här om du vill aktivera Rich Text Editor med en specifik konfiguration för en ny eller befintlig kolumn.

  1. Logga in på Power Apps.
  2. I det vänstra navigeringsfönstret, välj Lösningar, öppna den lösning du vill ha, öppna tabellen du vill ha och välj sedan området Formulär.
  3. Markera formuläret och välj sedan Redigera formulär > Redigera formulär i en ny flik.
  4. I arbetsytan för formulärdesigner, lägg till eller skapa en textkolumn eller markera en befintlig textkolumn, till exempel den anpassade textkolumnen med flera radrutor som används i den här artikeln.
  5. I egenskapsfönstret för den högra kolumnen expanderar du avsnittet Komponenter, väljer + Komponent och väljer sedan Rich Text Editor-kontrollen.
  6. I fönstret Lägg till rich text editor kontroll, välj bland följande alternativ och välj sedan Klar:

    • Bind till tabellkolumn: Vi rekommenderar inte att du aktiverar det här alternativet eftersom den här egenskapen inte stöder bindning till en annan tabellkolumn.

    • Statiskt värde: Om du vill anpassa utseende, funktioner och beteende för Rich Text Editor anger du den relativa URL-adressen till JavaScript-webbresursen som innehåller de egenskaper du vill använda. Mer information: Skapa och använd avancerad konfiguration för redigeraren för kontrollen rich text editor

    • Webb, Telefon och Surfplatta: Aktivera alla om du vill att alla klientappar ska ha möjlighet att använda formaterad text i kolumnen.

      Rich text control editor configuration
  7. Spara och publicera formuläret.

Skapa och använd avancerad konfiguration för redigeraren för kontrollen rich text editor

Följ dessa steg för att skapa och använda avancerad konfiguration för rich text editor kontrollen:

  1. Skapa en JavaScript-fil (JS) som innehåller textfilen i JSON-format med den defaultSupportedProps struktur och konfiguration du vill ha. Mer information: Fler exempel på konfigurationer för RTF-redigerare och Rich text editor egenskaper

  2. I Power Apps, skapa en JavaScript (JS) typ webbresurs med hjälp av JSON-filen som skapades i steg 1. Mer information: Skapa eller redigera webbresurser för modellbaserad app för att utöka en app

  3. Lägg till den relativa URL-adressen för JavaScript-webbresursen, till exempel /WebResources/contoso_toolbartoprte i fältet Statiskt värde i fönstret Lägg till rich text editor-kontroll . Mer information: Lägga till eller byta ut en textkolumn för redigering av RTF-text

    Tips

    • Webbresurs-URL:en finns bredvid URL-fältet i den webbresursdefinition du skapade i föregående steg.
    • Du kan använda den absoluta URL-adressen för det statiska värdet, men om du använder den relativa URL-adressen fungerar webbresursen även om den har importerats till en annan miljö som en lösning. URL för JavaScript webbresurs

  4. Spara och publicera formuläret.

Metodtips för att använda Rich Text Editor

Tänk på följande när du använder Rich Text Editor:

  • Bästa prestanda uppnås om HTML-innehållet är 1 MB eller mindre. Om HTML-innehållet överstiger 1 MB kan svarstiderna för inläsning och redigering av innehåll börja användas. Som standard refereras bildinnehåll från innehållets HTML-kod men lagras inte som en del av HTML-innehållet, så i standardkonfigurationen påverkas inte prestanda negativt av bilder.

  • RTF-textfält lagrar HTML-taggar som krävs för formatering tillsammans med användardata. När du anger maximal storlek för fältet ska du se till att tilldela en tillräckligt stor storlek för både HTML-taggarna och användardata.

  • Som standard överför Rich Text Editor bilder till Azure Blob Storage-platsen, och de lagras inte som en del av fältet. Bilder lagras i samma fält som base64 om den som skickar inte har behörighet till msdyn_richtextfiles entiteten. Base64-innehåll är stort och du vill vanligtvis inte lagra bilder som base64.

Så här konfiguration tillämpas på rich text editor

Upplevelsen och funktionerna i rich text editor styrs med konfiguration. Standardkonfigurationen för rich text editor-kontrollen har en egenskap och värden som är avsedda att uppfylla normala rtf-textbehov, men de kan justeras. Konfigurationsegenskaper och värden kan användas för en viss rich text editor kontroll instans. Det kan finnas upp till tre konfigurationsnivåer som kan användas för varje rich text editor-instans. Följande logik används för att tillämpa egenskaper och värden:

  1. Den icke redigerbara globala konfigurationsfilen RTEGlobalConfiguration_Readonly.json läses in.

  2. Den redigerbara global konfigurationsfilen RTEGlobalConfiguration.json läses in.

    • Egenskaperna i den här konfigurationen ersätter* samma namngivna egenskaper i den tidigare konfigurationsfilen.

  3. Instansspecifik konfigurationsfil läses in, om den finns. Mer information om konfiguration på instansnivå finns i Avancerad konfiguration.

    • Egenskaperna i den här konfigurationen ersätter* samma namngivna egenskaper i den tidigare konfigurationsfiler.

    Anteckning

    Alla egenskaper ersätts förutom extraPlugins som slås ihop. Genom att slå ihop extraPlugins kan du använda ett brett utbud av plugins i RTEGlobalConfiguration.json med hjälp av externalPlugins och färdiga tillhandahållna plugins. Sedan kan endast nödvändiga plugin-program aktiveras genom att lägga till dem i extraPlugins-värdena i instansen för den specifika konfigurationen.

En RTF-aktiverad kolumn har en begränsad uppsättning konfiguration som kan konfigureras för skrivskyddat eller inaktiverat läge. Mer information om konfigurationen finns i egenskapsbeskrivningen "readOnlySettings".

Rich Text Editor, egenskaper

JSON-filen består av egenskaper som anges som namn och värdepar. Det finns två typer av konfigurationer: avsnittet defaultSupportedProps och enskilda konfigurationsinställningar som tillhandahåller olika funktioner.

defaultSupportedProps är en uppsättning egenskaper för plugin-program och innehåller stöd för alla CKEditor-konfigurationer. Mer information: Visualisering av konfigurationsfilen för RTF-redigerare. defaultSupportedProps är inte begränsat till endast plugin-egenskaper som är dokumenterade från CKEditor, men du kan också ange egenskaper för ytterligare plugin-program som du lägger till eller skapar. Mer information om CKEditor-plugin-program: Tillgängliga plugin-program

Med de enskilda konfigurationsinställningarna kan du ändra hur redigeraren fungerar.

Visualisering av konfigurationsfilen för Rich Text Editor

Följande två bilder identifierar de två konfigurationsavsnitten visuellt. Den fullständiga konfigurationsfilen finns i Använda webbresursen för organisationsomfattande ändringar.

defaultSupportedProps

Mer information: defaultSupportedProps defaultsupportedprops konfiguration visualisering.

Individuella konfigurationsinställningar

Mer information: Enskilda konfigurationsinställningar Enskilda konfigurationsinställningar visualisering.

defaultSupportedProps

Du kan konfigurera alla egenskaper som stöds av CKEditor under den här egenskapen. Några av de vanligaste och anpassade konfigurationerna beskrivs nedan. Fullständig dokumentation om CKEditor-konfigurationer finns i CKEditor.config. RTF-redigerare använder för närvarande CKEditor version 4.17.1.

Attribut Description Default value
height

Anger den ursprungliga höjden för innehållsredigeraren. Standardinställningen är 185 px.

"height": 185
stickyStyle

Anger den faktiska standardstorleken och teckenformatet.

Plugin-programmet stickyStyle skapar ett omslag runt ditt innehåll med hjälp av elementet som specificeras av "stickyStyles_defaultTag", som initialt är konfigurerat som "div", och kan ändras till "p" eller någon alternativ tagg.

 
"stickyStyle": {
   "font-size": "9pt",
   "font-family": "'Segoe UI','Helvetica Neue',sans-serif"
},
"stickyStyles_defaultTag": "div"
font_defaultLabel

Anger standardetiketten som visas i verktygsfältet för teckensnitt. Standardinställningen är Segoe UI. Standardetiketten är endast visuell och fungerar inte. stickyStyle konfigurationen använder det funktionella teckensnittet och storleken.

"font_defaultLabel": "Segoe UI"
fontSize_defaultLabel

Anger standardetiketten som visas i verktygsfältet för teckenstorlek. Standardinställningen är 9. Standardetiketten är endast visuell och fungerar inte. stickyStyle konfigurationen använder det funktionella teckensnittet och storleken.

"fontSize_defaultLabel": "9"
toolbarLocation

Platsen för det användargränssnitt där verktygsfältet ska renderas. Värden som stöds är topp och botten. Standard är nedersta.

"toolbarLocation": "bottom"
verktygsfält

En lista med verktygsfältsknappar som ska läsas in.

 
"toolbar": [
  [ "CopyFormatting" ],
  [ "Font" ],
  [ "FontSize" ],
  [ "Bold" ],
  [ "Italic" ],
  [ "Underline" ],
  [ "BGColor" ],
  [ "TextColor" ],
  [ "BulletedList" ],
  [ "NumberedList" ],
  [ "Outdent" ],
  [ "Indent" ],
  [ "Blockquote" ],
  [ "JustifyLeft" ],
  [ "JustifyCenter" ],
  [ "JustifyRight" ],
  [ "Link" ],
  [ "Unlink" ],
  [ "Subscript" ],
  [ "Superscript" ],
  [ "Strike" ],
  [ "Image" ],
  [ "BidiLtr" ],
  [ "BidiRtl" ],
  [ "Undo" ],
  [ "Redo" ],
  [ "RemoveFormat" ],
  [ "Table" ]
]
plugin-program

Kommaavgränsad lista över plugin-program som ska användas i en redigeringsinstans. De faktiska plugin-program som läses in kan fortfarande påverkas av två andra inställningar: extraPlugins och removePlugins.

Om du uppdaterar den här inställningen kan plugin-programmen tas bort från verktygsfältet. Om du anger en tom sträng för den här egenskapen läses redigeraren in utan verktygsfältet.

Om du vill lägga till ett eller flera plugin-program i verktygsfältet rekommenderar vi att du använder extraPlugins. Om du vill ta bort en eller flera från standardlistan använder du removePlugins.

"plugins": [["button,toolbar,dialogui,dialog,autogrow,notification,clipboard,textmatch,fakeobjects,link,autolink,basicstyles,bidi,blockquote,panelbutton,panel,floatpanel,colorbutton,colordialog,listblock,richcombo,menu,contextmenu,copyformatting,enterkey,entities,popup,find,floatingspace,font,format,htmlwriter,horizontalrule,indent,indentblock,indentlist,justify,lineutils,openlink,list,liststyle,maximize,undo,menubutton,notificationaggregator,xml,ajax,pastetools,pastefromword,pastetext,preview,table,quicktable,removeformat,resize,selectall,showborders,sourcearea,specialchar,stylescombo,tab,tabletools,tableresize,tableselection,widgetselection,widget,wysiwygarea,textwatcher"]]
extraPlugins

En kommaavgränsad lista över andra plugin-program som ska läsas in. Den här inställningen gör det lättare att lägga till nya plugin-program utan att behöva använda inställningen för plugin-program.

Det finns många plugin-program som krävs för att andra plugin-program ska fungera. T.ex. krävs dialog-plugin-programmet för plugin-programmet för länk. Rich Text Editor lägger till dem automatiskt och du kan inte åsidosätta dem genom att uppdatera egenskapen. Med den här inställningen läggs endast nya plugin-program till i den föregående listan.

Om du vill ta bort någon av förinställningarna rekommenderar vi att du använder egenskapen removePlugins.

"extraPlugins": "accessibilityhelp,autogrow,autolink,basicstyles,bidi,blockquote,button,collapser,colorbutton,colordialog,confighelper,contextmenu,copyformatting,dialog,editorplaceholder,filebrowser,filetools,find,floatpanel,font,iframerestrictor,indentblock,justify,notification,panel,panelbutton,pastefromword,quicktable,selectall,stickystyles,superimage,tableresize,tableselection,tabletools,uploadfile,uploadimage,uploadwidget"
removePlugins

En lista över plugin-program som inte får läsas in. Med den här inställningen kan du undvika att läsa in vissa plugin-program som anges i inställningen plugins/extraPlugins, utan att behöva röra dem.

"removePlugins": "a11yhelp,codemirror,magicline,scayt,showborders"
superimageImageMaxSize

Den maximala storleken i megabyte (MB) tillåts för inbäddade bilder när du använder superimage-plugin. Standardinställningen är 5.

"superimageImageMaxSize": 5
disallowedContent

Med det här alternativet kan du inte tillåta element som du inte vill ha i innehållet. Du kan inte tillåta hela element eller attribut, klasser och formatmallar. Mer information om konfigurationen av CKEditor "disallowedContent" finns i Regler för otillåtet innehåll.

"disallowedContent": "form[action]; *[formaction]; script; *[on*]"
linkTargets

Gör att du kan konfigurera vilka länkmålalternativ som är tillgängliga för användare när de skapar länkar.

 Länka mål - ```notSet```: Inget mål har angetts för dokumentet i taggen - ```frame```: Öppnar dokumentet i den angivna ramen - ```popupWindow``` : Öppnar dokumentet i ett popup-fönster - ```_blank``` : Öppnar dokumentet i ett nytt fönster eller flik - ```_top``` : Öppnar dokumentet i hela textfönstret i fönstret - ```_self``` : Öppnar dokumentet i samma fönster eller flik där länken aktiveras - ```_parent``` : Öppnar dokumentet i den överordnade ramen



Exempel:

"linkTargets": ["notSet", "_blank"]

Individuella konfigurationsinställningar

Du kan konfigurera andra konfigurationsinställningar som påverkar hur redigeraren fungerar.

Attribut Description Default value
attachmentEntity

Genom att ange den här egenskapen och ange en annan tabell kan du undvika att använda standardtabellen för filer så att du kan upprätthålla mer säkerhet vid behov.

Mer information: Filkolumner (Microsoft Dataverse) – Power Apps

Syntax:

 "attachmentEntity": {
   "name": "<<name of the image table>>",
   "fileAttributeName": "<<attribute name of the blob reference>>"
}

Exempel:

"attachmentEntity": {
  "name": "msdyn_mystorageforcustomizedsecurity",
  "fileAttributeName": "msdyn_customfilestorage"
}

Standardvärde:

"attachmentEntity": {
  "name": "msdyn_richtextfiles",
  "fileAttributeName": "msdyn_fileblob"
}
disableContentSanitization Som standard inaktiveras innehållsrening för att kopiera och klistra in innehåll från externa källor. När funktionen är aktiverad tas en del av de egna attributen eller taggarna bort när de är aktiverade. Konfigurationen gäller endast redigeringsläge. Skrivskyddad eller inaktiverad tillståndsrendering kommer alltid att saneras.

"disableContentSanitization": true
disableDefaultImageProcessing

Som standard laddas bilderna upp med klient-API. Så fort en bild läggs till i redigeraren överförs den till plattformen. Om du vill bearbeta bilder ger du den här egenskapen värdet sant.

"disableDefaultImageProcessing": false
disableImages

Om den här egenskapen har värdet sant inaktiveras bilderna. Den här egenskapen har högst prioritet. Detta innebär att när egenskapen har värdet sant inaktiveras bilderna, oavsett egenskapsvärde för imageEntity. Som standard är bilder aktiverade.

"disableImages": false
externalPlugins

Med hjälp av den här egenskapen kan du skriva egna plugin-program och använda dem i kontrollen rich text editor.

Inget standardvärde eftersom det är så här du kan utöka funktionaliteten genom att lägga till andra plugin-program som inte ursprungligen angavs. Sökvägsvärdet kan vara en absolut eller relativ URL.

Exempel:

"externalPlugins": [
    {
      "name": "<<Plugin Name>>",
      "path": "<<Plugin’s folder path>>”
    }
  ]

Exempel:

"externalPlugins": [
  {
    "name": "EmbedMedia",
    "path": "/WebResources/msdyncrm_/myplugins/embedmedia/"
  }
]
imageEntity

Genom att ange den här egenskapen och ange en annan tabell kan du undvika att använda standardtabellen för bilder så att du kan upprätthålla mer säkerhet vid behov.

Mer information: Bildkolumner (Microsoft Dataverse) – Power Apps

Syntax:

 "imageEntity": {
   "imageEntityName": "<<name of the image table>>",
   "imageFileAttributeName": "<<attribute name of the blob reference>>"
}

Exempel:

"imageEntity": {
  "imageEntityName": "msdyn_mystorageforcustomizedsecurity",
  "imageFileAttributeName": "msdyn_customimagestorage"
}

Standardvärde:

"imageEntity": {
  "imageEntityName": "msdyn_richtextfiles",
  "imageFileAttributeName": "msdyn_imageblob"
}
readOnlySettings

Genom att ange den här egenskapen kan du konfigurera andra funktionssätt för kolumnen när de visas i skrivskyddat eller inaktiverat läge.

Exempel:

"readOnlySettings": {
  "height:": 500,
  "showFullScreenExpander": true
}

Standardvärde:

"readOnlySettings": {
}
readOnlySettings

Genom att ange den här egenskapen kan du tillåta att mer innehåll visas.

Exempel:

 "sanitizerAllowlist": {
   "attributes": ["data-id-wrapper"],
   "cssProperties": ["filter","list-style-type"],
   "domains": ["([a-z0-9]+[.])*.youtube.com","www.randomsite.com"],
   "protocols": ["file","ftp"],
   "tags": ["input"]
}

Standardvärde:

"sanitizerAllowlist": {
  "attributes": [],
  "cssProperties": [],
  "domains": [],
  "protocols": [],
  "tags": []
}
showAsTabControl

Genom att ange den här egenskapen kan du visa fler kommandon ovanför redigeringsfönstret.

Måste anges som sant för att följande attribut ska kunna aktiveras:

  • showFullScreenExpander
  • showHtml
  • showPreview
  • showPreviewHeaderWarning

"showAsTabControl": false
showFullScreenExpander

Egenskapen lägger till funktionen för att visa/dölja hela skärmen, så att du kan visa och använda redigeraren i helskärmsläge.

Beror på att showAsTabControl har angetts som sann.

"showFullScreenExpander": false
showHtml

Egenskapen lägger till alternativet att visa och redigera html-innehållet direkt.

Beror på att showAsTabControl har angetts som sann.

"showHtml": false
showPreview

Den här egenskapen lägger till alternativet att förhandsgranska redigeringsinnehållet som återges som html. När du förhandsgranskar kan du se hur innehållet kommer att visas om du delar och renderar innehållet som HTML utanför redigeraren.

Beror på att showAsTabControl har angetts som sann.

"showPreview": false
showPreviewHeaderWarning

Med den här egenskapen kan du visa/dölja ett varningsmeddelande som visas när du förhandsgranskar innehåll.

Beror på att showAsTabControl och showPreview har angetts som sann.

"showPreviewHeaderWarning": false

Vanligt använda konfigurationer för RTF-redigerare

Följande är vanliga konfigurationer för RTF-redigeraren. De här exempelkonfigurationerna kan användas för att aktivera särskilda typer av RTF-textupplevelser. För varje exempel skapar du en JSON-webbresurs eller ändrar standardkonfigurationen för webbresursen. Mer information: Skapa och använda avancerad konfiguration för rich text editor-kontroll och Använda standardwebbresursen för organisationstäckande ändringar

Ange standardteckensnittet Calibri med teckenstorlek 11st

Ange standardteckensnittet och standardstorleken så att de matchar Microsoft Windows standardvärdena. Det här exemplet visar vilka inställningar du använder för att implementera den här förändringen.

Ange dessa defaultSupportedPropsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: defaultSupportedProps)


   "font_defaultLabel": "Calibri"
   
   "fontSize_defaultLabel": "11"
   
   "stickyStyle": {
     "font-size": "11pt",
     "font-family": "Calibri/Calibri, Helvetica, sans-serif;"
   }

Gör radbrytningar (Ange nyckel) skapa ett <br> i stället för <p>

Standardbeteendet för returnyckeln skapar styckeblock med <p> HTML-taggen (används även vid tolkning av klistrat innehåll). Styckeblock används i HTML för att gruppera information. I vissa fall, när du skapar ny eller klistrar in information från Microsoft Word eller annan innehållsredigerare, beroende på hur varje webbläsare tolkar formateringen för paragraf blocktaggen (<p>) slätt annorlunda, kanske du vill använda <br> HTML-tagg istället för styckeblock. Den vertikala överensstämmelsen <br> HTML taggar i vissa fall kan vara mer visuellt konsekventa över en mängd olika webbläsare och upplevelser. Det här exemplet visar hur du ändrar från <p> till <br>.

Ange dessa defaultSupportedPropsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: defaultSupportedProps)


   "enterMode": 2

Allt innehåll som klistrats in eller skapats är HTML 5-kompatibelt

Kontrollen rich text editor fungerar bäst med HTML 5-innehåll, men HTML 4-taggar och formatering kan också användas korrekt. I vissa fall kan både HTML 4- och HTML 5-taggarna användas för att skapa användbarhetsutmaningar när du väljer och anger teckensnitt och storlek. Genom att använda "allowedContent" kan du se till att allt innehåll är HTML 5. I det här exemplet tillåts alla HTML 5-taggar som stöds. Alla icke-kompatibla taggar konverteras till sina HTML 5-likvärdiga.

Ange dessa defaultSupportedPropsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: defaultSupportedProps)


   "allowedContent": "a(*)[*]{*};abbr(*)[*]{*};address(*)[*]{*};area(*)[*]{*};article(*)[*]{*};aside(*)[*]{*};audio(*)[*]{*};b(*)[*]{*};base(*)[*]{*};bdi(*)[*]{*};bdo(*)[*]{*};blockquote(*)[*]{*};body(*)[*]{*};br(*)[*]{*};button(*)[*]{*};canvas(*)[*]{*};caption(*)[*]{*};cite(*)[*]{*};code(*)[*]{*};col(*)[*]{*};colgroup(*)[*]{*};data(*)[*]{*};datalist(*)[*]{*};dd(*)[*]{*};del(*)[*]{*};details(*)[*]{*};dfn(*)[*]{*};dialog(*)[*]{*};div(*)[*]{*};dl(*)[*]{*};dt(*)[*]{*};em(*)[*]{*};embed(*)[*]{*};fieldset(*)[*]{*};figcaption(*)[*]{*};figure(*)[*]{*};footer(*)[*]{*};form(*)[*]{*};h1(*)[*]{*};h2(*)[*]{*};h3(*)[*]{*};h4(*)[*]{*};h5(*)[*]{*};h6(*)[*]{*};head(*)[*]{*};header(*)[*]{*};hr(*)[*]{*};html(*)[*]{*};i(*)[*]{*};iframe(*)[*]{*};img(*)[*]{*};input(*)[*]{*};ins(*)[*]{*};kbd(*)[*]{*};label(*)[*]{*};legend(*)[*]{*};li(*)[*]{*};link(*)[*]{*};main(*)[*]{*};map(*)[*]{*};mark(*)[*]{*};meta(*)[*]{*};meter(*)[*]{*};nav(*)[*]{*};noscript(*)[*]{*};object(*)[*]{*};ol(*)[*]{*};optgroup(*)[*]{*};option(*)[*]{*};output(*)[*]{*};p(*)[*]{*};param(*)[*]{*};picture(*)[*]{*};pre(*)[*]{*};progress(*)[*]{*};q(*)[*]{*};rp(*)[*]{*};rt(*)[*]{*};ruby(*)[*]{*};s(*)[*]{*};samp(*)[*]{*};section(*)[*]{*};select(*)[*]{*};small(*)[*]{*};source(*)[*]{*};span(*)[*]{*};strong(*)[*]{*};style(*)[*]{*};sub(*)[*]{*};summary(*)[*]{*};sup(*)[*]{*};svg(*)[*]{*};table(*)[*]{*};tbody(*)[*]{*};td(*)[*]{*};template(*)[*]{*};textarea(*)[*]{*};tfoot(*)[*]{*};th(*)[*]{*};thead(*)[*]{*};time(*)[*]{*};title(*)[*]{*};tr(*)[*]{*};track(*)[*]{*};u(*)[*]{*};ul(*)[*]{*};var(*)[*]{*};video(*)[*]{*};wbr(*)[*]{*};"

Fler exempel på konfigurationer för RTF-redigerare

Lägg till helskärmsutvidgaren

Ange dessa Individual configuration settingsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: Enskilda konfigurationsinställningar)


 "showAsTabControl": true
 
 "showFullScreenExpander": true

Kontroll av skärmutvidgare.

Lägg till fliken HTML-källvy

Ange dessa Individual configuration settingsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: Enskilda konfigurationsinställningar)


 "showAsTabControl": true
 
 "showHtml": true

HTML-flikkontroll.

Lägga till ett enkelt verktygsfält med teckenstorlek, fet, kursiv, understruken och markera

Ange dessa defaultSupportedPropsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: defaultSupportedProps)


   "toolbar": [ { "items": [ "FontSize", "Bold", "Italic", "Underline", "BGColor" ] } ]

Kontroller för en enkel redaktör.

Ta bort verktygsfältet för att skapa en RTF-återgivningsyta

Ange dessa defaultSupportedPropsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: defaultSupportedProps)


   "toolbar": []

Inget verktygsfält.

Lägg till en ny teckensnittslista och ställ in Bash-skript MT som standardteckensnitt med en standardstorlek på 20 px

Ange dessa defaultSupportedPropsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: defaultSupportedProps)


   "font_names": "Brush Script MT/'Brush Script MT', cursive;Calibri/Calibri, Helvetica, sans-serif;Calibri Light/'Calibri Light', 'Helvetica Light', sans-serif;"
   
   "font_defaultLabel": "Brush Script MT"
   
   "fontSize_sizes": "8/8px;12/12px;20/20px;32/32px"
   
   "fontSize_defaultLabel": "20"
   
   "stickyStyle": {
     "font-size": "20px",
     "font-family": "'Brush Script MT', cursive"
   }

Ställ in ett nytt standardteckensnitt.

Placera verktygsfältet överst i Rich Text Editor

Ange dessa defaultSupportedPropsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: defaultSupportedProps)


   "toolbarLocation": "top"

Verktygsfält placerat högst upp i Rich Text Editor.

Starta redigeraren med 30 pixlars höjd och automatiskt öka så att det passar innehållet

Ange dessa defaultSupportedPropsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: defaultSupportedProps)


   "autoGrow_onStartup": false
   
   "autoGrow_maxHeight": 0
   
   "autoGrow_minHeight": 30
   
   "height": 30

Om du skriver i det rika textområdet ökar det så att det passar innehållet.

Korrigera redigerarens höjd i 500 px

Ange dessa defaultSupportedPropsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: defaultSupportedProps)


   "removePlugins": [ "autogrow" ]
   
   "height": 500

Med en fast höjd förblir redigeraren samma höjd. När tillräckligt med innehåll läggs till visas en rullningslist.

Skapa en oformaterad textyta som tar bort alla html-taggar förutom br-taggen

Ange dessa defaultSupportedPropsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: defaultSupportedProps)


   "enterMode": 2
   
   "shiftEnterMode": 2
   
   "allowedContent": "*"
   
   "disallowedContent": "*"
   
   "forcePasteAsPlainText": true
   
   "toolbar": []
   
   "removePlugins": "contextmenu,liststyle,openlink,tableresize,tableselection,tabletools"

Ange dessa Individual configuration settingsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: Enskilda konfigurationsinställningar)


 "disableImages": true

Att skapa en ren textyta gör att remsorna blir html.

Ta bort snabbmenyn så att du högerklickar i standardwebbläsarens stavningskontroll

Om du aktiverar den här funktionen tas den kontextuella redigeringsfunktionen bort.

Ange dessa defaultSupportedPropsegenskaper i konfigurationsfilen. Varje värde ska följas av en , (comma) om det inte är det sista värdet: (Mer information: defaultSupportedProps)


   "removePlugins": "contextmenu,liststyle,openlink,tableresize,tableselection,tabletools"

Ta bort snabbmenyn så att högerklicka fungerar med standardkontroll av webbläsarens stavningskontroll.

Använda standard webbresursen för organisationstäckande ändringar

Standard RTE-webbkällan är tillgänglig med visningsnamn RTESourceConfiguration.json. Den här konfigurationen används för alla instanser av RTE-kontrollen och kan användas för att göra organisationstäckande ändringar. Detta omfattar RTE som används i avancerade textanteckningar i tidslinjen, kunskapshantering samt enskilda fält och fält med flera raderingar som konfigurerats för att använda RTE-kontrollen. Som standard är RTEGlobalConfiguration.json tom. Utifrån dina affärskrav kan du ange värden som du vill anpassa i den här filen. Använd den icke redigerbara RTEGlobalConfiguration.json som exempel om du vill lägga till parametrarna i formatet för strukturen som krävs.

Ett exempel på anpassade värden som du kan lägga till i RTEGlobalConfiguration.json är:

{
   "defaultSupportedProps": {
           "height": 300,
       "toolbarLocation" : "top"
    }
 }

Hitta den aktuella inställningen för en Rich Text Editor-konfiguration

  1. I en Microsoft Edge eller Google Chrome-webbläsare kör du din modellbaserad app och öppnar ett formulär som har kontrollen rich text editor, t.ex. en kontorad.

  2. Tryck på Ctrl medan du klickar i kontrollområdet för rich text editor och välj sedan kontrollera.

  3. I inspektionsfönstret välj fliken Konsol och välj sedan den överordnade sidan Main.aspx i listfönstret i kommandofältet.

    Välj fliken Konsol och välj sedan den överordnade main.aspx-sidan i listfönstret.

  4. Välj Rensa konsol i kommandofältet i inspektionsfönstret.

    Rensa konsolkommandot.

  5. I inspektionsfönstrets konsol, ange CKEDITOR.config. för att visa de olika konfigurationerna.

    Lista över CK Editor-konfigurationer.

  6. Välj en konfiguration, t.ex. autoGrow_minHeight, för att visa den aktuella inställningen.

Använd funktionerna i verktygsfältet för Rich Text Editor

Verktygsfältet för Rich Text Editor innehåller funktioner som gör att du kan arbeta med RTF-format i anteckningar och e-post.

Formateringsalternativ

I följande tabell beskrivs de olika formateringsfunktioner och formateringsalternativ som är tillgängliga i den avancerade textredigeraren.

Ikon Namn Shortcut key Beskrivning
Hämta format. Hämta format Ctrl+Shift+C, Ctrl+Shift+V Använd ett särskilt avsnitts utseende för ett annat avsnitt.
Teckensnitt. Teckensnitt Ctrl+Shift+F Välj ett typsnitt. Programmet betraktar det teckensnitt du väljer som standardteckensnitt. Segoe UI är standardteckensnittet om du inte väljer något.

Obs! när du markerar ett formaterat innehåll visas teckensnittsnamnet för det innehållet. Om markeringen innehåller flera teckensnitt visas det översta teckensnittsnamnet i markeringen.
Teckenstorlek. Teckenstorlek Ctrl+Skift+P Ändra storleken på texten. Programmet betraktar det teckensnitt du väljer som standardteckensnitt. 12 är standardteckensnittet om du inte väljer något.

Obs! när du markerar ett formaterat innehåll visas teckenstorleken för det innehållet. Om markeringen innehåller flera teckenstorlekar visas det översta teckensnittsnamnet i markeringen.
Djärv. Fetstil Ctrl+B Gör texten fet.
Italic. Italic Ctrl+I Kursivera texten.
Understruken. Understruken Ctrl+U Stryka under texten.
Textöverstrykningsfärg. Textöverstrykningsfärg Framhäva texten genom att markera den i en ljus färg.
Teckenfärg. Teckenfärg Ändra färg på texten.
Bilaga. Bifogad fil Bifoga en fil. När du har överfört en fil kan du markera länken för att förhandsgranska filen i dialogfönstret Förhandsgranskning av bifogade filer.
Punkter. Punktuppställningg Skapa en punktlista.
Numrering. Numrering Skapa en numrerad lista.
Minska indrag. Minska indrag Flytta stycket närmare marginalen.
Öka indrag. Öka indrag Flytta stycket längre bort från marginalen.
Blockcitat. Blockcitat Använd ett offertformat i blocknivå i innehållet.
Vänster. Vänsterjustera Ctrl+L Justera innehållet mot vänstermarginalen. (Används ofta för brödtext för att göra den lättare att läsa.)
Centrera. Centrera Ctrl+E Centrera innehållet på sidan. (Används ofta för formella utseenden.)
Höger. Högerjustera Ctrl+R Justera innehållet med höger marginal. (Används ofta för formella utseenden.)
Länk. Länka Skapa en länk i dokumentet för snabb åtkomst till webbsidor och filer.

Inklistrad eller skriven URL-text konverteras till en länk. Till exempel blir "http://myexample.com" kommer att bli "http://myexample.com".

I dialogfönstret Länk väljer du den typ av länk du vill infoga.

På fliken Länkinfo kan du välja länktypen samt ange länkprotokollet och URL.

Fliken Mål är endast tillgänglig för URL-länktypen. Den anger platsen där länken öppnas när du väljer på den.
Ta bort koppling. Ta bort länk Ta bort en länk i e-postmeddelandet eller dokumentet.

När du placerar markören på en länk aktiveras knappen Ta bort länk i verktygsfältet. Välj på knappen om du vill ta bort länken och göra den till oformaterad text.
Upphöjd. Upphöjd Skriv små bokstäver precis ovanför textraden.
Nedsänkt. Nedsänkt Skriv små bokstäver precis nedanför textraden.
Genomträngning. Genomstrykning Stryka över text genom att rita en linje genom den.
Infoga bild. Infoga bild Du kan infoga en bild genom att kopiera och klistra in den i redigeringsprogrammet direkt i redigeraren, dra och släppa den från skrivbordet eller den lokala mappen direkt i redigeraren eller genom att ange en URL. Följande format stöds: .PNG, .JPG., or .GIF.

Så här infogar du en bild i artikeln:
1. Dra och släpp bilden eller kopiera och klistra in den direkt i artikeln.
2. Dra i ett av bildens hörn för att ändra storlek på den.

Så här infogar du en bild med en URL-adress eller navigerar till den lokala bilden:
1. Välj Infoga bild.
2. I egenskapsdialogfönstret Bild väljer du bland följande alternativ:
  • Välj bläddra för att navigera till bilden på datorn.
  • Eller ange webbadressen till bilden och egenskaper för att definiera hur bilden visas i e-postmeddelandet eller artikeln.

    • Obs!
    • Om bilden finns på den externa servern använder du den fullständiga absoluta sökvägen.
    • Om bilden finns på en lokal server kan du använda en relativ sökväg.
    • Om du vill att bilden ska länkas till ett mål lägger du till en URL för bilden.
    • Du kan också ange om du vill att målsidan ska öppnas i ett nytt fönster, i det översta fönstret, i samma fönster eller i ett överordnat fönster.
Vänster till höger. Vänster till höger Ändra texten till vänster till höger för innehåll som ett stycke, ett sidhuvud, en tabell eller en lista. Används vanligtvis för innehåll på dubbelriktat språk. Det här är standardinställningen.
Höger till vänster. Höger till vänster Ändra texten till höger till vänster för innehåll som ett stycke, ett sidhuvud, en tabell eller en lista. Används vanligtvis för innehåll på dubbelriktat språk. Standardinställningen är vänster till höger.
Ångra inmatning. Ångra inmatning Ångra ändringarna som har gjorts på innehållet.
Gör om inmatning. Gör om inmatning Gör om ändringarna som har gjorts på innehållet.
Rensa all formatering. Rensa all formatering Ta bort all formatering från en markering och lämna endast den oformaterade texten.
Lägg till en tabell. Lägg till en tabell Lägga till en tabell i ditt innehåll.

När du har lagt till en tabell kan du göra följande:

  • Ändra storlek på tabellkolumner genom att klicka och dra med musen för att ändra storlek på kolumnerna till önskad bredd.
  • Markera en eller flera celler i en tabell och använd en särskild formatering, Lägg till länkar till markeringen eller klipp ut, kopiera eller klistra in hela rader eller kolumner.
  • Högerklicka för åtkomst till egenskaperna. Detta stöder funktioner som celltyp, bredd och höjd, radbrytning, justering, sammanfogning och delning av celler vågrätt och lodrätt, infoga eller ta bort i rader och kolumner, rad- och kolumnintervall samt cell- och kantlinjefärg.
Hjälp med hjälpmedel Alt+0 Visa en lista över tillgängliga kortkommandon när du använder kontrollen rich text editor.
Visa verktygsfält. Visa verktygsfält Visas när verktygsfältet är minimerat och inte alla alternativ visas. Välj om du vill expandera verktygsfältet och göra alla alternativ synliga.

Tips

Du kan komma åt webbläsarens snabbmeny genom att markera Ctrl + högerklicka. Det här är användbart om du behöver använda den inbyggda stavningskontroll i webbläsaren. Annars kan du högerklicka om du vill tillhandahålla sammanhangsbaserad formatering för vilket element du än använder.

Ett alternativ till din webbläsares inbyggda stavningskontroll är också Microsoft Editor webbläsartillägg. Microsoft Editor fungerar sömlöst med rich text editor-kontrollen och när det är aktiverat ger det snabba och enkla funktioner för stavningskontroll och kontroll.

Genvägar för hjälpmedel

I följande tabell visas en lista över tillgängliga kortkommandon när du använder kontrollen rich text editor. Du kan använda den här listan när du skriver innehåll genom att trycka på Alt+0.

Type Kortkommando Beskrivning
Allmänt Alt+F11 Växla helskärm.
Fliknavigering Alt+Ctrl+0 Gå till verktygsfältet för redigerare.
Fliknavigering Alt + 1 Gå till Rich Text Editor.
Fliknavigering Alt + 2 Gå till HTML-redigera.
Fliknavigering Alt + 3 Gå till visning av förhandsversionen.
Allmänna redigeringskommandon Alt+F10 Navigera till verktygsfältet för redigeraren. Gå till nästa och föregående verktygsfältsgrupp med Skift+Tabb. Gå till nästa och föregående verktygsfältsknapp med högerpil eller vänsterpil. Tryck på blanksteg eller retur för att aktivera knappen i verktygsfältet.
Allmänna redigeringskommandon Alt+- Visa eller dölj verktygsfältet för redigerare.
Allmänna redigeringskommandon Se beskrivning. Dialogfönstret redigering: i en dialog, tryck på tabb för att navigera till nästa dialogelement, tryck på Shift+Tabb för att gå till föregående dialogelement, tryck på retur för att skicka dialogfönstret och tryck på ESC för att avbryta dialogen. Om en dialog har flera flikar kan du nå fliksidan antingen med Alt+F10 eller med tabb, efter tabbordningen i dialogen. Gå till nästa och föregående flik med en fokuserad flikkontroll och klicka på högerpil.
Allmänna redigeringskommandon Se beskrivning. Listfönstret redigerare: i en listruta flyttar du till nästa List objekt med tabb eller nedpil. Flytta till föregående listobjekt med Shift+tabb eller uppil. Tryck på mellanslag eller retur för att välja listalternativ. Tryck på Retur om du vill stänga listfönstret.
Baskommandon Ctrl+Z Ångra kommando.
Baskommandon Shift+Ctrl+Z Gör om kommando.
Baskommandon Ctrl+B Fetstil kommando
Baskommandon Ctrl+I Kursiv kommando.
Baskommandon Ctrl+U Understruket kommando.
Baskommandon Alt+0 Hjälpmedel.
Grundläggande kommandon Esc Avbryt åtgärd.

Offline-erfarenhet

RTF-redigeringskontrollen är tillgänglig när du arbetar offline med en grundläggande konfiguration. Följande är en lista med plugin-program som stöds och formateringsalternativ när du arbetar offline. Alla konfigurationer som läggs till via webbresursfiler är inte tillgängliga när du arbetar offline.

Bilder som överförts med standardkonfigurationen är inte tillgängliga offline.

Plugins tillgängliga för offline

Följande plugin-program är tillgängliga för RET-redigeraren när du arbetar offline.

ajax,autogrow,basicstyles,bidi,blockquote,button,confighelper,contextmenu,dialog,dialogui,editorplaceholder,enterkey,entities,fakeobjects,floatingspace,floatpanel,format,horizontalrule,htmlwriter,indent,indentblock,indentlist,justify,lineutils,list,listblock,maximize,menu,menubutton,notification,notificationaggregator,panel,panelbutton,popup,preview,removeformat,resize,richcombo,selectall,showborders,sourcearea,specialchar,stylescombo,tab,textmatch,textwatcher,toolbar,undo,widgetselection,wysiwygarea,xml

Formateringsalternativ för offline

I följande tabell beskrivs de olika formateringsfunktioner och formateringsalternativ som är tillgängliga i den avancerade RTF-redigeraren offline.

Ikon Namn Shortcut key Beskrivning
Fet. Fetstil Ctrl+B Gör texten fet.
Italic. Kursiv Ctrl+I Kursivera texten.
Understruken. Understruket Ctrl+U Stryka under texten.
Punkter. Punktuppställningg Skapa en punktlista.
Numrering. Numrering Skapa en numrerad lista.
Minska indrag. Minska indrag Flytta stycket närmare marginalen.
Öka indrag. Öka indrag Flytta stycket längre bort från marginalen.
Blockcitat. Blockcitat Använd ett offertformat i blocknivå i innehållet.
Vänster. Vänsterjustera Ctrl+L Justera innehållet mot vänstermarginalen. (Används ofta för brödtext för att göra den lättare att läsa.)
Centrera. Centrera Ctrl+E Centrera innehållet på sidan. (Används ofta för formella utseenden.)
Höger. Högerjustera Ctrl+R Justera innehållet med höger marginal. (Används ofta för formella utseenden.)
Genomstruken. Genomstruken Stryka över text genom att rita en linje genom den.
Vänster till höger. Vänster till höger Ändra texten till vänster till höger för innehåll som ett stycke, ett sidhuvud, en tabell eller en lista. Används vanligtvis för innehåll på dubbelriktat språk. Det här är standardinställningen.
Höger till vänster. Höger till vänster Ändra texten till höger till vänster för innehåll som ett stycke, ett sidhuvud, en tabell eller en lista. Används vanligtvis för innehåll på dubbelriktat språk. Standardinställningen är vänster till höger.
Ångra inmatning. Ångra inmatning Ångra ändringarna som har gjorts på innehållet.
Gör om inmatning. Gör om inmatning Gör om ändringarna som har gjorts på innehållet.
Rensa all formatering. Rensa all formatering Ta bort all formatering från en markering och lämna endast den oformaterade texten.

Vanliga frågor och svar

F: Varför går det långsamt att visa inmatade tecken?

A. En stor innehållsstorlek kan orsaka laggningsproblem. Mer information finns i Metodtips för RTF-redigeraren. Stavnings- eller kontroll av stavningskontroller kan också göra att skrivprestanda kan bli långsammare.

F: Varför kan jag inte överföra en bild och varför går det inte att läsa in förhandsgranskningen?

A. Om bildfilsnamnet är långt eller innehåller många tecken med full bredd kanske det inte går att överföra eller så visas kanske inte förhandsgranskningen. Försök förkorta filnamnet och överför det sedan igen.

Fel i förhandsversion av bil.

Kända problem

  • HTML-kod visas för kolumner som konfigurerats för att använda kontrollen rich text editor och visas i andra komponenter än en kolumn i ett formulär som inte har formatet inställt på RichText Detta händer till exempel i vyer, underrutnät, sidnumrerade rapporter och Power Pages.

HTML-kod som visas i en kolumn på ett underrutnät. Information om hur du löser problemet finns i Enkel konfiguration för de steg som krävs för att ange Format alternativet RTF.

Se även

Skapa och redigera kolumner för Microsoft Dataverse med Power Apps‑portalen

Anteckning

Kan du berätta om dina inställningar för dokumentationsspråk? Svara i en kort undersökning. (observera att undersökningen är på engelska)

Undersökningen tar ungefär sju minuter. Inga personuppgifter samlas in (sekretesspolicy).