Электрондық хаттарда, беттерде және пішіндерде дизайнер мүмкіндіктерін қосу үшін теңшелетін төлсипаттарды пайдаланыңыз
Контент дизайнерлері графикалық редакторды да, HTML код редакторын да қамтамасыз етеді. Олар жасайтын HTML кез келген HTML рендерерімен үйлесімді, бірақ олар сондай-ақ графикалық редактор ұсынатын апарып тастау дизайн элементтерін және жалпы мәнер параметрлерін қолдайтын бірнеше теңшелетін атрибуттарды қолдайды. Dynamics 365 Customer Insights - Journeys берілген әдепкі хабар үлгілері мен бет үлгілері оларды арнайы жолдармен теңшеуді жеңілдету үшін осы теңшелетін төлсипаттарды пайдаланады. Сондай-ақ, осы теңшелетін төлсипаттарды өз үлгілеріңізді жасаған кезде пайдалануға болады.
Шайпұл
Microsoft электрондық пошталарда реттелетін HTML үшін қолдау көрсетпейді.
Тег пен атрибуттың қорытындысы
Келесі кесте осы тақырыпта сипатталған теңшелетін төлсипаттарға және мета тегтерге жылдам сілтеме береді.
| Реттелетін төлсипат | Сипаттама |
|---|---|
<meta type="xrm/designer/setting" name="type" value="marketing-designer-content-editor-document"> |
Бұл тег құжатыңыздың <head> бағдарламасында болған кезде, Дизайншы қойындысы апарып тастау мүмкіндіктерін береді. Бұл тег жоқ болса, Дизайншы қойындысы жеңілдетілген, толық бет өңдегішін қамтамасыз етеді. Қосымша ақпарат: Құралдар жинағын көрсетіңіз және сүйреп апарып өңдеуді қосыңыз |
<meta type="xrm/designer/setting" name="additional-fonts" datatype="font" value="<font-list>"> |
Бұл тег құжатыңыздың <head> үшінде болғанда, <қаріптер тізімінде> (нүктелі үтірмен бөлінген) тізімделген қаріптер мәтін элементтеріне арналған пішімдеу құралдар тақтасындағы қаріп мәзірі. Қосымша ақпарат: Мәтін элементінің құралдар тақтасына жаңа қаріптерді қосыңыз |
<div data-container="true"> … </div> |
Пайдаланушылар дизайн элементтерін сүйреп апара алатын контейнердің басы мен соңын белгілейді. Қосымша ақпарат: Пайдаланушылар дизайн элементтерін қоса алатын контейнер жасаңыз |
<div data-editorblocktype="<element-type>"> … </div> |
Дизайн элементінің басы мен соңын белгілейді. Төлсипаттың мәні оның қандай элемент типі екенін (мәтін, сурет, түйме және т.б.) анықтайды. Кейбір дизайн элементтері мұнда қосымша атрибуттарды қолдайды. Қосымша ақпарат: Дизайн элементтерін анықтау және Дизайншы көрінісінде элементтерді құлыптау |
<meta type="xrm/designer/setting" name="<name>" value="<initial-value>" datatype="<data-type>" label="<label>"> |
Бұл тег пайдаланушылар Дизайншы>Стильдер қойындысын пайдаланып өңдей алатын құжаттың жалпы мәнері параметрін анықтайды. Қосымша ақпарат: Стильдер қойындысына параметрлерді қосыңыз |
/* @<tag-name> */ … /* @<tag-name> */ |
Осыған ұқсас түсініктемелерді CSS мәнді мәнер параметрімен басқарылатын мәнді қоршау үшін пайдаланыңыз, мұнда CSS тег атауы < параметрді орнатқан мета тег үшін> name атрибутының мәні. Қосымша ақпарат: Баста стиль параметрлерін енгізу үшін CSS түсініктемелерді қосыңыз |
property-reference= "<attr>:@< tag-name >;<attr>:@< tag-name >; …" |
Бұл төлсипатты мәнер параметрімен басқарылатын мәні бар атрибутты орналастыру үшін кез келген HTML тегіне орналастырыңыз, мұнда <attr> құрылатын атрибуттың атауы және <тег аты> бұл параметрді орнатқан мета тег үшін name атрибутының мәні. Қосымша ақпарат: Денеде мәнер параметрлерін енгізу үшін сипатқа сілтеме атрибуттарын қосыңыз |
Осы тақырыптың қалған бөлімдері кестеде жинақталған мүмкіндіктердің әрқайсысын пайдалану жолы туралы қосымша ақпаратты береді.
Құралдар тақтасын көрсетіңіз және сүйреп апарып өңдеуді қосыңыз
Дизайнды өте жылдам бастау үшін кез келген үшінші тарап құралында әзірленген HTML-ді тікелей дизайнердің HTML қойындысына қоюға болады. Дегенмен, мұны істегенде Дизайншы қойындысы мәтінді пішімдеу құралдар тақтасын қамтамасыз ететін және барлық кескіндерді, сілтемелерді және мәнерлерді көрсететін жалғыз пішімделген мәтін өңдегіші ретінде көрсетіледі. HTML файлыңызға енгізілген, бірақ басқаша Құралдар жинағы, Сипаттар немесе Стильдер қойындылары немесе кез келген сүйреп апару функциясы (бұл жеңілдетілген Дизайншы көрініс кейде деп аталады. толық бет редакторы). Дегенмен, құжаттың <head> бөліміне келесі мета тегті қосу арқылы кез келген қойылған дизайн үшін сүйреп апару мүмкіндігін қосуға болады:
<meta type="xrm/designer/setting" name="type" value="marketing-designer-content-editor-document">
Келесі сурет толық бетті өңдеу режимінде (сол жақта) және сүйреп апару режимінде (оң жақта) бірдей дизайнды көрсетеді. Жалғыз айырмашылық - оң жақтағы дизайн мета тегті қамтиды, сондықтан апарып тастау мүмкіндігі қосылады және бүйірлік панель көрсетіледі.
Ескертпе
Толық бет өңдегішін пайдаланған кезде мәтінді пішімдеу құралдар тақтасы (көрсетілген) арқылы мәтінді таңдауға, өңдеуге және мәнерлеуге болады, сонымен қатар қалқымалы терезе арқылы сипаттарын орнату үшін суреттерді, сілтемелерді және басқа элементтерді екі рет шертуге болады. жоғары диалог. Құралдар тақтасы сонымен қатар әр алушының контакт жазбасынан алынған өріс мәндері сияқты динамикалық мазмұнды қосуға арналған Көмекші өңдеу түймешігін 
қамтиды.
Пайдаланушылар дизайн элементтерін қоса алатын контейнер жасаңыз
Дизайншы қойындысында пайдаланушылар тек дизайн элементіндегі мазмұнды өңдей алады және жаңа дизайн элементтерін құжаттың . ретінде орнатылған бөліктеріне ғана сүйреп апара алады. деректер контейнерлері Сондықтан, кейбір аймақтар (контейнерлердің сыртында) Дизайн қойындысында өңдеуге құлыпталатын үлгілерді жасай аласыз, ал басқа аймақтар (құлпы ашылған контейнерлер ішінде) өңдеулерді қабылдайды және сүйреп апарады. мазмұны.
Деректер контейнерлерін жасау үшін <div> атрибуты бар data-container="true" тегтерді пайдаланыңыз, мысалы:
<table aria-role="presentation">
<tbody><tr>
<td>
LOCKED
</td>
<td>
<div data-container="true">
<!-- DRAG HERE -->
</div>
</td>
</tr>
</tbody></table>
деректер-контейнер div-тегтер жұбының ішінде кірістірілген және дизайн элементінің бөлігі болып табылмайтын кез келген мәтін немесе HTML тегтері сүйретілмейтін, тартылмайтын тег жасайды. -редакцияланатын, екі сүйретілетін аумақ арасындағы аймақ. Мысалы:
<div data-container="true">
<!-- DRAG HERE --> <p> LOCKED </p> <!-- DRAG HERE -->
</div>
Ескертпе
Толық бет өңдегіші қосылғанда, сүйреп апарудың барлық мүмкіндіктері өшіріледі және Дизайншы қойындысындағы барлық мазмұнды, соның ішінде data-container div тегтері (толық бет өңдегішінде ешқандай әсері жоқ) сыртындағы мазмұнды өңдеуге болады.
Контейнерді Конструктор көрінісінде құлыптау
контейнерді оның барлық мазмұнын Дизайншы қойындысында тек оқуға болатын етіп құлыптауға болады. Құлыпталған контейнерде дизайн элементтері болса, сол элементтердің барлық мазмұны мен параметрлері құлыптаулы күйінде қалады, ал Сипаттар қойындысы олар үшін ешқашан көрсетілмейді, тіпті оларды таңдасаңыз да.
Контейнер үшін дизайн құрамдастарын қосып және конфигурациялап болғаннан кейін контейнерді құлыптау үшін контейнерді құлыптау мүмкіндігін пайдалануға болады.
Контейнерді құлыптау үшін келесідей контейнер тегіне data-locked="hard" атрибутын қосыңыз:
<div data-container="true" data-locked="hard">
<!-- All elements and content here are locked, with no properties shown -->
</div>
Ескертпе
Сондай-ақ мазмұнды дизайн элементі деңгейінде құлыптауға болады. Мазмұн контейнер деңгейінде құлыпталған болса, бұл параметр контейнер ішіндегі барлық дизайн элементтерінің құлыпталған/құлыптан босатылған күйін жоққа шығарады. Қосымша ақпарат: Элементтерді Конструктор көрінісінде құлыптау
Контейнерді құлыптауды одан әрі күшейту үшін таңдалған пайдаланушылардың кодқа кіруіне жол бермейтін HTML қойындысына кіруді шектей аласыз (олар бұл параметрді әйтпесе жеңуі мүмкін). Қосымша ақпарат: Дизайнер мүмкіндіктеріне кіруді басқару
Дизайн элементтерін анықтау
Дизайн элементін Дизайншы қойындысын пайдаланып қосқан сайын, өңдегіш элементтің басы мен соңын белгілеу үшін <div> тегтер жұбын кірістіреді, және Сипаттар қойындысындағы оның параметрлерінде көрсетілгендей элементті көрсету үшін кез келген HTML қажет етеді.
Дизайн элементтері <div> пішінінің төлсипатын қамтитын data-editorblocktype="<element-type>"тегтерімен белгіленеді, мұнда бұл төлсипаттың мәні оның элемент түрін анықтайды. Мысалы, келесі <div> тегі мәтін элементін жасайды:
<div data-editorblocktype="Text">
...
<!-- Don't edit the element content here -->
...
</div>
Келесі кестеде data-editorblocktype атрибутының қолжетімді мәндері берілген.
| Дизайн элементінің аты | Элемент түрі | data-editorblocktype атрибут мәні |
|---|---|---|
| Мәтін элементі | Жалпы дизайн элементі | Мәтін |
| Кескін элементі | Жалпы дизайн элементі | Image |
| Бөлгіш элемент | Жалпы дизайн элементі | Бөлгіш |
| Түйме элементі | Жалпы дизайн элементі | Button |
| Мазмұн блогының элементі | Жалпы дизайн элементі | Мазмұны (Дизайн элементінің бұл түріне сонымен қатар мазмұн блогының қай түрі екенін анықтайтын data-block-datatype="<block-type>" атрибут кіреді, мұнда <блок түрі> мәні бар не text немесе image.) |
| Маркетинг беті элементі | Электрондық пошта | маркетинг беті |
| Оқиға элементі | Электрондық пошта | Оқиға |
| Сауалнама элементі | Электрондық пошта | Сауалнама |
| Пішін элементі | Форма | FormBlock |
| Өріс элементі | Пішін мазмұны | Өріс-<өріс-аты>, мысалы: Өріс-электрондық пошта |
| Жазылым тізімінің элементі | Пішін мазмұны | SubscriptionListBlock |
| Досқа жіберу элементі | Мазмұнынан | ForwardToFriendBlock |
| Электрондық поштаны жібермеу элементі және Мені есте сақтау элементі | Пішін мазмұны | Өріс-құсбелгі (Бұл элементтердің әрқайсысы құсбелгілерді жасайды және басқаша олардың ішкі параметрлерімен ерекшеленеді.) |
| Жіберу түймесі элементі | Пішін мазмұны | SubmitButtonBlock |
| Қалпына келтіру түймесі элементі | Пішін мазмұны | ResetButtonBlock |
| Captcha элементі | Пішін мазмұны | CaptchaBlock |
Осы дизайн элементтерінің әрқайсысы туралы қосымша ақпаратты Дизайн элементтері сілтемесін қараңыз.
Маңызды
HTML қойындысында жұмыс істегенде, дизайн элементтерінің <div> тегтері арасындағы кез келген мазмұнды өңдеуден аулақ болуыңыз керек, себебі орындау нәтижелері сондықтан болжау мүмкін емес болуы мүмкін және сіздің өңдеулеріңізді бәрібір дизайнер қайта жазуы мүмкін. Оның орнына дизайн элементінің мазмұны мен сипаттарын басқару үшін Дизайншы қойындысын пайдаланыңыз.
Конструктор көрінісіндегі элементтерді құлыптау
Кез келген дизайн элементінің мазмұны мен сипаттарын оның ашылу <div> тегіне келесі төлсипатты қосу арқылы құлыптауға болады:
data-protected="true"
Мысалы:
<div data-editorblocktype="Divider" data-protected="true">
…
<!-- Don't edit the element content here -->
…
</div>
Дизайн элементі қорғалған деп белгіленген кезде, бет немесе электрондық пошта үшін Дизайншы қойындысында жұмыс істейтін пайдаланушылар элементтің сипаттарын немесе мазмұнын өңдей алмайды. Бұл төлсипат әрқашан мазмұнды блоктау элементіне қосылады, бірақ оны қорғау үшін оны кез келген дизайн элементіне қосуға болады. Осы төлсипатты қамтитын кез келген дизайн элементі оның қорғалғанын көрсету үшін HTML қойындысында көлеңкеленген түрде көрсетіледі, бірақ талап етсеңіз, оны әлі де өңдеуге болады. Дизайн элементінен қорғауды жою үшін бұл төлсипатты "жалған" мәніне орнатыңыз (немесе жай ғана алып тастаңыз).
Ескертпе
Сондай-ақ мазмұнды контейнер деңгейінде құлыптауға болады, бұл контейнер ішіндегі барлық дизайн элементтерінің құлыпталған/құлпын ашылған күйін жоққа шығарады. Қосымша ақпарат: Контейнерді Конструктор көрінісінде құлыптау
Мазмұнды құлыптауды одан әрі күшейту үшін таңдалған пайдаланушылардың кодқа кіруіне жол бермейтін HTML қойындысына кіруді шектей аласыз (олар бұл параметрді әйтпесе жеңуі мүмкін). Қосымша ақпарат: Дизайнер мүмкіндіктеріне кіруді басқару
Дизайнерге сырттан жасалған HTML импорттау
маркетингтік электрондық хабар, бет немесе пішін үшін бастапқы HTML орналасуын және мазмұнын жасау үшін өзіңізге ұнайтын кез келген құралды пайдалануға болады. HTML дайын болғанда, оны сәйкес дизайнерге қойып, келесі бөлімдерде сипатталғандай қажет кез келген Dynamics 365 Customer Insights - Journeys мүмкіндіктерді қосыңыз.
HTML кодын импорттаңыз
Дизайнерге сырттан жасалған HTML енгізу үшін келесі әрекеттерді орындаудан бастаңыз:
- Dynamics 365 Customer Insights - Journeysішінде жаңа маркетингтік электрондық хабар, бет немесе пішін жасаңыз.
- Дизайнердің Дизайн>HTML қойындысына өтіңіз.
- HTML қойындысынан барлық мазмұнды тазалап, сырттан жасалған HTML-ге қойыңыз.
- Дизайнердің Дизайн>Дизайншы қойындысына өтіп, дизайныңызды тексеріңіз.
- маркетингтік электрондық хабар файлымен жұмыс істеп жатсаңыз, барлық қажетті мазмұнды және сілтемелерді орналастыру үшін көмекші өңдеу қолдануды ұмытпаңыз. (жазылым орталығының сілтемесін және физикалық жіберушінің мекенжайын қоса).
Шайпұл
Сыртқы HTML-де жаңа ғана қойғандықтан, дизайныңызда Dynamics 365 Customer Insights - Journeys-ге тән код болмауы мүмкін, сондықтан Дизайншы көрсетеді толық беттік редактор, ол негізгі мәтінді пішімдеуге, кескінді пішімдеуге және (электрондық хаттар үшін) өңдеуге көмектесетін мүмкіндіктерді қамтамасыз етеді. динамикалық мазмұнды қосу үшін. Толық бет өңдегішімен жұмыс істеу туралы қосымша ақпарат алу үшін Құралдар жинағын көрсету және сүйреп апарып өңдеуді қосу бөлімін қараңыз. Толық бет өңдегіші сізге қажет барлық мүмкіндіктерді қамтамасыз етсе, оны дизайнды дәл баптау үшін пайдаланыңыз, содан кейін онымен әдеттегідей тікелей эфирге өтіңіз. Егер дизайнды дәл баптау үшін сүреп апарып тастау өңдегішін пайдаланғыңыз келсе, оны қосу жолы туралы ақпаратты келесі бөлімді қараңыз.
Импорттаудан кейін апарып тастау өңдегішін қосыңыз
Дизайншы көрінісінде жұмыс істеу кезінде толық мүмкіндігі бар сүйреп апарып тастау өңдегішін қосқыңыз келсе және/немесе кеңейтілген дизайн элементтерін қосқыңыз келсе, мұны оңай орындауға болады: импортталған HTML кодын келесідей өңдеу:
Дизайнердің Дизайн>HTML қойындысына оралыңыз.
Құжаттың бөліміне Құралдар жинағын көрсету және қосу бөлімінде сипатталғандай қажетті мета тегті қосу арқылы сүйреп апару өңдегішін қосыңыз. сүйреп апарып өңдеу.
Дизайн>HTML қойындысында жұмыс істеу кезінде қажетінше келесі әрекеттерді орындаңыз:
- Бір немесе бірнеше дизайн элементін сүйреп апарғыңыз келетін дизайнның әрбір бөлігінде Пайдаланушылар дизайн элементтерін қоса алатын контейнер жасау бөлімінде сипатталғандай деректер контейнерін жасау үшін код қосыңыз.
- Дизайн элементтерін сүйреп апару әдісін қолданбай кодыңызда тікелей орналастыруды қаласаңыз, қажетті кодты тікелей Дизайн>HTML ішіне енгізуге болады. Осы жолмен қосатын элементтер сүйреп апарып тастауға қолдау көрсетпейді, бірақ олар Сипаттар панелінде Дизайнның> параметрлерді қамтамасыз етеді. Дизайншы қойындысы. Осы әдісті пайдаланып мәтінді, кескінді, бөлгіш және түйме элементтерін ғана орналастыруға болады (контейнерлерді жасаңыз және дизайн элементтерінің басқа түрлері үшін апарып тастауды пайдаланыңыз). Осы элементтердің әрқайсысын жасау үшін қажетті HTML құрылымдары үшін осы процедурадан кейінгі кестені қараңыз; қажет болған жағдайда осы кодты кестеден тікелей көшіріңіз/қойыңыз.
Енді Дизайн>Дизайншы қойындысына өтіп, дизайн элементтерін орнатқан контейнерлердің әрқайсысына сүйреп апарып, содан кейін Сипаттар панелі, сіз апарған немесе тікелей кодыңызға қойған әрбір дизайн элементін конфигурациялауға арналған.
| Дизайн элементінің түрі | Бұл кодты қойыңыз | Жазбалар |
|---|---|---|
| Мәтін | <div data-editorblocktype="Text"><p> Enter your text here</p></div> |
HTML мазмұнын <p> тегтердің арасына тікелей осында енгізуге болады немесе оны орындау үшін пішімделген мәтін өңдегішін пайдалану үшін Дизайнерге өтіңіз. |
| 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> |
Кескін көзін және/немесе кескін сілтемесін өзгертудің ең оңай жолы – Дизайнерге өтіп, Сипаттар панель. Бірақ келесі атрибуттарды тікелей HTML-де өңдеуге болады:
|
| Бөлгіш | <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> |
Бұл кодтың ешқайсысын тікелей HTML өңдегішінде өңдемеңіз. Оның орнына Дизайншы орындаңыз және Сипаттар панелін пайдаланыңыз. |
| 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" |
Бұл кодтың ешқайсысын тікелей HTML өңдегішінде өңдемеңіз. Оның орнына Дизайншы орындаңыз және Сипаттар панелін пайдаланыңыз. |
Дизайн элементтері кодта қалай көрінетіні туралы қосымша ақпаратты Дизайн элементтерін анықтау бөлімінен қараңыз.
Мәтіндік элементтердің құралдар тақтасына жаңа қаріптер қосыңыз
Мәтін элементтері конструкторда таңдалған мәтінге қаріпті қолдануға арналған мәзірді қамтитын қалқымалы пішімдеу құралдар тақтасын қамтамасыз етеді.
Осы қаріп таңдау құралына жаңа қаріптерді қосу үшін құжаттың <meta> пішіміне келесі пішінді пайдаланатын <head> тегті қосыңыз:
<meta type="xrm/designer/setting" name="additional-fonts" datatype="font" value="<font-list>">
Мұндағы <font-list> қаріп атауларының нүктелі үтірмен бөлінген тізімі.
Стильдер қойындысына параметрлерді қосыңыз
Қораптан тыс үлгілердің ыңғайлы мүмкіндіктерінің бірі олар Стильдер қойындысында жаһандық мәнер параметрлерін қамтамасыз етеді, бұл пайдаланушыларға қаріптер тобын, түстер палитрасын және жылдам реттеуге мүмкіндік береді. үлгі үшін қосылған басқа жаһандық параметрлер. Әрбір үлгіде сол нақты дизайн үшін мағынасы бар мәнерлер параметрлері ғана бар және сіз де өзіңіз және пайдаланушыларыңыз үшін дұрыс мәнер параметрлерін қамтамасыз ететін үлгілерді жасай аласыз.
Параметрді Стильдер қойындысына қосу үшін келесі әрекеттерді орындау керек:
- Параметрді жасау үшін құжаттың
<meta>қа<head>тегін қосыңыз. - Мета тег арқылы жасалған параметрлерді қолданатын стильдерді және/немесе HTML тегтерін орнатыңыз.
Келесі бөлімдер осы әрекеттердің әрқайсысын қалай орындау керектігін түсіндіреді.
Параметрді жасау үшін мета тег қосыңыз
Қажетті <meta> тегі келесі пішінді алады:
<meta type="xrm/designer/setting" name="<name>" value="<initial-value>" datatype="<data-type>" label="<label>">
Ол жерде:
- <name> параметр қолданылатын мәнерлер мен HTML тегтеріне сілтеме жасау керек болатын мета тегті анықтайды.
- <бастапқы мән> мәнер үшін сәйкес әдепкі мән.
- <деректер түрі> пайдаланушылар беретін мән түрін анықтайды. Бұл параметр Стильдер қойындысында ұсынылған басқару түріне әсер етеді. Келесі кестеде көрсетілген мәндердің бірін пайдалану керек.
- <белгі> параметр үшін Стильдер қойындысында көрсетілетін мәтінді көрсетеді.
| Деректер типінің мәні | Сипаттама |
|---|---|
| түс | Түсті #000 немесе #1a32bf сияқты хэш-тег мәндерін пайдаланып орнатады. Стильдер қойындысында түс таңдауды басқару элементін жасайды. |
| шрифт | Қаріптер тобының атын орнатады. Сондай-ақ, шрифт стектерін таңдау реті бойынша үтірмен бөлінген қаріп атауларының тізімін пайдалану арқылы орнатуға болады. Стильдер қойындысында қарапайым енгізу өрісін жасайды. |
| нөмірі | Бірліксіз сандық мәнді орнатады (мәтінді пайдаланып, px немесе em мәтінмен бірге көрсетуге рұқсат етіңіз. мәні). Стильдер қойындысындағы ағымдағы мәнді арттыру/азайту үшін де пайдалануға болатын жоғары/төмен түймелері бар енгізу өрісін жасайды. |
| сурет | Сурет көзін орнатады (URL ретінде). Стильдер қойындысында қарапайым енгізу өрісін жасайды. |
| мәтін | Мәтінді де, сандарды да қамтитын мәнді орнатады. Сондай-ақ бұл деректер түрін бірлік қамтуы мүмкін сандық мәндер үшін пайдаланыңыз (мысалы, px немесе em). Стильдер қойындысында қарапайым енгізу өрісін жасайды. |
Ескертпе
Стильдер қойындысында көрсетілген белгі "[Менің стилім]" сияқты төртбұрышты жақшаларда көрсетілуі мүмкін. Шаршы жақшалар көрсетілген мәтіннің аудармасы қолжетімді емес екенін көрсетеді. Қораптан тыс үлгілердің кез келгені (мысалы, "Түс 1") қолдайтын мәнді таңдасаңыз, аударма қол жетімді болады, сондықтан шаршы жақшалар пайда болмайды.
Ескертпе
Мұнда сипатталған <meta> тегінің көмегімен орнатылған мәнер параметрі тек Стильдер қойындысында көрсетіледі, егер бұл параметр кем дегенде біреуінде сілтеме жасалған болса келесі бөлімдерде сипатталғандай нақты стиль немесе HTML тегі.
Баста мәнер параметрлерін енгізу үшін CSS түсініктемелерді қосыңыз
Стильдер қойындысында жасалған параметрлер сәйкес xrm/designer/setting мета тегі үшін name атрибутының мәнін қамтитын CSS мәнін екі CSS түсініктемелерімен қоршау арқылы HTML құжатының <head> ішінде орнатылған CSS стильдеріне қолданылуы мүмкін. CSS түсініктеме жұбы келесі пішінді алады:
/* @<tag-name> */ <value> /* @<tag-name> */
Ол жерде:
- <tag-name> бұл xrm/designer/setting мета-тегінің атрибуты, ол сәйкес Стильдер қойынды параметрі.
- <мән> бұл пайдаланушы сәйкес Стильдер қойынды параметрін өңдеген кезде ауыстырылатын мән.
Маңызды
CSS түсіндірмелердің осы жұптарын <style> бөліміндегі <head> тегтер ішінде анықталған мәнерлер мен сыныптарда ғана пайдалана аласыз. Сонымен қатар, барлық <style> мәнерлер орнатылған CSS тегтердің бір ғана жинағы болуы керек.
Мұнда xrm/designer/setting Стильдер қойындысында "Түс 1" деп аталатын түс таңдау құралын жасайтын мета тегін көруге болатын мысал берілген. A CSS мәнері <h1> элементтер үшін мәтін түсін орнату үшін осы параметрді қолданады.
<head>
<meta type="xrm/designer/setting" name="color1" value="#ff0000" datatype="color" label="Color 1">
<style>
h1 {color: /* @color1 */ #ff0000 /* @color1 */;}
</style>
</head>
Денедегі мәнер параметрлерін енгізу үшін сипат-анықтамалық атрибуттарды қосыңыз
Стильдер қойындысында жасалған параметрлерді келесі пішіннің төлсипатын қосу арқылы құжатыңыздың <body> барлық HTML тегіне төлсипат мәндері ретінде қолдануға болады әрбір сәйкес тегке:
property-reference= "<attr>:@< tag-name >;<attr>:@< tag-name >; …"
Ол жерде:
- <attr> құрылатын атрибуттың атауы.
- <tag-name> бұл параметрді орнатқан метатег үшін
nameатрибутының мәні. - Қажет болса, бірнеше атрибуттар бір сипатты сілтеме төлсипаты ішінде нүктелі үтірмен бөлінуі керек.
Мұнда xrm/designer/setting мета тегтерді көруге болатын мысал берілген, ол құжаттағы кейіпкер бейнесін (баннер) басқаруға арналған екі параметрді жасайды, оның бетінде «Батыр бейнесі» және «Батыр суретінің биіктігі» деп аталатын басқару элементтері бар. Стильдер қойындысы. Содан кейін property-reference сипаты сол параметрлерді жүзеге асыру үшін <img> тегінде пайдаланылады.
<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>
Сонымен, бұл мысалда <img> тегі келесідей нәрсеге шешіледі:
<img src="picture.jpg" height="100px">