现代化网站品牌和风格

简介:

博客地址: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"
相关文章
|
4天前
|
机器学习/深度学习 编解码 人工智能
融合技术与美学:响应式网站设计与开发
在当今数字化时代,越来越多的人通过各种设备访问互联网。响应式网站设计与开发成为了满足不同设备和屏幕尺寸需求的关键。本文将探讨响应式网站设计的重要性、实现方法以及未来的趋势。
|
12月前
|
搜索推荐
如何用ChatGPT搭建品牌文本体系?(品牌名+slogan+品牌故事)
该场景对应的关键词库(26个): 品牌名、奶茶、中文名、情感联想度、饮料、价值观/理念、发音、slogan、产品功能导向、行业性质导向、经营理念导向、消费者观念导向、口语化、修辞手法、品牌故事、创始人初心品牌故事、里程碑事件故事、产品初心故事、时间、地点、人物、事件、结果、品牌定位、个性、品类价值
285 0
SEEConf 2022 品牌的创意编程
SEEConf 2022 品牌的创意编程
|
存储 小程序 物联网
设计师都在看的全球设计网站,你居然还不知道!
设计师都在看的全球设计网站,你居然还不知道!
122 0
设计师都在看的全球设计网站,你居然还不知道!
|
安全 搜索推荐 机器人
品牌电商建站:设计师的审美起决定性作用
随着电商的迅速发展,越来越多的电商品牌意识到符合定位的品牌网站建设重要性,创建完美的电商也成了众多企业的追求。北京六翼信息技术有限公司开发指出,设计师的审美起决定性作用,我们将看看是什么造就了完美的电子商务商店页面,以及如何在您自己的电子商务商店页面设计中借鉴这些成功的关键。
品牌电商建站:设计师的审美起决定性作用
3D 产品摄影解决方案
本文研究全球及中国市场3D 产品摄影解决方案现状及未来发展趋势,侧重分析全球及中国市场的主要企业,同时对比北美、欧洲、中国、日本、东南亚和印度等地区的现状及未来发展趋势
|
存储 人工智能 运维
行业云的未来形态:应用程序商店风格的B2B市场
行业云(Industrial Cloud),是指由行业内或某个区域内起主导作用或者掌握关键资源的组织建立和维护的,以内部或公开的方式,向行业内部组织和公众提供有偿或无偿服务的云计算平台。本文分析和介绍在云原生技术的发展背景之上,通过建设B2B市场模式的行业云建设方法。
1180 0
行业云的未来形态:应用程序商店风格的B2B市场
|
视频直播
短视频系统源码——“潮流”标签之下蕴藏哪些实用功能
随着某音某手的普及,短视频似乎已经融入了我们的生活之中,成为了生活里的一部分。短视频不仅能给我们提供不同的乐趣,还能够作为电商带货的一种新渠道。在各方面因素的助力下,短视频系统源码的发展之快,一度被作为年轻人的“潮流”,而后越来越多不同年龄的人也融入到乐短视频APP之中,那么“潮流”的标签之下都蕴藏了哪些实用的功能。
短视频系统源码——“潮流”标签之下蕴藏哪些实用功能
|
测试技术 UED
[译] 可口可乐自由风格售卖亭界面用户体验的回顾和重新设计
本文讲的是[译] 可口可乐自由风格售卖亭界面用户体验的回顾和重新设计,我自己之前从来没有用过这个机器,所以我需要理解它是如何工作的,以及它的使用环境。观察这个机器在不同的餐馆和电影院中如何被使用提供了重要的场景。
1221 0