A felhasználói felület testreszabása HTML-sablonokkal az Azure Active Directory B2C-ben
Mielőtt hozzákezdene, a Szabályzattípus kiválasztása választóval válassza ki a beállított szabályzat típusát. Az Azure Active Directory B2C két módszert kínál annak meghatározására, hogy a felhasználók hogyan használják az alkalmazásokat: előre definiált felhasználói folyamatokon vagy teljesen konfigurálható egyéni szabályzatokon keresztül. A cikkben szereplő lépések különbözőek az egyes metódusok esetében.
Az Azure Active Directory B2C (Azure AD B2C) által az ügyfelek számára megjelenített felhasználói felület védjegyezése és testreszabása segít zökkenőmentes felhasználói élményt nyújtani az alkalmazásban. Ezek a szolgáltatások közé tartozik a regisztráció, a bejelentkezés, a profilszerkesztés és a jelszó alaphelyzetbe állítása. Ez a cikk bemutatja a felhasználói felület (UI) testreszabási módszereit.
Tipp.
Ha csak a szalagcím emblémáját, háttérképét és háttérszínét szeretné módosítani a felhasználói folyamat oldalain, kipróbálhatja a Céges védjegyzés funkciót.
Egyéni HTML- és CSS-áttekintés
Az Azure AD B2C kódokat futtat az ügyfél böngészőjében a több forrásból származó erőforrás-megosztás (CORS) használatával. Futásidőben a rendszer betölti a tartalmat a felhasználói folyamatban vagy az egyéni szabályzatban megadott URL-címről. A felhasználói felület minden lapja betölti a tartalmát az adott laphoz megadott URL-címről. Miután betöltötte a tartalmat az URL-címéről, az összeolvad az Azure AD B2C által beszúrt HTML-töredékkel, majd megjelenik a lap az ügyfél számára.
Egyéni HTML-lap tartalma
Hozzon létre egy HTML-lapot saját arculattal az egyéni laptartalmak kiszolgálásához. Ez a lap lehet statikus *.html
vagy dinamikus lap, például .NET, Node.js vagy PHP, azonban az Azure B2C nem támogatja a nézetmotorokat. A dinamikus lap kiszolgálóoldali megjelenítését egy dedikált webalkalmazásnak kell elvégeznie.
Az egyéni laptartalmak bármilyen HTML-elemet tartalmazhatnak, beleértve a CSS-t és a JavaScriptet is, de nem tartalmazhatnak nem biztonságos elemeket, például iframe-eket. Az egyetlen szükséges elem egy div elem, <div id="api"></div>
amelynek id
a beállítása api
a HTML-oldalon belül van.
<!DOCTYPE html>
<html>
<head>
<title>My Product Brand Name</title>
</head>
<body>
<div id="api"></div>
</body>
</html>
Az alapértelmezett Azure AD B2C-lapok testreszabása
Az egyéni laptartalmak létrehozása helyett testre szabhatja az Azure AD B2C alapértelmezett laptartalmat.
Az alábbi táblázat az Azure AD B2C által biztosított alapértelmezett laptartalmat sorolja fel. Töltse le a fájlokat, és használja őket kiindulási pontként saját egyéni lapok létrehozásához. A mintasablonok letöltésével és használatával kapcsolatban lásd a mintasablonokat .
Oldal | Leírás | Sablonok |
---|---|---|
Egységes regisztráció vagy bejelentkezés | Ez a lap kezeli a felhasználó regisztrációs és bejelentkezési folyamatát. A felhasználók használhatják a vállalati identitásszolgáltatókat, a közösségi identitásszolgáltatókat, például a Facebookot, a Microsoft-fiókot vagy a helyi fiókokat. | Klasszikus, Ocean Blue és Slate Gray. |
Bejelentkezés (csak) | A bejelentkezési lap az identitásszolgáltató kiválasztásaként is ismert. Helyi fiókkal vagy összevont identitásszolgáltatókkal kezeli a felhasználó bejelentkezését. Ezen a lapon engedélyezheti a bejelentkezést anélkül, hogy regisztrálhat. Például mielőtt a felhasználó szerkesztheti a profilját. | Klasszikus, Ocean Blue és Slate Gray. |
Önérvényesített | A legtöbb interakció az Azure AD B2C-ben, ahol a felhasználótól elvárható, hogy bemenetet adjon, önérvényesítést kap. Például regisztrációs lap, bejelentkezési lap vagy jelszó-visszaállítási oldal. Ezt a sablont egyéni laptartalomként használhatja a közösségi fiók regisztrációs oldalához, egy helyi fiók regisztrációs oldalához, egy helyi fiók bejelentkezési oldalához, a jelszó alaphelyzetbe állításához, a profil szerkesztéséhez, a blokkoldalhoz stb. Az önaláírt oldal különböző beviteli vezérlőket tartalmazhat, például: szövegbeviteli mezőt, jelszóbeviteli mezőt, választógombot, egyszeresen kijelölhető legördülő mezőket és több jelölőnégyzetet. | Klasszikus, Ocean Blue és Slate Gray. |
Többtényezős hitelesítés | Ezen a lapon a felhasználók a regisztráció vagy a bejelentkezés során ellenőrizhetik telefonszámaikat (szöveg vagy hang használatával). | Klasszikus, Ocean Blue és Slate Gray. |
Hiba | Ez a lap kivétel vagy hiba esetén jelenik meg. | Klasszikus, Ocean Blue és Slate Gray. |
Az oldal tartalmának üzemeltetése
Ha saját HTML- és CSS-fájlokat használ a felhasználói felület testreszabásához, a felhasználói felület tartalmát minden olyan nyilvánosan elérhető HTTPS-végponton tárolja, amely támogatja a CORS-t. Ilyenek például az Azure Blob Storage, a Azure-alkalmazás Services, a webkiszolgálók, a CDN-ek, az AWS S3 vagy a fájlmegosztó rendszerek.
Egyéni laptartalom használatának irányelvei
Használjon abszolút URL-címet, ha külső erőforrásokat, például média-, CSS- és JavaScript-fájlokat tartalmaz a HTML-fájlban.
A lapelrendezés 1.2.0-s vagy újabb verziójával hozzáadhatja az attribútumot a
data-preload="true"
HTML-címkékhez a CSS és a JavaScript terhelési sorrendjének szabályozásához. Ezzel a lehetőséggeldata-preload="true"
a lap létrehozása előtt megjelenik a felhasználó számára. Ez az attribútum segít megakadályozni, hogy a lap "villogjon" a CSS-fájl előzetes betöltésével, anélkül, hogy a felhasználó megjelenítse a nem formázott HTML-t. Az alábbi HTML-kódrészlet a címke használatátdata-preload
mutatja be.<link href="https://path-to-your-file/sample.css" rel="stylesheet" type="text/css" data-preload="true"/>
Javasoljuk, hogy kezdje az alapértelmezett oldaltartalommal, és építsen rá.
A JavaScriptet felveheti az egyéni tartalomba.
A támogatott böngészőverziók a következők:
- Internet Explorer 11, 10 és Microsoft Edge
- Az Internet Explorer 9 és 8 korlátozott támogatása
- Google Chrome 42.0 vagy újabb
- Mozilla Firefox 38.0 vagy újabb
- Safari iOS-hez és macOS-hez, 12-es vagy újabb verzió
Biztonsági korlátozások miatt az Azure AD B2C nem támogatja
frame
aiframe
HTML-elemeket.form
Tartalom honosítása
A HTML-tartalmak honosításához engedélyeznie kell a nyelvi testreszabást az Azure AD B2C-bérlőben. A funkció engedélyezésével az Azure AD B2C beállíthatja a HTML-lap nyelvi attribútumát, és átadhatja az OpenID Csatlakozás paramétert ui_locales
a végpontnak.
Egysablonos megközelítés
Az oldalbetöltés során az Azure AD B2C beállítja a HTML-lap nyelvi attribútumát az aktuális nyelvvel. For example, <html lang="en">
. Az aktuális nyelv különböző stílusainak megjelenítéséhez használja a CSS-választót :lang
és a CSS-definíciót.
Az alábbi példa a következő osztályokat határozza meg:
imprint-en
- Akkor használatos, ha az aktuális nyelv angol.imprint-de
- Akkor használatos, ha a jelenlegi nyelv német.imprint
- Alapértelmezett osztály, amelyet akkor használunk, ha az aktuális nyelv nem angol vagy német.
.imprint-en:lang(en),
.imprint-de:lang(de) {
display: inherit !important;
}
.imprint {
display: none;
}
A következő HTML-elemek jelennek meg vagy rejtve lesznek az oldal nyelvének megfelelően:
<a class="imprint imprint-en" href="Link EN">Imprint</a>
<a class="imprint imprint-de" href="Link DE">Impressum</a>
Többsablonos megközelítés
A nyelvi testreszabási funkció lehetővé teszi, hogy az Azure AD B2C átadja az OpenID Csatlakozás paramétert ui_locales
a végpontnak. A tartalomkiszolgáló ezt a paramétert használhatja nyelvspecifikus HTML-oldalak biztosítására.
Megjegyzés:
Az Azure AD B2C nem adja át az OpenID Csatlakozás paramétereket, például ui_locales
a kivételoldalaknak.
A használt területi beállítások alapján a tartalom különböző helyekről is lekérehető. A CORS-kompatibilis végponton beállíthat egy mappastruktúrát, amely adott nyelvek tartalmát tárolja. A megfelelőt hívja meg, ha helyettesítő karaktert {Culture:RFC5646}
használ.
Az egyéni lap URI-ja például a következőképpen nézhet ki:
https://contoso.blob.core.windows.net/{Culture:RFC5646}/myHTML/unified.html
A lapot francia nyelven töltheti be, ha lekérte a tartalmat a következőből:
https://contoso.blob.core.windows.net/fr/myHTML/unified.html
Egyéni laptartalom bemutatója
A folyamat áttekintése:
- Készítsen elő egy helyet az egyéni laptartalom üzemeltetéséhez (nyilvánosan elérhető, CORS-kompatibilis HTTPS-végpont).
- Töltse le és szabja testre például
unified.html
az alapértelmezett laptartalomfájlt. - Tegye közzé az egyéni lap tartalmát a nyilvánosan elérhető HTTPS-végponton.
- Állítsa be a több forrásból származó erőforrás-megosztást (CORS) a webalkalmazáshoz.
- A szabályzatot az egyéni szabályzat URI-ra mutathatja.
Előfeltételek
- Hozzon létre egy felhasználói folyamatot , hogy a felhasználók regisztrálhassák és bejelentkezhessenek az alkalmazásba.
- Webalkalmazás regisztrálása.
- Az Egyéni szabályzatok használatának első lépései az Active Directory B2C-ben
- Webalkalmazás regisztrálása.
1. A HTML-tartalom létrehozása
Hozzon létre egy egyéni laptartalmat a termék márkanevével a címben.
Másolja ki a következő HTML-kódrészletet. Ez egy jól formázott HTML5 egy üres elem, az úgynevezett div id="api"></div> található a< törzscímkék>.< Ez az elem azt jelzi, hogy hová szeretné beszúrni az Azure AD B2C-tartalmat.
<!DOCTYPE html> <html> <head> <title>My Product Brand Name</title> </head> <body> <div id="api"></div> </body> </html>
A másolt kódrészlet beillesztése szövegszerkesztőbe
A CSS használatával formázhatja az Azure AD B2C által a lapra beszúrt felhasználói felületi elemeket. Az alábbi példa egy egyszerű CSS-fájlt mutat be, amely a regisztrációs html-elemek beállításait is tartalmazza:
h1 { color: blue; text-align: center; } .intro h2 { text-align: center; } .entry { width: 400px ; margin-left: auto ; margin-right: auto ; } .divider h2 { text-align: center; } .create { width: 400px ; margin-left: auto ; margin-right: auto ; }
Mentse a fájlt customize-ui.html formátumban.
Megjegyzés:
Ha login.microsoftonline.com használ, a HTML-űrlapelemek biztonsági korlátozások miatt el lesznek távolítva. Ha HTML-űrlapelemeket szeretne használni az egyéni HTML-tartalomban, használja a b2clogin.com.
2. Azure Blob Storage-fiók létrehozása
Ebben a cikkben az Azure Blob Storage-ot használjuk a tartalom üzemeltetéséhez. Dönthet úgy, hogy egy webkiszolgálón tárolja a tartalmat, de engedélyeznie kell a CORS-t a webkiszolgálón.
Megjegyzés:
Egy Azure AD B2C-bérlőben nem építhet ki Blob Storage-tárolót. Ezt az erőforrást a Microsoft Entra-bérlőben kell létrehoznia.
A HTML-tartalom Blob Storage-ban való tárolásához kövesse az alábbi lépéseket:
- Jelentkezzen be az Azure Portalra.
- Ha több bérlőhöz is hozzáfér, a felső menüben válassza a Gépház ikont a Microsoft Entra ID-bérlőre való váltáshoz a Könyvtárak + előfizetések menüből.
- Az Azure Portalon keresse meg és válassza ki a Storage-fiókokat
- Válassza a +Létrehozás lehetőséget.
- Válasszon előfizetést a tárfiókhoz.
- Hozzon létre egy erőforráscsoportot, vagy válasszon ki egy meglévőt.
- Adjon meg egy egyedi Storage-fióknevet a tárfiókhoz.
- Válassza ki a tárfiók földrajzi régióját .
- A teljesítmény standard maradhat.
- A redundancia georedundáns tárolás (GRS) maradhat
- Válassza a Véleményezés + létrehozás lehetőséget, és várjon néhány másodpercet, amíg a Microsoft Entra-azonosító futtat egy ellenőrzést.
- Kattintson a Létrehozás gombra a tárfiók létrehozásához. Az üzembe helyezés befejezése után a tárfiók lapja automatikusan megnyílik, vagy az Erőforrás megnyitása lehetőséget kell választania.
2.1 Tároló létrehozása
Ha nyilvános tárolót szeretne létrehozni a Blob Storage-ban, hajtsa végre a következő lépéseket:
- A bal oldali menü Adattárolás területén válassza a Tárolók lehetőséget.
- Válassza a + Tároló lehetőséget.
- A Név mezőbe írja be a gyökérnevet. A név lehet az Ön által választott név, például contoso, de ebben a példában az egyszerűség kedvéért használjuk a gyökerét .
- Nyilvános hozzáférési szint esetén válassza a Blob lehetőséget. A Blob beállítás kiválasztásával engedélyezheti a tároló névtelen nyilvános írásvédett hozzáférését.
- A tároló létrehozásához válassza a Létrehozás lehetőséget.
- Válassza a gyökér lehetőséget az új tároló megnyitásához.
2.2 Az egyéni lap tartalomfájljainak feltöltése
- Válassza a Feltöltés lehetőséget.
- Válassza a Mappa ikont a Fájl kiválasztása elem mellett.
- Keresse meg és válassza ki a customize-ui.html fájlt, amelyet korábban a Lap felhasználói felület testreszabása szakaszban hozott létre.
- Ha almappába szeretne feltölteni, bontsa ki a Speciális elemet, és adjon meg egy mappanevet a Feltöltés mappába területen.
- Válassza a Feltöltés lehetőséget.
- Válassza ki a feltöltött customize-ui.html blobot.
- Az URL-szövegmező jobb oldalán válassza a Vágólapra másolás ikont az URL-cím vágólapra másolásához.
- A webböngészőben keresse meg a másolt URL-címet, és ellenőrizze, hogy a feltöltött blob elérhető-e. Ha nem érhető el, például ha hibát tapasztal
ResourceNotFound
, győződjön meg arról, hogy a tárolóelérési típus blobra van állítva.
3. CORS konfigurálása
Konfigurálja a Blob Storage-t a forrásközi erőforrás-megosztáshoz az alábbi lépések végrehajtásával:
- Navigate to your storage account.
- A bal oldali menü Gépház területén válassza az Erőforrás-megosztás (CORS) lehetőséget.
- Az Engedélyezett források mezőben adja meg a következőt
https://your-tenant-name.b2clogin.com
: Cserélje leyour-tenant-name
az Azure AD B2C-bérlő nevét. For example,https://fabrikam.b2clogin.com
. A bérlő nevének megadásakor használja az összes kisbetűs betűt. - Engedélyezett metódusok esetén válassza a mindkettőt
GET
és aOPTIONS
. - Engedélyezett fejlécek esetén adjon meg csillagot (*).
- A közzétett fejlécek esetében adjon meg csillagot (*).
- Max. életkor esetén adja meg a 200-at.
- A lap tetején válassza a Mentés lehetőséget.
3.1 CORS tesztelése
Ellenőrizze, hogy készen áll-e az alábbi lépések végrehajtásával:
- Ismételje meg a CORS konfigurálását. Engedélyezett források esetén adja meg a
https://www.test-cors.org
- Navigálás a www.test-cors.org
- A Távoli URL-cím mezőbe illessze be a HTML-fájl URL-címét. Például:
https://your-account.blob.core.windows.net/root/azure-ad-b2c/unified.html
- Válassza a Kérés küldése lehetőséget.
Az eredménynek a következőnek kell lennie
XHR status: 200
: . Ha hibaüzenetet kap, győződjön meg arról, hogy a CORS-beállítások helyesek. Előfordulhat, hogy törölnie kell a böngésző gyorsítótárát, vagy meg kell nyitnia egy privát böngészési munkamenetet a Ctrl+Shift+P billentyűkombináció lenyomásával.
További információ az Azure Storage-fiókok létrehozásáról és kezeléséről.
4. A felhasználói folyamat frissítése
- Ha több bérlőhöz is hozzáfér, a felső menüben válassza a Gépház ikont az Azure AD B2C-bérlőre való váltáshoz a Címtárak + előfizetések menüből.
- Az Azure Portalon keresse meg és válassza ki az Azure AD B2C-t.
- A bal oldali menüben válassza a Felhasználói folyamatok lehetőséget, majd válassza ki a B2C_1_signupsignin1 felhasználói folyamatot.
- Válassza a Lapelrendezések lehetőséget, majd az Egyesített regisztrációs vagy bejelentkezési lapon válassza az Igen egyéni laptartalom használatához lehetőséget.
- Az Egyéni lap URI-jában adja meg a korábban rögzített custom-ui.html fájl URI-címét.
- A lap tetején válassza a Mentés lehetőséget.
5. A felhasználói folyamat tesztelése
- Az Azure AD B2C-bérlőben válassza ki a Felhasználói folyamatokat , és válassza ki a B2C_1_signupsignin1 felhasználói folyamatot.
- A lap tetején válassza a Felhasználói folyamat futtatása lehetőséget.
- A jobb oldali panelen válassza a Felhasználói folyamat futtatása gombot.
Az alábbi példához hasonló lapnak kell megjelennie a létrehozott CSS-fájl alapján középre állított elemekkel:
4. A bővítményfájl módosítása
A felhasználói felület testreszabásának konfigurálásához másolja a ContentDefinition és annak gyermekelemeit az alapfájlból a bővítményfájlba:
Nyissa meg a szabályzat alapfájlját. For example,
SocialAndLocalAccounts/
TrustFrameworkBase.xml
. Ez az alapfájl az egyéni szabályzatok kezdőcsomagjának egyik szabályzatfájlja, amelyet az előfeltétel, Az egyéni szabályzatok használatának első lépései című előfeltételben kellett volna beszereznie.Keresse meg és másolja ki a ContentDefinitions elem teljes tartalmát.
Nyissa meg a bővítményfájlt. Például: TrustFrameworkExtensions.xml. Keresse meg a BuildingBlocks elemet. Ha az elem nem létezik, adja hozzá.
Illessze be a BuildingBlocks elem gyermekeként másolt ContentDefinitions elem teljes tartalmát.
Keresse meg a másolt XML-ben található
Id="api.signuporsignin"
ContentDefinition elemet.Módosítsa a LoadUri értékét a tárba feltöltött HTML-fájl URL-címére. For example,
https://your-storage-account.blob.core.windows.net/your-container/customize-ui.html
.Az egyéni szabályzatnak a következő kódrészlethez hasonlóan kell kinéznie:
<BuildingBlocks> <ContentDefinitions> <ContentDefinition Id="api.signuporsignin"> <LoadUri>https://your-storage-account.blob.core.windows.net/your-container/customize-ui.html</LoadUri> <RecoveryUri>~/common/default_page_error.html</RecoveryUri> <DataUri>urn:com:microsoft:aad:b2c:elements:unifiedssp:1.0.0</DataUri> <Metadata> <Item Key="DisplayName">Signin and Signup</Item> </Metadata> </ContentDefinition> </ContentDefinitions> </BuildingBlocks>
Mentse a bővítményfájlt.
5. Töltse fel és tesztelje a frissített egyéni szabályzatot
5.1 Az egyéni szabályzat feltöltése
- Ha több bérlőhöz is hozzáfér, a felső menüben válassza a Gépház ikont az Azure AD B2C-bérlőre való váltáshoz a Címtárak + előfizetések menüből.
- Keresse meg és válassza ki az Azure AD B2C-t.
- A Szabályzatok területen válassza az Identity Experience Framework lehetőséget.
- Válassza az Egyéni szabályzat feltöltése lehetőséget.
- Töltse fel a korábban módosított bővítményfájlt.
5.2 Az egyéni szabályzat tesztelése a Futtatás most funkcióval
- Válassza ki a feltöltött szabályzatot, majd válassza a Futtatás most lehetőséget.
- Regisztrálnia kell egy e-mail-címmel.
Dinamikus egyéni laptartalom URI-tartalmának konfigurálása
Egyéni Azure AD B2C-szabályzatok használatával elküldhet egy paramétert az URL-elérési úton vagy egy lekérdezési sztringben. A paraméterek a HTML-végpontnak való átadásával dinamikusan változtathatja az oldal tartalmát. Például megváltoztathatja a háttérképet az Azure AD B2C regisztrációs vagy bejelentkezési oldalán egy olyan paraméter alapján, amelyet a web- vagy mobilalkalmazásából ad át. A paraméter lehet bármely jogcímfeloldó, például az alkalmazásazonosító, a nyelvi azonosító vagy az egyéni lekérdezési sztring paraméter, például campaignId
.
Lekérdezési sztringparaméterek küldése
Lekérdezési sztringparaméterek küldéséhez a függő entitás házirendjében adjon hozzá egy ContentDefinitionParameters
elemet az alább látható módon.
<RelyingParty>
<DefaultUserJourney ReferenceId="SignUpOrSignIn" />
<UserJourneyBehaviors>
<ContentDefinitionParameters>
<Parameter Name="campaignId">{OAUTH-KV:campaignId}</Parameter>
<Parameter Name="lang">{Culture:LanguageName}</Parameter>
<Parameter Name="appId">{OIDC:ClientId}</Parameter>
</ContentDefinitionParameters>
</UserJourneyBehaviors>
...
</RelyingParty>
A tartalomdefinícióban módosítsa a következő értékre LoadUri
https://<app_name>.azurewebsites.net/home/unified
: . Az egyéni szabályzatnak ContentDefinition
a következő kódrészlethez hasonlóan kell kinéznie:
<ContentDefinition Id="api.signuporsignin">
<LoadUri>https://<app_name>.azurewebsites.net/home/unified</LoadUri>
...
</ContentDefinition>
Amikor az Azure AD B2C betölti a lapot, hívást kezdeményez a webkiszolgáló végpontjához:
https://<app_name>.azurewebsites.net/home/unified?campaignId=123&lang=fr&appId=f893d6d3-3b6d-480d-a330-1707bf80ebea
Dinamikus laptartalom URI-ja
A tartalom a használt paraméterek alapján különböző helyekről is lekérehető. A CORS-kompatibilis végponton állítson be egy mappastruktúrát a tartalom üzemeltetéséhez. A tartalmat például a következő struktúrában rendszerezheti. Gyökérmappa /mappa nyelvenként/html-fájljainként. Az egyéni lap URI-ja például a következőképpen nézhet ki:
<ContentDefinition Id="api.signuporsignin">
<LoadUri>https://contoso.blob.core.windows.net/{Culture:LanguageName}/myHTML/unified.html</LoadUri>
...
</ContentDefinition>
Az Azure AD B2C elküldi a nyelv két betűs ISO-kódját francia fr
nyelven:
https://contoso.blob.core.windows.net/fr/myHTML/unified.html
Példasablonok
A felhasználói felület testreszabásához mintasablonokat itt talál:
git clone https://github.com/azure-ad-b2c/html-templates
Ez a projekt a következő sablonokat tartalmazza:
A minta használata:
Klónozza az adattárat a helyi gépen. Válasszon egy sablonmappát
/AzureBlue
vagy/MSA
/classic
.Töltse fel a sablonmappában és a mappában lévő összes fájlt a
/src
Blob Storage-ba az előző szakaszokban leírtak szerint.Ezután nyissa meg az egyes
\*.html
fájlokat a sablonmappában. Ezután cserélje le azhttps://login.microsoftonline.com
URL-címek összes példányát a 2. lépésben feltöltött URL-címre. Például:A következőről:
https://login.microsoftonline.com/templates/src/fonts/segoeui.WOFF
Címzett:
https://your-storage-account.blob.core.windows.net/your-container/templates/src/fonts/segoeui.WOFF
Mentse a
\*.html
fájlokat, és töltse fel őket a Blob Storage-ba.Most módosítsa a szabályzatot, és mutasson a HTML-fájlra a korábban említett módon.
Ha hiányzó betűtípusokat, képeket vagy CSS-t lát, ellenőrizze a hivatkozásokat a bővítményszabályzatban és a
\*.html
fájlokban.
Vállalati védjegyezési eszközök használata egyéni HTML-ben
Ha egyéni HTML-ben szeretné használni a céges védjegyzési objektumokat, adja hozzá a következő címkéket a <div id="api">
címkén kívül. A kép forrása helyett a háttérkép és a szalagcím emblémája látható.
<img data-tenant-branding-background="true" />
<img data-tenant-branding-logo="true" alt="Company Logo" />
Következő lépések
Megtudhatja, hogyan engedélyezheti az ügyféloldali JavaScript-kódot.
Visszajelzés
https://aka.ms/ContentUserFeedback.
Hamarosan elérhető: 2024-ben fokozatosan kivezetjük a GitHub-problémákat a tartalom visszajelzési mechanizmusaként, és lecseréljük egy új visszajelzési rendszerre. További információ:Visszajelzés küldése és megtekintése a következőhöz: