Partekatu honen bidez:

Diseinatzaileentzako eginbideak gaitzeko mezu elektronikoetan, orrietan eta inprimakietan, erabili atributu pertsonalizatuak

  • Artikulua

Editore grafiko bat eta HTML kode-editore bat ematen dituzte eduki-diseinatzaileek. Halaber, diseinatzaileek sortzen dituzten HTMLa bateragarria da edozein HTML errendatzailerekin eta editore grafikoak hornitzen dituen "arrastatu eta jaregin" motako diseinu-elementuak eta estilo orokorraren ezarpenak onartzen dituzten zenbait atributu pertsonalizaturekin. Dynamics 365 Customer Insights - Journeys rekin hornitutako mezu-txantiloi lehenetsiek eta orri-txantiloiek atributu pertsonalizatu hauek erabiltzen dituzte, modu zehatzetan pertsonalizatzea errazteko. Gainera, atributu pertsonalizatu horiek erabil ditzakezu zeure txantiloiak diseinatzen dituzunean.

Eskupekoa

Microsoft-ek ez du HTML pertsonalizaturako laguntzarik ematen mezu elektronikoetan.

Etiketen eta atributuen laburpena

Gai honetan azaltzen diren metaetiketei eta atributu pertsonalizatuei buruzko erreferentzia bizkor bat ematen du honako taula honek.

Atributu pertsonalizatua Azalpena
<meta type="xrm/designer/setting" name="type" value="marketing-designer-content-editor-document"> Etiketa hau zure dokumentuaren <head> denean, Diseinatzailea fitxak arrastatu eta jaregin funtzioak eskainiko ditu. Etiketa hau ez badago, Diseinatzailea fitxak orrialde osoko editore sinplifikatua eskaintzen du. Informazio gehiago: Erakutsi tresna-kutxa eta gaitu arrastatu eta jaregin edizioa
<meta type="xrm/designer/setting" name="additional-fonts" datatype="font" value="<font-list>"> Etiketa hau zure dokumentuaren <head> denean, <letra-tipo-zerrendan> (puntu eta koma bereizita) zerrendatutako letra-tipoak gehituko dira. letra-tipoen menua testu-elementuen formatu tresna-barran. Informazio gehiago: Gehitu letra-tipo berriak testu-elementuen tresna-barran
<div data-container="true"> … </div> Erabiltzaileek diseinu-elementuak arrasta eta jaregiteko erabil ditzaketen edukitzaile baten hasiera eta amaiera markatzen ditu. Informazio gehiago: Sortu edukiontzi bat non erabiltzaileek diseinu-elementuak gehi ditzaten
<div data-editorblocktype="<element-type>"> … </div> Diseinu-elementu baten hasiera eta amaiera zehazten ditu. Atributuaren balioak zer elementu mota den identifikatzen du (besteak beste, testua, irudia edo botoia). Zenbait diseinu-elementuk onartzen dituzte atributu gehigarri hauek. Informazio gehiago: Identifikatu diseinu-elementuak eta Blokeatu elementuak Diseinatzailearen ikuspegian
<meta type="xrm/designer/setting" name="<name>" value="<initial-value>" datatype="<data-type>" label="<label>"> Etiketa honek dokumentu osoko estilo-ezarpen bat zehazten du, erabiltzaileek Diseinatzailea>Estiloak fitxa erabiliz edita dezaketena. Informazio gehiago: Gehitu ezarpenak Estiloak fitxan
/* @<tag-name> */ … /* @<tag-name> */ Erabili CSS hauetako iruzkinak estilo-ezarpen baten bidez kontrolatu beharreko CSS balioa inguratzeko, non <tag-name> den. ezarpena ezarri zuen meta-etiketaren name atributuaren balioa. Informazio gehiago: Gehitu CSS iruzkinak estilo-ezarpenak buruan ezartzeko
property-reference= "<attr>:@< tag-name >;<attr>:@< tag-name >; …" Jarri atributu hau edozein HTML etiketatan estilo-ezarpen batek kontrolatutako balioa duen atributu bat jartzeko, non <attr> sortu beharreko atributuaren izena den eta <tag-name> ezarpena ezarri zuen meta-etiketaren name atributuaren balioa da. Informazio gehiago: Gehitu propietate-erreferentzia-atributuak estilo-ezarpenak gorputzean ezartzeko

