Koristite prilagođene atribute da biste omogućili funkcije dizajnera u e-porukama, obrascima i na stranicama
Dizajneri sadržaja obezbeđuju grafički i uređivač HTML koda. HTML koji oni generišu je kompatibilan sa bilo kojim prikazivačem za HTML, ali oni podržavaju i nekoliko prilagođenih atributa koji omogućavaju elemente dizajna sa opcijom prevlačenja i otpuštanja, kao i opšta podešavanja stila koja pruža grafički uređivač. Podrazumevani predlošci poruka i predlošci stranica Dynamics 365 Customer Insights - Journeys obezbeđuju korišćenje ovih prilagođenih atributa kako bi vam olakšali prilagođavanje na određene načine. Takođe, ove prilagođene atribute možete da koristite i kad dizajnirate sopstvene predloške.
Napojnica
Microsoft ne pruža podršku za prilagođeni HTML u e-porukama.
Rezime oznaka i atributa
Sledeća tabela sadrži kratka uputstva za prilagođene atribute i metaoznake opisane u ovoj temi.
| Prilagođeni atribut | Opis |
|---|---|
<meta type="xrm/designer/setting" name="type" value="marketing-designer-content-editor-document"> |
Kada je ova oznaka prisutna u <head> dokumentu, kartica "Dizajner " će obezbediti funkcije za prevlačenje i otpuštanje. Ako ova oznaka nije prisutna, kartica " Dizajner " obezbeđuje pojednostavljeni uređivač cele stranice. Više informacija:Prikaži okvir sa alatkama i omogući uređivanje prevlačenja i otpuštanja |
<meta type="xrm/designer/setting" name="additional-fonts" datatype="font" value="<font-list>"> |
Kada ova oznaka bude prisutna u <head> dokumentu, fontovi <navedeni na listi fontova> (razdvojeni tačkom i zarezom) biće dodati meniju fonta na traci sa alatkama za oblikovanje za elemente teksta. Više informacija:Dodavanje novih fontova na traku sa alatkama elementa teksta |
<div data-container="true"> … </div> |
Označava početak i kraj kontejnera u koji korisnici mogu da prevlače i otpuštaju elemente dizajna. Više informacija:Kreirajte kontejner u koji korisnici mogu da dodaju elemente dizajna |
<div data-editorblocktype="<element-type>"> … </div> |
Označava početak i kraj elementa dizajna. Vrednost atributa identifikuje koji je tip elementa (tekst, slika, dugme i tako dalje). Pojedini elementi dizajna ovde podržavaju dodatne atribute. Više informacija:Identifikujte elemente dizajna i zaključajte elemente u prikazu dizajnera |
<meta type="xrm/designer/setting" name="<name>" value="<initial-value>" datatype="<data-type>" label="<label>"> |
Ova oznaka definiše postavku stila širom dokumenta koju korisnici mogu da uređuju pomoću kartice "Stilovi>dizajnera ". Više informacija:Dodavanje postavki na karticu "Stilovi" |
/* @<tag-name> */ … /* @<tag-name> */ |
Koristite CSS ovakve komentare da CSS biste okružili vrednost koju treba kontrolisati postavkom stila, <pri kojoj je ime oznake> vrednost atributa imena za meta oznaku koja je uspostavila postavku. Više informacija:Dodavanje komentara CSS za primenu postavki stila u glavi |
property-reference= "<attr>:@< tag-name >;<attr>:@< tag-name >; …" |
Postavite ovaj atribut u bilo koju HTML oznaku da biste atribut postavio sa vrednošću kontrolisanom postavkom stila, <pri kojoj je attr> ime atributa koji treba <kreirati, a tag-ime> name vrednost atributa meta oznake koja je uspostavila postavku. Više informacija:Dodavanje atributa reference svojstva za primenu postavki stila u telu |
Preostali odeljci ove teme pružaju više informacija o tome kako možete da koristite svaku od funkcija navedenih u tabeli.
Prikažite okvir sa alatkama i omogućite uređivanje prevlačenjem i otpuštanjem
HTML koji se razvija u bilo kojoj alatki nezavisnih proizvođača možete da nalepite direktno u HTML karticu dizajnera da biste vrlo brzo započeli izradu dizajna. Međutim, kada to uradite, kartica "Dizajner " će biti prikazana kao jedan uređivač obogaćenog teksta koji obezbeđuje traku sa alatkama za oblikovanje teksta i prikazuje sve slike, veze i stilove uključene u HTML, ali na drugi način ne obezbeđuje kartice "Okvir sa alatkama", "Svojstva" ili "Stilovi " ili bilo koju funkcionalnost prevlačenja i otpuštanja (ovaj pojednostavljeni prikaz dizajnera ponekad se naziva uređivač cele stranice). Međutim, možete da omogućite funkcionalnost prevlačenja i otpuštanja za bilo koji nalebljeni dizajn dodavanjem sledeće meta <head> oznake u odeljak dokumenta:
<meta type="xrm/designer/setting" name="type" value="marketing-designer-content-editor-document">
Sledeća slika prikazuje isti dizajn u režimu uređivanja za kompletnu stranicu (levo) i režimu prevlačenja i otpuštanja (desno). Jedina razlika je u tome što dizajn na desnoj strani sadrži metaoznaku, pa je prevlačenje i otpuštanje omogućeno i prikazana je bočna tabla.
Belešku
Kada koristite uređivač za kompletnu stranicu, i dalje možete da birate, uređujete i određujete stil teksta preko trake sa alatkama za oblikovanje teksta (prikazano), a možete i da kliknete dva puta na slike, veze i druge elemente da biste podesili njihova svojstva preko iskačućeg dijaloga. Traka sa alatkama sadrži i dugme za uređivanje asistencije 
za dodavanje dinamičkog sadržaja, kao što su vrednosti polja izvučene iz zapisa kontakta svakog primaoca.
Kreirajte kontejner u koji korisnici mogu da dodaju elemente dizajna
Na kartici Dizajner korisnici mogu da uređuju samo sadržaj koji se nalazi u elementu dizajna i mogu da prevuku samo nove elemente dizajna u one delove dokumenta koji su podešeni kao kontejneri podataka. Zbog toga na kartici "Dizajn" možete da kreirate predloške u kojima su neke oblasti (izvan kontejnera) zaključane za uređivanje , dok će druge ares (unutar otključanih kontejnera) prihvatiti uređivanje i prevučeni sadržaj.
Koristite <div> oznake koje sadrže atribut za kreiranje data-container="true" kontejnera sa podacima, kao što su:
<table aria-role="presentation">
<tbody><tr>
<td>
LOCKED
</td>
<td>
<div data-container="true">
<!-- DRAG HERE -->
</div>
</td>
</tr>
</tbody></table>
Sve tekstualne ili HTML oznake koje su ugnežđene u par div-tagova kontejnera sa podacima i nisu deo elementa dizajna, stvoriće oblast između dve oblasti koje se mogu prevući. Na primer:
<div data-container="true">
<!-- DRAG HERE --> <p> LOCKED </p> <!-- DRAG HERE -->
</div>
Belešku
Kada je omogućen uređivač cele stranice, sve funkcije prevlačenja i otpuštanja su onemogućene i možete da uređujete sav sadržaj na kartici "Dizajner ", data-container uključujući sadržaj izvan oznaka za div (koje nemaju efekta u uređivaču cele stranice).
Zaključavanje kontejnera u prikazu Dizajner
Kontejner možete zaključati da bi sav sadržaj bio samo za čitanje na kartici " Dizajner ". Ako zaključani kontejner sadrži elemente dizajna, svi sadržaji i postavke za te elemente ostaće zaključani, a kartica "Svojstva" im nikada neće biti prikazana, čak i ako ih izaberete.
Funkciju zaključavanja kontejnera možete da koristite za zaključavanje kontejnera nakon što završite sa dodavanjem i konfigurisanjem njegovih komponenti dizajna.
Da biste zaključali kontejner, dodajte data-locked="hard" atribut u oznaku kontejnera, na sledećoj način:
<div data-container="true" data-locked="hard">
<!-- All elements and content here are locked, with no properties shown -->
</div>
Belešku
Možete zaključati sadržaj i na nivou elementa dizajna. Ako je sadržaj zaključan na nivou kontejnera, to podešavanje zamenjuje status zaključano/otključano svih elemenata dizajna unutar tog kontejnera. Više informacija:Zaključavanje elemenata u prikazu dizajnera
Da biste dodatno primenili zaključavanje kontejnera, možete ograničiti pristup HTML kartici , što će sprečiti izabrane korisnike da pristupe kodu (gde bi u suprotnom mogli da pobede ovu postavku). Više informacija:Kontrolišite pristup dizajnerskim funkcijama
Identifikovanje elemenata dizajna
Svaki put kada dodate element dizajna pomoću kartice "Dizajner ", uređivač umeće par <div> oznaka da bi označio početak i kraj elementa i kreira HTML koji je potreban za prikazivanje elementa kao što je navedeno u njegovim postavkama na kartici "Svojstva ".
Elementi dizajna su označeni <div> oznakama koje sadrže atribut obrasca data-editorblocktype="<element-type>", pri kome vrednost ovog atributa identifikuje tip elementa kakav jeste. Na primer, sledeća <div> oznaka kreira element teksta:
<div data-editorblocktype="Text">
...
<!-- Don't edit the element content here -->
...
</div>
Sledeća tabela navodi dostupne vrednosti za data-editorblocktype atribut.
| Naziv elementa dizajna | Tip elementa |
data-editorblocktype vrednost atributa |
|---|---|---|
| Element teksta | Zajednički element dizajna | Text |
| Element slike | Zajednički element dizajna | Image |
| Element razdelnika | Zajednički element dizajna | Razdelnik |
| Element dugmeta | Zajednički element dizajna | Dugme |
| Element bloka sadržaja | Zajednički element dizajna | Sadržaj (Ovaj tip elementa dizajna data-block-datatype="<block-type>" sadrži i atribut koji identifikuje koji tip bloka sadržaja se nalazi, <gde tip bloka> ima vrednost ili text image.) |
| Element marketinške stranice | E-pošta | Marketinška stranica |
| Element događaja | E-pošta | Događaj |
| Element ankete | E-pošta | Anketa |
| Element obrasca | Obrazac | FormBlock |
| Element polja | Sadržaj obrasca | Polje-polje-ime<>, na primer: Polje-e-pošta |
| Element liste pretplata | Sadržaj obrasca | SubscriptionListBlock |
| Element prosleđivanja prijatelju | Sadržaj obrasca | ForwardToFriendBlock |
| Element za odbijanje e-poruke i element polja „Zapamti me“ | Sadržaj obrasca | Polje polja za potvrdu (Ovi elementi kreiraju polja za potvrdu i inače se razlikuju po internim podešavanjima.) |
| Element dugmeta za prosleđivanje | Sadržaj obrasca | SubmitButtonBlock |
| Element dugmeta za poništavanje | Sadržaj obrasca | ResetButtonBlock |
| Element Captcha testa | Sadržaj obrasca | CaptchaBlock |
Više informacija o svakom od ovih elemenata dizajna potražite u članku Referenca elemenata dizajna.
Važno
Kada radite na HTML kartici , trebalo bi da izbegavate <div> uređivanje bilo kog sadržaja između oznaka elemenata dizajna jer rezultati toga mogu biti nepredvidivi, a dizajner će ga svakako zameniti. Umesto toga, koristite karticu "Dizajner" da biste upravljali sadržajem i svojstvima elementa dizajna.
Zaključavanje elemenata u prikazu Dizajner
Možete da zaključate sadržaj i svojstva bilo kog elementa dizajna tako što ćete mu dodati sledeću oznaku za otvaranje <div> :
data-protected="true"
Na primer:
<div data-editorblocktype="Divider" data-protected="true">
…
<!-- Don't edit the element content here -->
…
</div>
Kada je element dizajna označen kao zaštićen, korisnici koji rade na kartici "Dizajner " za stranicu ili e-poštu neće moći da uređuju svojstva ili sadržaj elementa. Ovaj atribut je uvek uključen za element bloka sadržaja, ali u njega možete dodati bilo koju vrstu elementa dizajna da biste ga zaštitili. Svaki element dizajna koji sadrži ovaj atribut prikazan je kao osenčen na HTML kartici da bi označio da je zaštićen, ali ga i dalje možete tamo uređivati ako insistirate. Podesite vrednost ovog atributa na „false“ (ili ga prosto uklonite) kako biste uklonili zaštitu sa elementa dizajna.
Belešku
Možete da zaključate sadržaj i na nivou kontejnera, što će da zameni status zaključano/otključano svih elemenata dizajna unutar tog kontejnera. Više informacija:Zaključajte kontejner u prikazu dizajnera
Da biste dodatno primenili zaključavanje sadržaja, možete da ograničite pristup HTML kartici , što će sprečiti izabrane korisnike da pristupe kodu (gde bi u suprotnom mogli da pobede ovu postavku). Više informacija:Kontrolišite pristup dizajnerskim funkcijama
Uvoz spoljno kreiranog HTML-a u dizajner
Možete koristiti bilo koju alatku koju želite da kreirate početni HTML izgled i sadržaj za marketinšku e-poštu, stranicu ili obrazac. Kada je HTML spreman, samo ga nalepite u relevantnog dizajnera, a zatim Dynamics 365 Customer Insights - Journeys dodajte sve funkcije koje su vam potrebne kao što je opisano u sledećim podsekcijama.
Uvoz HTML koda
Da biste uneli HTML kreiran eksterno u dizajner, počnite sa sledećim:
- Kreirajte novu marketinška e-poruka, stranicu ili obrazac Dynamics 365 Customer Insights - Journeys.
- Idite na HTML>karticu dizajna dizajnera.
- Obrišite sav sadržaj sa kartice HTML i nalepite u HTML koji ste kreirali eksterno.
- Idite na karticu >Dizajner dizajna dizajnera i proverite dizajn.
- Ako radite sa marketinška e-poruka, obavezno koristite uređivanje pomoći za postavljenje svih potrebnih sadržaja i veza(uključujući vezu centra za pretplatu i adresu fizičkog pošiljaoca).
Napojnica
Pošto ste upravo nalepljeni u spoljni HTML, dizajn verovatno ne sadrži kôd koji je specifičan Dynamics 365 Customer Insights - Journeys za njega, tako da dizajner prikazuje uređivač cele stranice koji obezbeđuje funkcije za osnovno oblikovanje teksta, oblikovanje slike i (za e-poruke)pomoć pri uređivanju za dodavanje dinamičkog sadržaja. Više informacija o radu sa uređivačem cele stranice potražite u članku Prikaži okvir sa alatkama i omogućite uređivanje prevlačenja i otpuštanja. Ako urednik preko cele stranice nudi sve potrebne funkcije, upotrebite ga za fino podešavanje dizajna, a zatim ga nastavite koristiti kao i obično. Ako želite da koristite uređivač prevlačenja i otpuštanja da biste precizno podesili dizajn, pogledajte sledeći odeljak za informacije o tome kako da ga omogućite.
Omogućite uređivač sa prevlačenjem i otpuštanjem nakon uvoza
Ako želite da omogućite uređivač prevlačenja i otpuštanja sa punim funkcijama i/ili da dodate napredne elemente dizajna dok radite u prikazu dizajnera , to možete lako da uradite tako što ćete na sledeći način urediti uvezeni HTML kôd:
Vratite se na HTML karticu> dizajna dizajnera.
Omogućite uređivač prevlačenja i otpuštanja dodavanjem potrebne meta oznake glave dokumenta kao što je opisano u okviru sa alatkama i omogućite uređivanje prevlačenja i otpuštanja.
Uradite sledeće po potrebi dok radite na HTML kartici >Dizajn :
- Pri svakom delu dizajna u koji želite da prevučete jedan ili više elemenata dizajna, dodajte kôd da biste kreirali kontejner sa podacima kao što je opisano u fascikli "Kreiranje kontejnera" u koji korisnici mogu da dodaju elemente dizajna.
- Ako više volite da pozicionirate elemente dizajna direktno u kôd bez korišćenja prevlačenja i otpuštanja, možete uneti zahtevani kôd direktno na HTML karticu Dizajn> . Elementi koje dodate na ovaj način neće podržati prevlačenje i otpuštanje, ali će obezbediti podešavanja na tabli "Svojstva " na kartici Dizajner>dizajna . Pomoću ove tehnike možete da postavite samo elemente teksta, slike, razdelnika i dugmadi (kreirajte kontejnere i koristite prevlačenje i otpuštanje za druge tipove elemenata dizajna). Pogledajte tabelu nakon ove procedure za HTML strukture potrebne za kreiranje svakog od ovih elemenata; kopirajte/nalepite ovaj kod direktno iz tabele po potrebi.
Sada možete da odete na karticu Dizajner dizajna i prevučete elemente dizajna u svaki kontejner koji podesite,>a zatim da koristite tablu "Svojstva " da biste konfigurisali svaki element dizajna koji ste prevukli ili nalepiti direktno u kôd.
| Tip elementa dizajna | Nalepite ovaj kôd | Napomene |
|---|---|---|
| Text | <div data-editorblocktype="Text"><p> Enter your text here</p></div> |
Možete da unesete HTML sadržaj između oznaka <p> direktno ovde ili da odete do dizajnera da biste koristili uređivač obogaćenog teksta da biste to uradili. |
| Image | <div data-editorblocktype="Image"><div align="Center" class="imageWrapper"><a href="example.com" title="example.com"><img alt="Some alt text" height="50" src="about:blank" width="50"></a></div></div> |
Najlakši način da promenite izvor slike i/ili vezu slike je da idete na Dizajner i koristite tablu Svojstva. Ali možete i da uredite sledeće atribute direktno u HTML-u:
|
| Divider | <div data-editorblocktype="Divider"><div align="center" class="dividerWrapper"><table aria-role="presentation" style="padding: 0px; margin: 0px; width: 100%"><tbody><tr style="padding: 0px;"> <td style="margin:0px; padding-left: 0px; padding-right: 0px; padding-top: 5px; padding-bottom: 5px; vertical-align:top;"> <p style="margin: 0px; padding: 0px; border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: rgb(0, 0, 0); line-height: 0px; width: 100%;"><span> </span></p></td></tr></tbody></table></div></div> |
Nemojte uređivati bilo koji od ovih kodova direktno u HTML uređivaču. Umesto toga, uradite dizajner i koristite tablu " Svojstva ". |
| Button | <div data-editorblocktype="Button"><!--[if mso]><div align="center"><v:rect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" |
Nemojte uređivati bilo koji od ovih kodova direktno u HTML uređivaču. Umesto toga, uradite dizajner i koristite tablu " Svojstva ". |
Više informacija o tome kako se elementi dizajna pojavljuju u kodu potražite u članku Identifikovanje elemenata dizajna.
Dodavanje novih fontova u traku sa alatkama za elemente teksta
Elementi teksta obezbeđuju iskačuću traku sa alatkama za formatiranje u dizajneru, što obuhvata meni za primenu fonta na izabrani tekst.
Da biste ovom biraču fonta dodali nove fontove <meta> , dodajte oznaku koja koristi sledeći obrazac <head> u dokument:
<meta type="xrm/designer/setting" name="additional-fonts" datatype="font" value="<font-list>">
Gde <je lista fontova> lista razdvojenih tačkom i zarezom imena fontova.
Dodajte podešavanja na karticu „Stilovi“
Jedna od zgodnih funkcija predložaka za izlazak iz okvira je da oni obezbeđuju opšte postavke stila na kartici "Stilovi ", što korisnicima omogućava da brzo prilagode porodicu fontova, paletu boja i druge Opšta podešavanja omogućene za predložak. Svaki predložak sadrži isključivo ona podešavanja stila koja su smislena za taj određeni dizajn, a vi tako možete da dizajnirate predloške koji pružaju prava podešavanja stila za vas i vaše korisnike.
Da biste dodali postavku na karticu "Stilovi ", morate da uradite sledeće:
- Dodajte
<meta>oznaku dokumentu<head>da biste kreirali postavku. - Podesite stilove i/ili HTML oznake koje primenjuju podešavanja koja kreira metaoznaka.
U sledećim pododeljcima objašnjeno je kako se to radi.
Dodajte metaoznaku da biste kreirali podešavanje
Potrebna oznaka <meta> uzima sledeći obrazac:
<meta type="xrm/designer/setting" name="<name>" value="<initial-value>" datatype="<data-type>" label="<label>">
Gde:
- <ime> identifikuje meta oznaku na koju morate da upućujete i u stilovima i HTML oznakama na koje će postavka biti primenjena.
- <početna vrednost> je odgovarajuća podrazumevana vrednost za stil.
- <tip podataka> identifikuje tip vrednosti koji će korisnici obezbediti. Ova postavka utiče na tip kontrole koji je predstavljen na kartici " Stilovi ". Morate da koristite jednu od vrednosti navedenih u sledećoj tabeli.
- <oznaka> navodi tekst koji će biti prikazan na kartici " Stilovi " za postavku.
| Vrednost tip podataka | Opis |
|---|---|
| color | Podešava boje pomoću vrednosti heš oznake poput #000 ili #1a32bf. Kreira kontrolu izbora boja na kartici " Stilovi ". |
| font | Podešava ime porodice fontova. Možete i da podesite naslagane fontove koristeći listu polja razdvojenih zarezima ili imena fontova poređanih željenim redosledom. Kreira jednostavno polje za unos na kartici " Stilovi ". |
| number | Postavlja numeričku vrednost bez jedinice (koristite tekst da biste dozvolili da jedinice kao što su px ili em budu navedene zajedno sa vrednošću). Kreira ulazno polje sa dugmadima na gore/nadole koje se takođe može koristiti za uvećavanje/smanjenje trenutne vrednosti na kartici "Stilovi ". |
| picture | Podešava izvor slike (kao što je URL adresa). Kreira jednostavno polje za unos na kartici " Stilovi ". |
| text | Podešava vrednost koja može da sadrži i tekst i brojeve. Ovaj tip podataka koristite i za numeričke vrednosti koje mogu da sadrže jedinicu (kao što su px ili em). Kreira jednostavno polje za unos na kartici " Stilovi ". |
Belešku
Oznaka prikazana na kartici "Stilovi " može se pojaviti u kvadratnim zagradama, kao što je "[Moj stil]". Uglaste zagrade označavaju da tekst koji se prikazuje nema dostupan prevod. Ako odaberete vrednost koju podržava bilo koji unapred definisani predložak (kao što je „Boja 1“), onda će prevod biti dostupan, pa se uglaste zagrade neće prikazivati.
Belešku
Postavka stila uspostavljena pomoću <meta> oznake, kao što je ovde opisano, prikazana je samo na kartici "Stilovi " kada se na tu postavku upućuje i najmanje jedan stvarni stil ili HTML oznaka, kao što je opisano u sledećim odeljcima.
Dodajte CSS komentare da biste primenili podešavanja stila u zaglavlju
Postavke napravljene na kartici "Stilovi" mogu se primeniti na stilove utvrđene CSS HTML dokumentom <head> CSS CSS tako što ćete okružiti name vrednost sa dva komentara koja sadrže vrednost atributa za odgovarajuću xrm/designer/setting meta oznaku. Par CSS komentara ima sledeći oblik:
/* @<tag-name> */ <value> /* @<tag-name> */
Gde:
- <tag-ime> je atribut imena za xrm/designer/setting meta oznaku koja uspostavlja relevantnu postavku kartice "Stilovi ".
- <vrednost> je vrednost koja će biti zamenjena kada korisnik uredi relevantnu postavku kartice "Stilovi ".
Važno
Ove parove komentara možete da koristite samo CSS u stilovima i klasama definisanim unutar oznaka <style> u odeljku <head> . Pored toga, mora da postoji samo jedan skup oznaka <style> , sa svim CSS stilovima postavljenim tamo.
Evo primera gde na kartici "Stilovi xrm/designer/setting " možete da vidite meta oznaku koja kreira kontrolu izbora boja pod nazivom "Boja 1". Stil CSS zatim primenjuje ovu postavku da bi se uspostavila boja teksta za <h1> elemente.
<head>
<meta type="xrm/designer/setting" name="color1" value="#ff0000" datatype="color" label="Color 1">
<style>
h1 {color: /* @color1 */ #ff0000 /* @color1 */;}
</style>
</head>
Dodajte atribute reference svojstva da biste primenili podešavanja stila u telu
Postavke napravljene na kartici "Stilovi " mogu se primeniti kao vrednosti atributa na bilo koju HTML oznaku <body> u dokumentu dodavanjem atributa sledećeg obrasca svakoj relevantnoj oznaki:
property-reference= "<attr>:@< tag-name >;<attr>:@< tag-name >; …"
Gde:
- <attr> je ime atributa koji treba kreirati.
-
<ime oznake je> vrednost atributa meta
nameoznake koja je uspostavila postavku. - Više atributa, ako su potrebni, mora da se razdvoji tačkom i zarezom u okviru jednog atributa reference svojstva.
Evo primera gde na xrm/designer/setting kartici " Stilovi" možete da vidite meta oznake koje kreiraju dve postavke za kontrolu slike heroja (reklamnog natpisa). Svojstvo property-reference se zatim koristi u oznaci <img> za primenu tih postavki.
<head>
<meta type="xrm/designer/setting" name="hero-image" value="picture.jpg" datatype="picture" label="Hero image">
<meta type="xrm/designer/setting" name="hero-image-height" value="100px" datatype="text" label="Hero image height">
</head>
<body>
<img property-reference="src:@hero-image;height:@hero-image-height;">
</body>
Dakle, u ovom primeru, oznaka bi <img> se rešila na nešto poput:
<img src="picture.jpg" height="100px">