升級至 SharePoint 2013 時可能發生的品牌問題

適用于:yes-img-132013 no-img-16 2016no-img-192019 no-img-seSubscription Edition no-img-sopSharePoint in Microsoft 365

SharePoint 2013 推出更輕量、快速和流暢的新使用者介面。 此使用者介面使用新 CSS 樣式、佈景主題和主版頁面建置。 若要取得這個全新體驗,您必須升級到新的使用者介面。 但是用作支援新使用者介面的重大變更,可能破壞一些你使用自訂品牌的案例之升級本文。

在 SharePoint 2010 產品,您可能用數個不同的方式之一建立您網站的品牌:

  • 將自訂樣式表套用至您的網站,覆寫 SharePoint 預設樣式。

  • 將自訂的佈景主題 (THMX 檔案) 套用到您的網站。

  • 複製和變更隨附 SharePoint 2013 的主版頁面。

  • 在發佈網站中建立全新自訂主版頁面,而自訂主版頁面使用自訂樣式,並由自訂頁面配置參考。

當您將網站集合升級至 SharePoint 2013,這些自訂類型不會如以往般運作,因為預設 CSS 樣式、佈景主題和主版頁面已變更。 相反,您必須再次建立您的自訂品牌。 這需要您使用 SharePoint 2013 中可用的新樣式、佈景主題或主版頁面,然後將重新建立的設計套用至已升級的網站集合。

為了建立更快速和更流暢的使用者介面,並使後續更新更可預測,必須變更預設的 SharePoint 樣式、佈景主題和主版頁面。

由於此原因,如果您的網站集合包含自訂品牌,我們建議您在更新前,先建立評估網站集合,讓您可以在 SharePoint 2013 環境裡測試和重新建立自訂品牌。 如需評估網站集合的詳細資訊,請參閱 升級網站集合

以下章節列出您升級至 SharePoint 2013 時可能發生的品牌問題。

自訂 CSS

將自訂品牌套用至 SharePoint 2010 產品 網站的常見做法是建立包含樣式的 CSS 檔案,覆寫預設 SharePoint 樣式。

為了使新的使用者介面更快速和流暢,SharePoint 2013 在 CSS 的實作方法上推出基本變更:

  • 降低 CSS 檔案大小。

  • 限制 CSS 選取器的巢狀結構。

  • 在任何可能情況使用 CSS 繼承。

  • 只在一個位置定義類別。

  • 在 CSS 檔案中,相關類別會分組。

  • 不會使用內嵌樣式和 !important 宣告,因為它們無法覆寫。

  • 樣式使用一致的結構和命名慣例。

在 SharePoint 2013 中,樣式使用一致的結構和命名慣例。

命名組件 MS- <功能 > - <名稱>
說明
表示這是 Microsoft 類別。
與此項目相關的功能名稱,或如果用作核心使用者界面一部份就是「核心」。
項目的描述名稱,例如標題、連結等等

由於這些 SharePoint 2013 如何實作 CSS 的變更,當您更新時,自訂 CSS 樣式將不會套用至您的網站。 若要解決此問題,您應該先建立評估網站集合,然後用該網站作環境,在裡面識別您要覆寫的新 SharePoint 2013 樣式。 為這些樣式建立 CSS 檔案,然後將 CSS 套用至您的已升級網站。

自訂佈景主題

在 SharePoint 2010 產品 中,您可以使用 Office 程式 (例如 PowerPoint 2010) 建立 THMX 檔案。 然後您可以將該佈景主題檔案上傳至 SharePoint 2010 產品,並將佈景主題套用到您的網站。

在 SharePoint 2013 中,主題設定引擎已有改善,讓佈景主題更快速和更有彈性,而且可以更輕鬆地升級佈景主題,向前發展。 佈景主題模型在 CSS 中使用註解式標記,然後根據使用者選取的字型和色彩配置等參數,取代部分 CSS。 SharePoint 2013 中的佈景主題由 XML 檔案定義:

  • SPColor.xml 定義調色盤,其中的糟現在有語意名稱,讓您更清楚知道變更顏色值時會影響什麼使用者介面元素。 此外,佈景主題現在支援設定不透明度。

  • SPFont.xml 定義字型配置並支援多種語言、Web-safe 字型和 Web 字型。

但將 THMX 檔案從 SharePoint 2010 產品 升級至 SharePoint 2013 沒有支援。 如果您將自訂佈景主題套用至 SharePoint 2010 產品 網站,當您升級至 SharePoint 2013,佈景主題檔案會留在原處。 但佈景主題不會再套用至網站,而網站會還原至預設佈景主題。

若要解決這個問題,您應該先建立評估網站集合,然後使用 SharePoint 2013 中的新佈景主題功能再次建立佈景主題。 如需新佈景主題的詳細資訊,請參閱以下在 MSDN 上的文章:

重要事項

[!重要事項] 下一步,如果您想使用自訂品牌,而如果您想品牌在未來升級後可以運作,我們建議您使用佈景主題實作設計。 未來有可用的更新時,佈景主題會有升級支援。 如果佈景主題在您的案例不能運作,或您需要有更廣泛的品牌,我們建議您搭配設計管理員使用發佈網站。 但您需要明白,如果您投入建置自訂主版頁面和頁面配置,在每次 SharePoint 升級期間或之後,您可能需要重新製作或更新您的設計檔案。

複製和變更隨附於 SharePoint 2013 的主版頁面

在 SharePoint 2010 產品 中,對使用者介面作較小自訂的常見方法,是複製和變更隨附於 SharePoint 2010 產品 的主版頁面。 例如,您可以變更主版頁面以移除功能或對使用者隱藏功能。

當您將 SharePoint 2010 產品 網站升級至 SharePoint 2013,主版頁面會重設為使用 SharePoint 2013 中的預設主版頁面。 因此升級之後,您的網站會顯示其自訂品牌。 在 SharePoint 2010 產品 中建立的自訂主版頁面仍然在網站內,但您不應該將舊主版頁面套用至新網站,因為新網站不會如預期般顯示。

為了支援 SharePoint 2013 中的新使用者介面,已變更預設主版頁面。 基於這個理由,您無法將於 SharePoint 2010 產品 建立的主版頁面套用至 SharePoint 2013 中的網站。

若要解決此問題,您應該先建立一個評估網站集合,然後再於 SharePoint 2013 網站再次建立主版頁面。 當您確認新主版頁面如預期般運作後,將主版頁面移至新網站集合並套用至網站。 如果網站是發佈網站,您可以使用設計管理員匯出,然後作為設計套件一部分匯入。 否則,您可以將主版頁面作為沙箱解決方案一部分移動,或將檔案上傳至主版頁面圖庫。

重要事項

[!重要事項] SharePoint Foundation 2013 不支援發佈網站。 您需要 SharePoint 2013 才能使用發佈網站。

自訂發佈網站中的主版頁面

如果您想要有完全有品牌的網站,例如企業通訊內聯網,您要使用具有完全自訂主版頁面的發佈網站,和附加在自訂主版頁面的自訂頁面配置。

當您將 SharePoint 2010 產品 網站升級至 SharePoint 2013,主版頁面會重設為使用 SharePoint 2013 中的預設主版頁面。 因此升級之後,您的網站不會顯示其自訂品牌。 在 SharePoint 2010 產品 中建立的自訂主版頁面和頁面配置仍然在網站內,但您不應該將舊主版頁面套用至新網站,因為新網站不會如預期般顯示。

若要解決此問題,您應該先建立同為發佈網站的評估網站集合,然後再於 SharePoint 2013 網站再次建立主版頁面。 當您確認新主版頁面如預期般運作後,請完成下列步驟:

  1. 將主版頁面作為設計套件的一部分匯出。

  2. 將設計套件匯入至新網站集合,

  3. 將新主版頁面套用至網站。

自訂主版頁面上的內容預留位置

重要事項

[!重要事項] 如果您的自訂主版頁面包含自訂內容預留位置,而且如果自訂頁面版面配置也包含此自訂內容預留位置,則錯誤可能會阻止您的網站在升級之後有任何呈現。 相反地,升級之後,您可能會看見錯誤訊息:「發生未預期的錯誤」。

若要判斷您是否有這個問題,您可以建立也是發佈網站的評估網站集合,然後將主版頁面設為隨附於 SharePoint 2013 的主版頁面。 如果網站仍會顯示,則您沒有這個問題。 如果網站不會顯示,而您收到具有關聯性 ID 的「未預期的錯誤」,您很可能有這個問題。

若要解決這個問題,請執行下列動作:

  1. 建立同為發佈網站集合的評估網站集合。

  2. 建立 SharePoint 2013 主版頁面。

  3. 將自訂內容預留位置新增至 2013 主版頁面。

  4. 將新主版頁面套用至網站。

  5. 建立不包含自訂內容預留位置的頁面配置。

    頁面配置會與套用至網站的新主版頁面相關聯。

  6. 將所有使用舊頁面配置的頁面變更為使用新頁面配置。

    您可以在瀏覽器中個別手動編輯每個頁面和使用功能區上的選項,或您可以使用 SharePoint 的用戶端物件模型來以編程方式更新頁面。

  7. 刪除包含自訂內容預留位置的舊頁面配置。

我們建議您不要將自訂內容預留位置新增至自訂主版頁面或頁面配置。

另請參閱

其他資源

在 SharePoint 2013 中疑難排解網站集合的升級問題

檢閱升級到 SharePoint 2013 的網站集合

Upgrade a site collection to SharePoint 2013

Run site collection health checks in SharePoint 2013

SharePoint 2013 中的設計管理員概觀