Taulan laburbiltzen diren eginbide bakoitzaren erabilerari buruzko informazio gehiago aurkituko duzu gai honetako gainerako sekzioetan.

Erakutsi tresnak eta gaitu "arrastatu eta jaregin" eragiketaren edizioa

Hirugarrenen edozein tresnatan garatutako HTML zuzenean itsats dezakezu diseinatzailearen HTML fitxan diseinu bat oso azkar eraikitzen hasteko. Hala ere, hori egiten duzunean, Diseinatzailea fitxa testu aberastuko editore bakar gisa bistaratuko da, testu-formatua tresna-barra eskaintzen duena eta irudi, esteka eta estilo guztiak erakusten ditu. zure HTMLan sartuta, baina ez du bestela Tresna-kutxa, Propietateak edo Estiloak fitxak edo arrastatu eta jaregin edozein funtzionalitate ( Designer ikuspegi sinplifikatu honi deitzen zaio batzuetan. orrialde osoko editorea). Hala ere, itsatsitako edozein diseinurako arrastatu eta jaregin funtzioa gai dezakezu, zure dokumentuko <head> atalari meta-etiketa hau gehituta:

<meta type="xrm/designer/setting" name="type" value="marketing-designer-content-editor-document">

Honako irudi honek diseinu bera erakusten du orri osoko editatze moduan (ezkerrera) eta arrastatzeko eta jaregiteko moduan (eskuinera). Bi aukeren arteko desberdintasun bakarra eskuineko diseinuak duen metaetiketa da; horrek esan nahi du "arrastatu eta jaregin" eginbidea gaituta dagoela eta alboko panela erakusten dela.

Orrialde osoko editorea eta arrastatu eta jaregin editorea.

Oharra

Orri osoko editorea erabiltzen duzunean, testua hauta, edita eta diseina dezakezu testu-formatuaren tresna-barra erabiliz (tresna-barra erakusten da); halaber, klik bikoitza egin dezakezu irudi, esteka eta antzeko elementuetan beren propietateak ezartzeko elkarrizketa gainerakor bat erabiliz. Tresna-barrak eduki dinamikoa gehitzeko Laguntza editatzeko botoia botoia ere badakar, hala nola hartzaile bakoitzaren kontaktu-erregistrotik ateratako eremu-balioak. Pertsonalizazio botoia.

Sortu erabiltzaileek diseinu-elementuak gehitzeko erabil dezaketen edukitzaile bat

Diseinatzailea fitxan, erabiltzaileek diseinu-elementu baten edukia soilik edita dezakete, eta diseinu-elementu berriak gisa konfiguratuta dauden dokumentuaren zatietara soilik arrastatu ditzakete. datuen edukiontziak. Hori dela eta, txantiloiak sor ditzakezu, non eremu batzuk (edukiontzietatik kanpo) editatzeko blokeatuta dauden Diseinua fitxan, eta beste areek (desblokeatutako edukiontzien barruan) aldaketak onartuko dituzten eta arrastatuko dituzten bitartean. edukia.

Erabili <div> atributua duten data-container="true" etiketak datu-ontziak sortzeko, hala nola:

<table aria-role="presentation">
    <tbody><tr>
        <td>
            LOCKED
        </td>
        <td>
            <div data-container="true">
                <!-- DRAG HERE -->
            </div>
        </td>
    </tr>
</tbody></table>

datu-edukiontzi div-etiketa bikote baten barruan habiaratuta dauden testu edo HTML etiketa orok, eta diseinu-elementu baten parte ez diren, arrastatu ezin den, ez den bat sortuko du. -editable, arrastatu daitezkeen bi eremuen arteko eremua. Adibidez:

<div data-container="true">
    <!-- DRAG HERE --> <p> LOCKED </p> <!-- DRAG HERE -->
</div>

Oharra

Orrialde osoko editorea gaituta dagoenean, arrastatu eta jaregin eginbide guztiak desgaituta daude, eta Diseinatzailea fitxako eduki guztia edita dezakezu, baita data-container div etiketak (orri osoko editorean eraginik ez dutenak) kanpoko edukia ere.

Blokeatu Diseinatzailea ikuspegiko edukitzaile bat

edukiontzi bat blokea dezakezu bere eduki guztia irakurtzeko soilik izan dadin, Diseinatzailea fitxan. Blokeatutako edukiontzi batek diseinu-elementuak baditu, elementu horien eduki eta ezarpen guztiak blokeatuta geratuko dira eta Propietateak fitxa ez da inoiz erakutsiko haientzat, nahiz eta hautatu.

Edukitzailearen diseinu-osagaiak gehitzen eta konfiguratzen amaitu ostean, erabili edukitzailea blokeatzeko eginbidea, hura blokeatzeko.

Edukiontzi bat blokeatzeko, gehitu data-locked="hard" atributua edukiontzi-etiketan, honela:

<div data-container="true" data-locked="hard">
    <!-- All elements and content here are locked, with no properties shown -->
</div>

Oharra

Diseinu-elementuetako edukia ere blokea dezakezu. Edukitzaileko edukia blokeatuz gero, bertako diseinu-elementu guztien egoera (blokeatuta/desblokeatuta) gainidatziko du ezarpen horrek. Informazio gehiago: Blokeatu elementuak Diseinatzailearen ikuspegian

Edukiontzien blokeoa gehiago indartzeko, HTML fitxarako sarbidea mugatu dezakezu, aukeratutako erabiltzaileek kodea atzitzea eragotziko baitute (bestela ezarpen hau gainditzekotan). Informazio gehiago: Kontrolatu diseinatzaileen eginbideetarako sarbidea

Identifikatu diseinu-elementuak

Diseinu-elementu bat gehitzen duzun bakoitzean Diseinatzailea fitxa erabiliz, editoreak <div> etiketa pare bat sartzen ditu elementuaren hasiera eta amaiera markatzeko. eta elementua Propietateak etxeko ezarpenetan zehaztutako moduan bistaratzeko beharrezkoa den HTMLa sortzen du.

Diseinu-elementuak <div> etiketekin markatzen dira data-editorblocktype="<element-type>" formako atributu bat barne, non atributu honen balioak zein den elementu mota identifikatzen duen. Adibidez, hurrengo <div> etiketak testu-elementu bat sortzen du:

<div data-editorblocktype="Text">
    ...
    <!-- Don't edit the element content here -->
    ...
</div>

Ondorengo taulak data-editorblocktype atributuaren balio erabilgarriak zerrendatzen ditu.

Diseinu-elementuaren izena Elementu mota data-editorblocktype atributuaren balioa
Testu-elementua Diseinu arrunteko elementua Text
Irudi-elementua Diseinu arrunteko elementua Image
Zatitzailearen elementua Diseinu arrunteko elementua Zatitzailea
Botoi-elementua Diseinu arrunteko elementua Botoia
Eduki-blokearen elementua Diseinu arrunteko elementua Edukia
(Diseinu-elementu mota honek data-block-datatype="<block-type>" atributu bat ere barne hartzen du, zein eduki-bloke mota den identifikatzen duena, non <bloke-mota> ko balioa duen. bai text edo image.)
Marketin-orriaren elementua Mezu elektronikoa Marketin-orria
Gertaera-elementua Mezu elektronikoa Event
Inkestaren elementua Mezu elektronikoa Survey
Inprimaki-elementua Inprimakia FormBlock
Eremu-elementua Inprimakiaren edukia Eremua-<eremu-izena>, adibidez: Eremu-posta elektronikoa
Harpidetza-zerrendako elementua Inprimakiaren edukia SubscriptionListBlock
Lagun bati birbidaltzeko elementua Inprimakiaren edukia ForwardToFriendBlock
"Ez bidali posta elektronikoz" eta "Gogora nazazu" elementuak Inprimakiaren edukia Eremuaren kontrol-laukia
(Elementu bakoitzak kontrol-laukiak sortzen ditu eta barneko ezarpenen arabera bereizten dira).
"Bidali" botoiaren elementua Inprimakiaren edukia SubmitButtonBlock
"Berrezarri" botoiaren elementua Inprimakiaren edukia ResetButtonBlock
Captcha elementua Inprimakiaren edukia CaptchaBlock

Diseinu-elementu hauetako bakoitzari buruzko informazio gehiago lortzeko, ikus Diseinu-elementuen erreferentzia.

Garrantzitsua da

HTML fitxan lanean ari zarenean, zure diseinu-elementuen <div> etiketetako edukia editatzea saihestu beharko zenuke, egitearen emaitzak direla eta. beraz, ezustekoa izan daiteke, eta baliteke zure aldaketak diseinatzaileak gainidatziko dituela hala ere. Horren ordez, erabili Diseinatzailea fitxa zure diseinu-elementuen edukia eta propietateak kudeatzeko.

Blokeatu Diseinatzailea ikuspegiko elementuak

Diseinuko edozein elementuren edukia eta propietateak blokea ditzakezu bere hasierako <div> etiketan atributu hau gehituta:

data-protected="true"

Adibidez:

<div data-editorblocktype="Divider" data-protected="true">
    …
        <!-- Don't edit the element content here -->
    …
</div>

Diseinu-elementu bat babestuta gisa markatuta dagoenean, orrialde edo mezu elektroniko baten Diseinatzailea fitxan lan egiten duten erabiltzaileek ezingo dituzte elementuaren propietateak edo edukia editatu. Eduki-blokearen elementuak beti barne hartzen du atributu hau; halere, edozein diseinu-elementu motatan gehi dezakezu, hura babesteko. Atributu hau barne hartzen duen edozein diseinu-elementu HTML fitxan itzal gisa erakusten da babestuta dagoela adierazteko, baina hala ere bertan edita dezakezu tematzen bazara. Diseinu-elementu baten babesa kentzeko, ezarri atributu hau "false" gisa (edo ezaba ezazu).

Oharra

Halaber, edukitzaileko edukia blokea dezakezu, bertako diseinu-elementu guztien egoera (blokeatuta/desblokeatuta) gainidazteko. Informazio gehiago: Blokeatu edukiontzi bat Designer ikuspegian

Edukiaren blokeoa gehiago indartzeko, HTML fitxarako sarbidea muga dezakezu, aukeratutako erabiltzaileek kodea atzitzea eragotziko baitute (bestela ezarpen hau garaitu dezaketen). Informazio gehiago: Kontrolatu diseinatzaileen eginbideetarako sarbidea

Inportatu kanpotik sortutako HTML diseinatzailea

Edozein tresna erabil dezakezu hasierako HTML diseinua eta edukia sortzeko marketin-mezu elektroniko, orri edo inprimaki batean. Zure HTML prest dagoenean, itsatsi dagokion diseinatzailean eta gehitu behar dituzun Dynamics 365 Customer Insights - Journeys eginbide guztiak hurrengo azpiataletan azaltzen den moduan.

Inportatu HTML kodea

Diseinatzailean kanpotik sortutako HTMLa gehitzeko, egin honako hauek:

  1. Sortu marketin-mezu elektroniko, orri edo formulario berri bat Dynamics 365 Customer Insights - Journeys-n.
  2. Joan diseinatzailearen Diseinua>HTML fitxara.
  3. Garbitu eduki guztia HTML fitxatik eta itsatsi kanpoan sortu duzun HTMLa.
  4. Joan diseinatzailearen Diseinua>Diseinatzailea fitxara eta ikuskatu zure diseinua.
  5. marketin-mezu elektroniko batekin lanean ari bazara, ziurtatu laguntzako edizioa erabiltzea beharrezko eduki eta esteka guztiak jartzeko (harpidetza-zentroaren esteka eta zure igorle-helbide fisikoa barne).

Eskupekoa

Kanpoko HTMLan itsatsi berri duzunez, zure diseinuak ziurrenik ez du -ren berariazko koderik barne; beraz, Dynamics 365 Customer Insights - JourneysDiseinatzailea erakusten du orri osoko editorea , oinarrizko testu-formateatzeko, irudien formateatzeko eta (mezu elektronikoetarako)editatzeko laguntza funtzioak eskaintzen dituena. eduki dinamikoa gehitzeko. Orrialde osoko editorearekin lan egiteari buruzko informazio gehiago lortzeko, ikus Erakutsi tresna-koadroa eta gaitu arrastatu eta jaregin edizioa. Orrialde osoko editoreak behar dituzun funtzionalitate guztiak eskaintzen badituzu, erabili zure diseinua doitzeko eta, ondoren, joateko ohitura bezala. Nahiago baduzu arrastatu eta jaregin editorea erabiltzea zure diseinua doitzeko, ikusi hurrengo atala gaitzeko moduari buruzko informaziorako.

Gaitu editorearen arrastatu eta jaregin aukera inportazioa egin ondoren

Diseinatzailea ikuspegian lan egiten duzun bitartean arrastatu eta jaregin editorea gaitu eta/edo diseinu-elementu aurreratuak gehitu nahi badituzu, erraz egin dezakezu. gehiago editatu inportatutako HTML kodea honela:

  1. Itzuli diseinatzailearen Diseinua>HTML fitxara.

  2. Gaitu arrastatu eta jaregin editorea zure dokumentuko atalean deskribatutako Erakutsi tresna-kutxa eta gaitu behar den meta-etiketa gehituta. arrastatu eta jaregin edizioa.

  3. Egin behar den moduan Diseinua>HTML fitxan lanean ari zaren bitartean:

    • Diseinu-elementu bat edo gehiago arrastatu ahal izan nahi dituzun diseinuaren zati bakoitzean, gehitu kodea datu-edukiontzi bat sortzeko Sortu edukiontzi bat non erabiltzaileek diseinu-elementuak gehi ditzaten atalean deskribatzen den moduan.
    • Nahiago baduzu diseinu-elementuak zuzenean zure kodean kokatzea arrastatu eta jaregin gabe, beharrezko kodea zuzenean sar dezakezu Diseinua>HTML fitxa. Modu honetan gehitzen dituzun elementuek ez dute arrastatu eta jaregin onartzen, baina ezarpenak emango dituzte Propietateak panelean Diseinua>Diseinatzailea fitxa. Teknika hau erabiliz testua, irudia, zatitzailea eta botoia elementuak soilik jar ditzakezu (sortu edukiontziak eta erabili arrastatu eta jaregin beste diseinu-elementu mota batzuetarako). Ikusi taula prozedura honen ondoren elementu bakoitza sortzeko beharrezkoak diren HTML egiturak lortzeko; kopiatu/itsatsi kode hau zuzenean taulatik.

  4. Orain joan zaitezke Diseinatzailea>Diseinatzailea fitxara eta arrastatu diseinu-elementuak konfiguratu dituzun edukiontzietara eta, ondoren, erabili Propietateak panela arrastatu edo zuzenean itsatsi duzun diseinu-elementu bakoitza konfiguratzeko.

Diseinuko elementu mota Itsatsi kode hau Oharrak                                                     
Text <div data-editorblocktype="Text"><p> Enter your text here</p></div> HTML edukia <p> etiketen artean sar dezakezu zuzenean hemen, edo joan Diseinatzailea ra, testu aberatseko editorea erabiltzeko.
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> Irudien iturria edo irudiaren esteka aldatzeko modurik errazena hau da: joan Diseinatzailea aukerara eta erabili Propietateak panela. Halaber honako atributu hauek zuzenean edita ditzakezu HTMLn:
  • Ezarri irudiaren esteka edo izenburua href eta izenburuaren atributuak editatuz <a> elementuan.
  • Esteka iruditik kentzeko, garbitu href eta title elementuaren <a> atributuen edukia (baina mantendu atributuak eta komatxoak, hala nola href="").
  • Ezarri irudiaren iturburua <img> elementuaren src atributua editatuz.
Ez editatu beste kodea.
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>&nbsp;</span></p></td></tr></tbody></table></div></div> Ez editatu kode hau zuzenean HTML editorean. Horren ordez, joan Diseinatzailea eta erabili Propietateak panela.
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" Ez editatu kode hau zuzenean HTML editorean. Horren ordez, joan Diseinatzailea eta erabili Propietateak panela.

Diseinu-elementuak kodean agertzeko moduari buruzko informazio gehiago lortzeko, ikus Identifikatu diseinu-elementuak.

Gehitu beste letra-tipo batzuk testu-elementuen tresna-barran

Testu-elementuek formatua emateko tresna-barra gainerakorra agerrarazten dute diseinatzailean, hautatutako testuari letra-tipo bat aplikatzeko menua ere baduena.

Testu-elementuen letra-hautatzailea.

Letra-tipo-hautatzaile honi letra-tipo berriak gehitzeko, gehitu forma hau erabiltzen duen <meta> etiketa bat dokumentuaren <head> :

<meta type="xrm/designer/setting" name="additional-fonts" datatype="font" value="<font-list>">

Non <font-list> letra-tipoen izenen zerrenda puntu eta komaz bereizita dagoena da.

Gehitu ezarpenak Estiloak fitxan

Kutxaz kanpoko txantiloien ezaugarri erabilgarri bat Estiloak fitxan estilo-ezarpen globalak ematen dituztela da, erabiltzaileei letra-tipoen familia, kolore-paleta eta azkar doitzeko. txantiloirako beste ezarpen orokorrak gaituta. Txantiloi bakoitzak diseinu zehatz bati dagozkion estilo-ezarpenak soilik eskaintzen dituenez, zuri eta zure erabiltzaileei estilo-ezarpen egokiak emango dizkizueten txantiloiak diseina ditzakezu.

Diseinatzailea > Estiloak fitxa.

Estiloak fitxan ezarpen bat gehitzeko, hau egin behar duzu:

  • Ezarpena sortzeko, gehitu <meta> etiketa bat zure dokumentuko <head> .
  • Konfiguratu metaetiketak sortutako ezarpenei aplikatzen zaizkien estiloak eta HTML etiketak.

Beheko azpisekzioetan aurkituko duzu eragiketa horiek egiteko urratsak.

Ezarpena sortzeko, gehitu metaetiketa bat

Beharrezko <meta> etiketak forma hau hartzen du:

<meta type="xrm/designer/setting" name="<name>" value="<initial-value>" datatype="<data-type>" label="<label>">

Non:

  • <name> meta-etiketa identifikatzen du, eta ezarpena aplikatuko den estiloetan eta HTML etiketetan ere erreferentzia egin behar duzu.
  • <initial-value> estiloaren balio lehenetsi egokia da.
  • <data-type> erabiltzaileek emango duten balio mota identifikatzen du. Ezarpen honek Estiloak fitxan aurkezten den kontrol motari eragiten dio. Hurrengo taulan zerrendatutako balioetako bat erabili behar duzu.
  • <etiketak> ezarpenerako Estiloak fitxan erakutsiko den testua zehazten du.
Datu motaren balioa Azalpena
color Kolore bat ezartzen du hash motako etiketen balioak erabiliz; besteak beste, #000 edo #1a32bf. Kolore-hautatzaileen kontrola sortzen du Estiloak fitxan.
font Letra-tipoaren familiaren izena zehazten du. Halaber, letra-tipoaren pilak ezar ditzakezu; horretarako, erabili letra-tipoen izenen zerrenda bat komaz bereizita eta hobespenen arabera ordenatuta. Sarrera-eremu sinple bat sortzen du Estiloak fitxan.
number Unitaterik gabeko zenbakizko balio bat ezartzen du (erabili testua px edo em bezalako unitateak zehaztu ahal izateko. balioa). Estiloak fitxako uneko balioa handitzeko/gutxitzeko ere erabil daitekeen sarrera-eremu bat sortzen du gora/behera botoiekin.
picture Irudi-iturburu bat sortzen du (URL gisa). Sarrera-eremu sinple bat sortzen du Estiloak fitxan.
text Testua eta zenbakiak eduki ditzakeen balio bat ezartzen du. Erabili datu-mota hau unitate bat izan dezaketen zenbakizko balioetarako ere ( px edo em). Sarrera-eremu sinple bat sortzen du Estiloak fitxan.

