現代化網站品牌和風格
部落格地址:http://blog.csdn.net/FoxDave
SharePoint現代化使用者介面處理品牌風格的方式跟經典SharePoint不同;特別地,它忽略了自定義母版頁或外部CSS配置,這些在現代化網站並不可用。我們可以選擇繼續保留這些內容,它們仍然能夠對經典的使用者介面頁面起作用,但是切換回預設母版頁並移除外部樣式顯然是更乾淨整潔的方式。
除了自定義母版頁和外部樣式設定之外,我們可能還使用了經典的自定義主題。這些經典的自定義主題在現代化使用者介面下仍然能工作,但是面向未來更好的方式是新的租戶控制的SharePoint主題,同樣也能在新舊兩種模式下工作。
檢測使用了自定義母版頁和外部樣式的網站
進行檢測推薦使用之前介紹的掃描工具:SharePoint “Modern” user interface experience scanner。它會在我們的租戶範圍內對所有網站進行深度的分析,建立相應的報告告知我們關於不相容母版頁和外部樣式的具體細節,我們可以基於報告去修復這些網站。
復原到預設設定
下面是PnP(Patterns and Practices)的PowerShell指令碼用來複原到預設設定:
$minimumVersion = New-Object System.Version("2.24.1803.0")
if (-not (Get-InstalledModule -Name SharePointPnPPowerShellOnline -MinimumVersion $minimumVersion -ErrorAction Ignore))
{
Install-Module SharePointPnPPowerShellOnline -MinimumVersion $minimumVersion -Scope CurrentUser
}
Import-Module SharePointPnPPowerShellOnline -DisableNameChecking -MinimumVersion $minimumVersion
Connect-PnPOnline -Url "<your site url>"
# Set out-of-the-box master page
Set-PnPMasterPage -MasterPageSiteRelativeUrl _catalogs/masterpage/seattle.master -CustomMasterPageSiteRelativeUrl _catalogs/masterpage/seattle.master
# Remove the alternate CSS setting
$web = Get-PnPWeb -Includes AlternateCssUrl
$web.AlternateCssUrl = ""
$web.Context.ExecuteQuery()
使用租戶控制的SharePoint主題
SharePoint提供了一些列拆箱即用的預設主題供我們使用,但是如果我們想要推廣我們的公司品牌,我們應該建立自己的公司主題並隱藏預設的主題。配置完成後,使用者只能從我們配置的主題中進行選擇,我們可以通過程式設計的方式將這種主題設定作為網站現代化的一部分。
新增一個SharePoint公司主題
下面是PnP的PowerShell指令碼用來演示如何新增一個SharePoint公司主題:
$minimumVersion = New-Object System.Version("2.24.1803.0")
if (-not (Get-InstalledModule -Name SharePointPnPPowerShellOnline -MinimumVersion $minimumVersion -ErrorAction Ignore))
{
Install-Module SharePointPnPPowerShellOnline -MinimumVersion $minimumVersion -Scope CurrentUser
}
Import-Module SharePointPnPPowerShellOnline -DisableNameChecking -MinimumVersion $minimumVersion
Connect-PnPOnline -Url "<your tenant admin url>"
# Define your company theme colors
$themepalette = @{
"themePrimary" = "#00ffff";
"themeLighterAlt" = "#f3fcfc";
"themeLighter" = "#daffff";
"themeLight" = "#affefe";
"themeTertiary" = "#76ffff";
"themeSecondary" = "#39ffff";
"themeDarkAlt" = "#00c4c4";
"themeDark" = "#009090";
"themeDarker" = "#005252";
"neutralLighterAlt" = "#f8f8f8";
"neutralLighter" = "#f4f4f4";
"neutralLight" = "#eaeaea";
"neutralQuaternaryAlt" = "#dadada";
"neutralQuaternary" = "#d0d0d0";
"neutralTertiaryAlt" = "#c8c8c8";
"neutralTertiary" = "#a6a6a6";
"neutralSecondaryAlt" = "#767676";
"neutralSecondary" = "#666666";
"neutralPrimary" = "#333";
"neutralPrimaryAlt" = "#3c3c3c";
"neutralDark" = "#212121";
"black" = "#000000";
"white" = "#fff";
"primaryBackground" = "#fff";
"primaryText" = "#333"
}
# Add the company theme
Add-PnPTenantTheme -Identity "CustomCompanyTheme" -Palette $themepalette -IsInverted:$false
使用我們的SharePoint公司主題
我們可以通過下面的指令碼來設定使用我們的公司主題:
$minimumVersion = New-Object System.Version("2.24.1803.0")
if (-not (Get-InstalledModule -Name SharePointPnPPowerShellOnline -MinimumVersion $minimumVersion -ErrorAction Ignore))
{
Install-Module SharePointPnPPowerShellOnline -MinimumVersion $minimumVersion -Scope CurrentUser
}
Import-Module SharePointPnPPowerShellOnline -DisableNameChecking -MinimumVersion $minimumVersion
Connect-PnPOnline -Url "<your site url>"
# Set the company theme
Set-PnPWebTheme -Theme "CustomCompanyTheme"
相關文章
- 網站換風格了呀網站
- Cydia介面風格視覺更新 更扁平化更現代化視覺
- 現代C++風格的新元素C++
- 極簡風格電商網站案例網站
- 現代化SharePoint經典網站網站
- Quantcast:現代品牌和AI報告ASTAI
- 構建現代化網站的 20 個技巧網站
- 構建現代化網站的20個技巧網站
- 現代化SharePoint網站使用者介面網站
- 通過自動化和現代化實現網路優化優化
- 頂級暗黑風格Web網站設計欣賞Web網站
- 玩遍部落格網站,我整理了 Hexo 及其流行的風格主題網站Hexo
- 酷站欣賞:8個簡約風格的網站作品網站
- GitHub Pages + Hexo搭建個人部落格網站-github風格-採坑記錄GithubHexo網站
- ModStartBlog 現代化個人部落格系統
- 部落格網站網站
- 如何用自己喜歡的 CSS 風格重置網站的樣式CSS網站
- 豐富的詩詞資源!一個現代化詩詞學習網站!學習網站
- 現代化自定製 - 列表和庫部分
- Typora 程式碼塊Mac風格化Mac
- 被B站“一眼相中”,《重明鳥》製作人郭振談中國風遊戲的現代化演繹遊戲
- WebApp風雲起:站長在網站移動化大潮中如何角力?WebAPP網站
- [譯] 簡單的響應式現代 CSS 網格佈局CSS
- cxword網站加部落格網站
- 軟體架構風格——閉環架構風格(過程風格)架構
- 【寫實與風格化】技術概述
- 如何給您的企業搭建現代化形象網站網站
- 使用 github 和 Deno Deploy 搭建一個部落格網站Github網站
- 軟體架構風格——倉庫風格架構
- 個人網站和部落格賺錢方式 (如何把WordPress網站變成一門生意)網站
- 品牌VI設計與網站設計網站
- 25個細緻微妙的扁平化2.0風格網頁設計網頁
- 基於MySql和Sails.js的RESTful風格的api實現MySqlAIJSRESTAPI
- 最大化地使用現代化列表和庫
- 全棧“食”代:用 Django + Nuxt 實現美食分享網站(上)全棧DjangoUX網站
- 基於 Laravel 模組化現代化個人部落格系統 ModStartBlog v8.4.0Laravel
- 實現企業網路現代化的5個步驟
- Midjourney|文心一格prompt教程[Text Prompt(上篇)]:品牌log、App、徽章、插畫、頭像場景生成,各種風格選擇:科技風、運動風APP