Oharra

Estiloak fitxan agertzen den etiketa kortxete artean ager daiteke, adibidez, "[Nire estiloa]". Erakusten ari den testua azalpenik ez duela adierazten dute kortxeteek. Edozein txantiloi integratuk onartzen duen balio bat aukeratzen baduzu (adibidez, "Color 1"), itzulpena erabilgarri egongo da eta kortxeteak ez dira agertuko.

Oharra

Hemen deskribatzen den bezala <meta> etiketa erabiliz ezarritako estilo-ezarpena Estiloak fitxan bakarrik erakusten da ezarpen hori gutxienez batean aipatzen denean. benetako estiloa edo HTML etiketa, hurrengo ataletan azaltzen den moduan.

Estilo-ezarpenak inplementatzeko goiburuan, gehitu CSS iruzkinak

Estiloak fitxan egindako ezarpenak zure HTML dokumentuaren CSS estiloetan ezarritako <head> estiloetan aplika daitezke a CSS balioa, bat datorren CSS meta-etiketaren name atributuaren balioa duten bi xrm/designer/setting iruzkinekin. CSS iruzkin-pareak honako formatu hau du:

/* @<tag-name> */ <value> /* @<tag-name> */

Non:

  • tag-name> dagokion Estiloak estiloak ezartzen dituen xrm/designer/setting meta-etiketaren izen-atributua da. fitxaren ezarpena.
  • <balioa> erabiltzaile batek dagokion Estiloak fitxaren ezarpena editatzen duenean ordezkatuko den balio bat da.

Garrantzitsua da

CSS Iruzkin bikote hauek <style> ataleko <head> etiketetan definitutako estilo eta klaseetan soilik erabil ditzakezu. Gainera, <style> etiketa-multzo bakarra egon behar da, eta CSS estilo guztiak bertan ezarrita.

Hona hemen adibide bat, non xrm/designer/setting Estiloak fitxan "Color 1" izeneko kontrol-hautatzaile bat sortzen duen meta-etiketa bat ikus dezakezun. A CSS estiloak ezarpen hau aplikatzen du <h1> elementuen testuaren kolorea ezartzeko.

<head>
    <meta type="xrm/designer/setting" name="color1" value="#ff0000" datatype="color" label="Color 1">
    <style>
        h1 {color: /* @color1 */ #ff0000 /* @color1 */;}
    </style>
</head>

Estilo-ezarpenak inplementatzeko gorputzean, gehitu property-reference atributuak

Estiloak fitxan egindako ezarpenak zure dokumentuko <body> ko edozein HTML etiketari atributu-balio gisa aplika dakizkioke hurrengo inprimakiko atributu bat gehituz dagokion etiketa bakoitzari:

property-reference= "<attr>:@< tag-name >;<attr>:@< tag-name >; …"

Non:

  • <attr> sortu beharreko atributuaren izena da.
  • <tag-name> ezarpena ezarri zuen meta-etiketaren name atributuaren balioa da.
  • Hainbat atributu badituzu property-reference atributu bakar batean, puntu eta komaz bereizita egon behar dute.

Hona hemen adibide bat non ikus ditzakezun xrm/designer/setting meta-etiketak dokumentuan heroiaren irudia (bannera) kontrolatzeko bi ezarpen sortzen dituztenak, "Heroien irudia" eta "Heroien irudiaren altuera" izeneko kontrolekin Estiloak fitxa. Ondoren, property-reference propietatea <img> etiketa batean erabiltzen da ezarpen horiek ezartzeko.

<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>

Beraz, adibide honetan, <img> etiketa honelako zerbaitetan ebatziko litzateke:

<img src="picture.jpg" height="100px">