Поделиться через


Преобразование HTML-файла в эталонную страницу SharePoint

Важно!

Такая расширяемость доступна только для классического интерфейса SharePoint. Эту возможность нельзя использовать вместе с современным интерфейсом в SharePoint Online, например на сайтах для общения. Мы больше не рекомендуем использовать классический интерфейс и эти методы применения фирменной символики.

Благодаря Дизайнеру вы можете конвертировать HTML-файл в эталонную страницу SharePoint — MASTER-файл. После преобразования .html файл и главная страница связаны, поэтому при редактировании и сохранении файла .html изменения синхронизируются со связанной главной страницей.

Общие сведения о преобразовании эталонной страницы

Благодаря Дизайнеру вы можете конвертировать HTML-файл в эталонную страницу SharePoint — MASTER-файл. После преобразования .html файл и главная страница связаны, поэтому при редактировании и сохранении файла .html изменения синхронизируются со связанной главной страницей.

Зачем преобразовывать HTML-файл, а не создавать MASTER-файл с нуля? В SharePoint эталонные страницы работают точно так же, как в ASP.NET, но в SharePoint для корректного отображения эталонной страницы также необходимо, чтобы на странице присутствовали определенные элементы, например элементы управления и заполнители контента, относящиеся к SharePoint. Чтобы использовать "Дизайнер" для преобразования HTML-файла в полноценную эталонную страницу SharePoint, знание разметки ASP.NET или SharePoint не потребуется. Вместо этого можно сосредоточиться на разработке сайта с помощью HTML, CSS и JavaScript.

При преобразовании HTML-файла в эталонную страницу происходит следующее:

  • В коллекции эталонных страниц создается MASTER-файл с таким же именем, как у HTML-файла.

  • В MASTER-файл добавляется вся разметка, необходимая SharePoint, поэтому эталонная страница отображается правильно.

  • В исходный HTML-файл добавляется разметка, например комментарии, теги <div>, фрагменты кода и заполнители контента.

  • HTML-файл и эталонная страница связываются, поэтому в дальнейшем при сохранении внесенных в HTML-файл изменений, этот файл будет синхронизирован с MASTER-файлом.

Примечание.

Синхронизация проходит только в одном направлении. Изменения главной страницы .html синхронизируются со связанным MASTER-файлом, но если вы решили изменить этот файл напрямую, изменения не синхронизируются с файлом .html. Каждая главная страница HTML (и каждый макет страницы .html) имеет свойство с именем Связанный файл , которое по умолчанию имеет значение True , что создает связь и синхронизацию между файлами.

Если у вас есть пара связанных файлов (HTML и MASTER) и вы изменяете MASTER-файл, не нарушая связь, внесенные изменения будут сохранены, но вы не сможете отметить или опубликовать этот файл, то есть по большому счету эти изменения не сохраняются. Любые изменения в файле .html переопределяют MASTER-файл. Если вы возвращаете или публикуете файл .html, изменения файла .html переопределяют все изменения, внесенные в MASTER-файл. Изменения, внесенные в MASTER-файл, будут изменены.

Если вы являетесь разработчиком и вам удобно работать с ASP.NET, вы можете разорвать связь между файлами и работать только с MASTER-файлом. Чтобы разорвать связь между файлом .html и MASTER-файлом, в диспетчере конструкторов выберите Изменить свойства для файла .html, а затем снимите флажок Связанный файл . Позже вы можете повторно связать файлы, изменив свойства и установив этот флажок. В этом случае файл .html снова перезапишет ФАЙЛ MASTER, а изменения, внесенные в MASTER-файл, будут потеряны.

Подготовка HTML-файла к преобразованию

Прежде чем преобразовывать HTML-файл, ознакомьтесь с советами и рекомендациями ниже.

  • Рассмотрим модель страниц в SharePoint. Дополнительные сведения см. в статье Обзор модели страниц SharePoint. При создании HTML-макетов для сайта у вас наверняка будет несколько HTML-файлов для страниц разных типов, например страниц со статьями или страниц категорий, содержащих веб-части, в которых отображаются элементы определенной категории из каталога. Только один HTML-файл будет преобразован в эталонную страницу. HTML-файл можно преобразовать в эталонную страницу, но невозможно преобразовать непосредственно в макет страницы, так как для этого необходимы поля страницы.

  • Убедитесь, что HTML-файл совместим с форматом XML. Для успешного преобразования HTML-файл должен быть совместимым с XML. К сожалению, это требование переопределяет некоторые стандарты HTML 5. Например, в HTML 5 можно указать значение doctype в нижнем регистре, но в XML значение doctype следует указывать прописными буквами. Кроме того, из HTML-файла следует удалить теги <form>. Пропустите HTML-файл через внешнее средство проверки XML, чтобы обнаружить ошибки XML перед преобразованием.

  • Ниже представлены важные рекомендации, связанные со ссылками CSS.

    • Не помещайте блоки <style> в тег <head>. Эти стили удаляются во время преобразования. Вместо этого ссылайтесь в HTML-файле на внешний CSS-файл.

    • Добавьте ms-design-css-conversion="no" в <тег ссылки> CSS, если вы используете веб-шрифт.

    • Будьте осторожны, применяя стили к общим HTML-тегам, например <body>, <div> и <img>. Все содержимое оформления SharePoint, включая ленту, находится внутри тега <body>. Стили, которые обычно применялись бы к тегу <body>, следует применять к тегу <div id="s4-bodyContainer">, который SharePoint использует для основного текста страницы. Кроме того, SharePoint использует множество изображений, на которые влияют стили, применяемые к тегу <img>.

    • Многие дизайнеры настраивают стиль навигации, применяя классы к элементам <ul> и <li>. Однако в SharePoint используется динамический элемент навигации, который можно добавить на эталонную страницу из коллекции фрагментов кода. По умолчанию к элементам навигации SharePoint применены стили, которые необходимо переопределять.

  • Ниже указаны возможные проблемы с именованием файлов.

    • Файлы Index.html и Index.htm будут иметь один и тот же MASTER-файл.

    • Файлы Design/Index.html и Design/SubDesign/Index.html будут преобразованы в отдельные MASTER-файлы, но они оба будут отображаться в списке эталонной странице в Дизайнере как Index.html. Чтобы устранить неоднозначность, щелкните каждый файл или нажмите кнопку с многоточием, чтобы увидеть полный путь.

  • Если вы добавляете мини-приложение JavaScript, убедитесь, что открывающий тег <script> находится на отдельной строке.

  
<script>
(function( …

Не помещайте их в одну строку, как показано ниже.

  
<Script> (function( …
  • Ссылка на библиотеку JQuery (внешняя ссылка) должна находиться перед тегом </head>.

Преобразование HTML-файла в эталонную страницу

Перед преобразованием HTML-файла необходимо отправить все файлы оформления, включая HTML-файл. Дополнительные сведения см. в разделе Практическое руководство. Сопоставление сетевого диска с коллекцией главных страниц SharePoint.

Преобразование HTML-файла в MASTER-файл

  1. Перейдите на сайт публикации.

  2. В правом верхнем углу страницы выберите пункт Параметры, а затем выберите Дизайнер.

  3. Откройте "Дизайнер" и в области навигации слева выберите команду Изменить главные страницы.

  4. Выберите пункт Преобразование HTML-файла в эталонную страницу SharePoint.

  5. В диалоговом окне Выбор актива найдите и выберите преобразуемый HTML-файл.

    Примечание.

    При отправке файлов разработки сохраните все файлы, связанные с одним оформлением, в собственной папке в коллекции главных страниц. Когда выполняется копирование папки разработки на подключенный сетевой диск, коллекция эталонных страниц сохраняет всю созданную вами структуру папок.

  6. Нажмите кнопку Вставить.

    На этом этапе SharePoint преобразует HTML-файл в MASTER-файл с таким же именем.

    В "Дизайнере" для вашего HTML-файла отобразится столбец "Состояние" с одним из двух возможных состояний:

  • Предупреждения и ошибки.

  • Преобразование выполнено успешно.

  1. Перейдите по ссылке в столбце "Состояние" для предварительного просмотра файла, а также ошибок или предупреждений, касающихся эталонной страницы.

    Просмотр страницы — это интерактивный просмотр главной страницы на сервере. В верхней части предварительного просмотра отображаются все предупреждения или ошибки, которые может потребоваться устранить, изменив файл .html в редакторе HTML. Ошибки должны быть исправлены, прежде чем предварительная версия будет правильно отображать главную страницу.

    Дополнительные сведения об устранении ошибок и предупреждений см. в статье Практическое руководство. Устранение ошибок и предупреждений при предварительном просмотре страницы в SharePoint.

    Дополнительные сведения о предварительном просмотре главной страницы с разными страницами см. в разделе Практическое руководство. Изменение страницы предварительного просмотра в SharePoint Design Manager.

    На странице предварительного просмотра также есть ссылка "Фрагменты кода" в правом верхнем углу. Эта ссылка ведет к коллекции фрагментов кода, где можно начать заменять статические или временные элементы управления в оформлении на динамические элементы управления SharePoint. Дополнительные сведения см. в статье Фрагменты кода в компоненте "Дизайнер" SharePoint.

  2. Чтобы устранить ошибки, измените файл .html, который находится непосредственно на сервере, с помощью редактора HTML, чтобы открыть и изменить файл .html на сопоставленном диске. При каждом сохранении файла .html все изменения синхронизируются с соответствующим MASTER-файлом.

  3. После успешного предварительного просмотра эталонной страницы в HTML-файл будет добавлен тег <div>. Возможно, чтобы увидеть тег <div>, потребуется прокрутить страницу вниз.

    Этот тег <div> является основным блоком контента. Он находится в заполнителе контента с именем ContentPlaceHolderMain. Во время выполнения, когда посетитель просматривает ваш сайт и запрашивает страницу, в этот заполнитель добавляется контент из макета страницы для соответствующей области содержимого. Этот тег <div> следует поместить там, где должны отображаться макеты страниц на эталонной странице.

    Если HTML-файл содержит статический или временный контент в основном тексте страницы, начинается процесс удаления этого статического контента с эталонной HTML-страницы и применения этих стилей к другим элементам модели страниц SharePoint, например макетам страниц, полям страниц, фрагментам кода и шаблонам отображения. Пример см. в разделе Практическое руководство. Создание макета страницы в SharePoint.

Общие сведения об HTML-файле после преобразования

При преобразовании файла .html в главную страницу в файл .html добавляется много строк разметки. Вы можете спокойно игнорировать большую часть этой разметки, и большая ее часть не будет отображаться в окончательной разметке сайта при просмотре источника в браузере, но эта разметка имеет решающее значение для преобразования файла .html в master-файл, который фактически использует SharePoint. При каждом сохранении изменений в .html-файле эта разметка SharePoint позволяет вносить те же изменения в связанный с ним MASTER-файл в фоновом режиме.

Добавляемая разметка включает теги, расположенные до тега <head> и в нем, фрагменты кода и заполнители контента. Большая часть разметки заключена в теги комментариев. Каждый раз при сохранении изменений в HTML-файле в процессе преобразования вырезаются комментарии для использования заключенной в них разметки ASP.NET.

Типы разметки

Ниже представлены типы разметки, которые добавляются в HTML-файл.

  • Свойства документа. Тег <mso> содержит метаданные SharePoint, в том числе сведения о самом файле и некоторые свойства, необходимые для успешного преобразования в MASTER-файл.
  
<mso:CustomDocumentProperties>
<mso:HtmlDesignFromMaster msdt:dt="string"></mso:HtmlDesignFromMaster>
<mso:HtmlDesignStatusAndPreview msdt:dt="string">http://[server_name]/sites/PubSite/_catalogs/masterpage/[site_name]/index.html, Conversion successful.</mso:HtmlDesignStatusAndPreview>
<mso:ContentTypeId msdt:dt="string">0x0101000F1C8B9E0EB4BE489F09807B2C53288F0054AD6EF48B9F7B45A142F8173F171BD10003D357F861E29844953D5CAA1D4D8A3A0084F0F9C7FCB65541A59990D173DA60FA</mso:ContentTypeId>
<mso:HtmlDesignAssociated msdt:dt="string">1</mso:HtmlDesignAssociated>
<mso:HtmlDesignConversionSucceeded msdt:dt="string">True</mso:HtmlDesignConversionSucceeded>
</mso:CustomDocumentProperties>
  • Регистрация пространства имен SharePoint. Тег <SPM> ("разметка SharePoint") содержит строку, регистрирующую пространство имен SharePoint.
  
<!--SPM:<%@Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"%>-->
        <!--SPM:<%@Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"%>-->
  • Комментарии. Теги <CS> и <CE> (начало и конец комментария) игнорируются во время преобразования. Эти теги призваны помочь вам проанализировать строки разметки.
  
<!--CS: Start Page Head Contents Snippet-->
…
<!--CE: End Page Head Contents Snippet-->

  <!--CS: Start Ribbon Snippet-->
…
<!--CE: End Ribbon Snippet-->

<!--CS: Start PlaceHolderMain Snippet-->
…
<!--CE: End PlaceHolderMain Snippet-->
  • Фрагменты кода. Теги <MS> и <ME> (начало и конец разметки) обозначают начало и конец элемента управления SharePoint или фрагмента кода. Фрагмент кода — это элемент управления SharePoint, добавляющий функции SharePoint на страницу. Вы можете добавлять их самостоятельно с помощью коллекции фрагментов кода. Дополнительные сведения см. в статье Фрагменты кода в компоненте "Дизайнер" SharePoint.
  
<!--MS:<SharePoint:RobotsMetaTag runat="server">-->
        <!--ME:</SharePoint:RobotsMetaTag>-->
        <!--MS:<SharePoint:PageTitle runat="server">-->
            <!--MS:<asp:ContentPlaceHolder id="PlaceHolderPageTitle" runat="server">-->
                <!--MS:<SharePoint:ProjectProperty Property="Title" runat="server">-->
                <!--ME:</SharePoint:ProjectProperty>-->
            <!--ME:</asp:ContentPlaceHolder>-->
        <!--ME:</SharePoint:PageTitle>-->
        <!--MS:<SharePoint:StartScript runat="server">-->
        <!--ME:</SharePoint:StartScript>-->
        <!--MS:<SharePoint:CssLink runat="server" Version="15">-->
        <!--ME:</SharePoint:CssLink>-->
        <!--MS:<SharePoint:CacheManifestLink runat="server">-->
        <!--ME:</SharePoint:CacheManifestLink>-->
        <!--MS:<SharePoint:PageRenderMode runat="server" RenderModeType="Standard">-->
        <!--ME:</SharePoint:PageRenderMode>-->
        <!--MS:<SharePoint:ScriptLink language="javascript" name="core.js" OnDemand="true" runat="server" Localizable="false">-->
        <!--ME:</SharePoint:ScriptLink>-->
        <!--MS:<SharePoint:ScriptLink language="javascript" name="menu.js" OnDemand="true" runat="server" Localizable="false">-->
        <!--ME:</SharePoint:ScriptLink>-->
        <!--MS:<SharePoint:ScriptLink language="javascript" name="callout.js" OnDemand="true" runat="server" Localizable="false">-->
        <!--ME:</SharePoint:ScriptLink>-->
        <!--MS:<SharePoint:ScriptLink language="javascript" name="sharing.js" OnDemand="true" runat="server" Localizable="false">-->
        <!--ME:</SharePoint:ScriptLink>-->
        <!--MS:<SharePoint:ScriptLink language="javascript" name="suitelinks.js" OnDemand="true" runat="server" Localizable="false">-->
        <!--ME:</SharePoint:ScriptLink>-->
        <!--MS:<SharePoint:CustomJSUrl runat="server">-->
        <!--ME:</SharePoint:CustomJSUrl>-->
        <!--MS:<SharePoint:SoapDiscoveryLink runat="server">-->
        <!--ME:</SharePoint:SoapDiscoveryLink>-->
        <!--MS:<SharePoint:AjaxDelta id="DeltaPlaceHolderAdditionalPageHead" Container="false" runat="server">-->
            <!--MS:<asp:ContentPlaceHolder id="PlaceHolderAdditionalPageHead" runat="server">-->
            <!--ME:</asp:ContentPlaceHolder>-->
            <!--MS:<SharePoint:DelegateControl runat="server" ControlId="AdditionalPageHead" AllowMultipleControls="true">-->
            <!--ME:</SharePoint:DelegateControl>-->
            <!--MS:<asp:ContentPlaceHolder id="PlaceHolderBodyAreaClass" runat="server">-->
            <!--ME:</asp:ContentPlaceHolder>-->
        <!--ME:</SharePoint:AjaxDelta>-->
        <!--MS:<SharePoint:CssRegistration Name="Themable/corev15.css" runat="server">-->
        <!--ME:</SharePoint:CssRegistration>-->
        <!--MS:<SharePoint:AjaxDelta id="DeltaSPWebPartManager" runat="server">-->
            <!--MS:<WebPartPages:SPWebPartManager runat="server">-->
            <!--ME:</WebPartPages:SPWebPartManager>-->
        <!--ME:</SharePoint:AjaxDelta>-->
  • Блоки предварительного просмотра. Теги <PS> и <PE> (начало и конец предварительного просмотра) окружают раздел HTML-кода, который не следует редактировать, так как этот раздел влияет только на предварительный просмотр в ходе разработки. Эти разделы представляют собой моментальный снимок элемента управления SharePoint, вставляемого фрагментом кода. Предварительный просмотр помогает более осознанно работать с HTML-файлом в клиентском редакторе HTML. Однако изменение контента или стилей для предварительного просмотра не окажет долговременного влияния на MASTER-файл, который в конечном итоге использует SharePoint. Чтобы применить стиль к фрагменту кода, необходимо идентифицировать и переопределить стили SharePoint в пользовательской таблице CSS.
  
<!--PS: Start of READ-ONLY PREVIEW (do not modify) -->
<div class="DefaultContentBlock" style="background:rgb(0, 114, 198); color:white; width:100%; padding:8px; height:64px; overflow:hidden;">The SharePoint ribbon will be here when your file is either previewed on or applied to your site.</div>
<!--PE: End of READ-ONLY PREVIEW -->
  • Идентификаторы SharePoint Два фрагмента кода, добавленные в файл .html во время преобразования (фрагмент содержимого заголовка страницы и лента SharePoint), имеют связанный идентификатор SharePoint или идентификатор безопасности (00 и 02 соответственно). Эти идентификаторы позволяют сократить фрагменты кода и упрощают чтение HTML-кода на странице.
  
<!--SID:00 -->

<!--SID:02 {Ribbon}-->

Добавленные фрагменты кода

Важно знать о двух фрагментах кода, добавленных в файл .html. Эти фрагменты кода добавляются автоматически во время преобразования, но они могут быть недоступны для добавления из коллекции фрагментов кода.

  • Лента. Чтобы авторы контента могли создавать страницы и контент на сайте SharePoint, эталонной странице необходимы лента и "навигация по набору" — новая функция SharePoint. Лента содержится во фрагменте кода для фильтрации по ролям безопасности, поэтому когда посетитель просматривает сайт, лента видна только пользователям, прошедшим проверку подлинности, и не видна анонимным пользователям. Вы можете переместить ленту в другое место страницы или стиля, переопределив стандартные классы CSS, но не рекомендуем перемещать и менять местами компоненты (например, меню "Действия сайта") на ленте.
  
<!--MS:<SharePoint:SPSecurityTrimmedControl runat="server" AuthenticationRestrictions="AnonymousUsersOnly">-->
<!--MS:<wssucw:Welcome runat="server" EnableViewState="false">-->
<!--ME:</wssucw:Welcome>-->
<!--ME:</SharePoint:SPSecurityTrimmedControl>-->
  • ContentPlaceHolderMain. В конце тега <div id="s4-bodyContainer"> (перед закрывающим тегом </body>) в ходе преобразования вставляется заполнитель контента с именем PlaceHolderMain. Внутри этого фрагмента находится желтый тег <div> с черными границами, который отображается в представлении конструктора в редакторе HTML или в окне предварительного просмотра на сервере в компоненте "Дизайнер".

    Этот тег <div> представляет область, в которую будет добавлен контент, заданный макетами страниц и самими страницами. Фрагмент PlaceHolderMain следует переместить в ту область эталонной страницы, которую заполнят макеты страниц, — область структуры сайта, которая отличается на разных страницах сайта.

  
<!--CS: Start PlaceHolderMain Snippet-->
                    <!--SPM:<%@Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"%>-->
                    <!--MS:<SharePoint:AjaxDelta ID="DeltaPlaceHolderMain" IsMainContent="true" runat="server">-->
                        <!--MS:<asp:ContentPlaceHolder ID="PlaceHolderMain" runat="server">-->
                            <div class="DefaultContentBlock" style="border:medium black solid; background:yellow; color:black; margin:20px; padding:10px;">
            This div, which you should delete, represents the content area that your Page Layouts and pages will fill. Design your Master Page around this content placeholder.
        
                            </div>
                        <!--ME:</asp:ContentPlaceHolder>-->
                    <!--ME:</SharePoint:AjaxDelta>-->
                    <!--CE: End PlaceHolderMain Snippet-->

Справочник. Примеры разметки SharePoint, добавленной в HTML-файл

Ниже приведен пример разметки, добавленной в HTML-файл после его преобразования в эталонную страницу.

Разметка, добавленная в тег <head>


<head>
        <meta http-equiv="X-UA-Compatible" content="IE=10" />
        <!--CS: Start Page Head Contents Snippet-->
        <!--SPM:<%@Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"%>-->
        <!--SPM:<%@Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"%>-->
        <!--SID:00 -->
        <meta name="GENERATOR" content="Microsoft SharePoint" />
        <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
        <meta http-equiv="Expires" content="0" />
        <!--MS:<SharePoint:RobotsMetaTag runat="server">-->
        <!--ME:</SharePoint:RobotsMetaTag>-->
        <!--MS:<SharePoint:PageTitle runat="server">-->
            <!--MS:<asp:ContentPlaceHolder id="PlaceHolderPageTitle" runat="server">-->
                <!--MS:<SharePoint:ProjectProperty Property="Title" runat="server">-->
                <!--ME:</SharePoint:ProjectProperty>-->
            <!--ME:</asp:ContentPlaceHolder>-->
        <!--ME:</SharePoint:PageTitle>-->
        <!--MS:<SharePoint:StartScript runat="server">-->
        <!--ME:</SharePoint:StartScript>-->
        <!--MS:<SharePoint:CssLink runat="server" Version="15">-->
        <!--ME:</SharePoint:CssLink>-->
        <!--MS:<SharePoint:CacheManifestLink runat="server">-->
        <!--ME:</SharePoint:CacheManifestLink>-->
        <!--MS:<SharePoint:PageRenderMode runat="server" RenderModeType="Standard">-->
        <!--ME:</SharePoint:PageRenderMode>-->
        <!--MS:<SharePoint:ScriptLink language="javascript" name="core.js" OnDemand="true" runat="server" Localizable="false">-->
        <!--ME:</SharePoint:ScriptLink>-->
        <!--MS:<SharePoint:ScriptLink language="javascript" name="menu.js" OnDemand="true" runat="server" Localizable="false">-->
        <!--ME:</SharePoint:ScriptLink>-->
        <!--MS:<SharePoint:ScriptLink language="javascript" name="callout.js" OnDemand="true" runat="server" Localizable="false">-->
        <!--ME:</SharePoint:ScriptLink>-->
        <!--MS:<SharePoint:ScriptLink language="javascript" name="sharing.js" OnDemand="true" runat="server" Localizable="false">-->
        <!--ME:</SharePoint:ScriptLink>-->
        <!--MS:<SharePoint:ScriptLink language="javascript" name="suitelinks.js" OnDemand="true" runat="server" Localizable="false">-->
        <!--ME:</SharePoint:ScriptLink>-->
        <!--MS:<SharePoint:CustomJSUrl runat="server">-->
        <!--ME:</SharePoint:CustomJSUrl>-->
        <!--MS:<SharePoint:SoapDiscoveryLink runat="server">-->
        <!--ME:</SharePoint:SoapDiscoveryLink>-->
        <!--MS:<SharePoint:AjaxDelta id="DeltaPlaceHolderAdditionalPageHead" Container="false" runat="server">-->
            <!--MS:<asp:ContentPlaceHolder id="PlaceHolderAdditionalPageHead" runat="server">-->
            <!--ME:</asp:ContentPlaceHolder>-->
            <!--MS:<SharePoint:DelegateControl runat="server" ControlId="AdditionalPageHead" AllowMultipleControls="true">-->
            <!--ME:</SharePoint:DelegateControl>-->
            <!--MS:<asp:ContentPlaceHolder id="PlaceHolderBodyAreaClass" runat="server">-->
            <!--ME:</asp:ContentPlaceHolder>-->
        <!--ME:</SharePoint:AjaxDelta>-->
        <!--MS:<SharePoint:CssRegistration Name="Themable/corev15.css" runat="server">-->
        <!--ME:</SharePoint:CssRegistration>-->
        <!--MS:<SharePoint:AjaxDelta id="DeltaSPWebPartManager" runat="server">-->
            <!--MS:<WebPartPages:SPWebPartManager runat="server">-->
            <!--ME:</WebPartPages:SPWebPartManager>-->
        <!--ME:</SharePoint:AjaxDelta>-->
        <!--CE: End Page Head Contents Snippet-->
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <!--DC:Business Solutions-->
        <link rel="stylesheet" href="css/style.css" type="text/css" charset="utf-8" />
        <!--[if lte IE 7]>
  <link rel="stylesheet" href="css/ie.css" type="text/css" charset="utf-8"/> 
 <![endif]-->
        <!--[if gte mso 9]><xml>
<mso:CustomDocumentProperties>
<mso:HtmlDesignFromMaster msdt:dt="string"></mso:HtmlDesignFromMaster>
<mso:HtmlDesignStatusAndPreview msdt:dt="string">http://[server_name]/sites/PubSite/_catalogs/masterpage/[site_name]/index.html, Conversion successful.</mso:HtmlDesignStatusAndPreview>
<mso:ContentTypeId msdt:dt="string">0x0101000F1C8B9E0EB4BE489F09807B2C53288F0054AD6EF48B9F7B45A142F8173F171BD10003D357F861E29844953D5CAA1D4D8A3A0084F0F9C7FCB65541A59990D173DA60FA</mso:ContentTypeId>
<mso:HtmlDesignAssociated msdt:dt="string">1</mso:HtmlDesignAssociated>
<mso:HtmlDesignConversionSucceeded msdt:dt="string">True</mso:HtmlDesignConversionSucceeded>
</mso:CustomDocumentProperties>
</xml><![endif]-->
    </head>

Разметка, добавленная после открывающего тега <body>

Фрагмент кода ленты


<!--CS: Start Ribbon Snippet-->
        <!--SPM:<%@Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"%>-->
        <!--SPM:<%@Register Tagprefix="wssucw" TagName="Welcome" Src="~/_controltemplates/15/Welcome.ascx"%>-->
        <!--MS:<SharePoint:SPSecurityTrimmedControl runat="server" HideFromSearchCrawler="true" EmitDiv="true">-->
            <div id="TurnOnAccessibility" style="display:none" class="s4-notdlg noindex">
                <a id="linkTurnOnAcc" href="#" class="ms-accessible ms-acc-button" onclick="SetIsAccessibilityFeatureEnabled(true);UpdateAccessibilityUI();document.getElementById('linkTurnOffAcc').focus();return false;">
                    <!--MS:<SharePoint:EncodedLiteral runat="server" text="&amp;lt;%$Resources:wss,master_turnonaccessibility%&amp;gt;" EncodeMethod="HtmlEncode">-->
                    <!--ME:</SharePoint:EncodedLiteral>-->
                </a>
            </div>
            <div id="TurnOffAccessibility" style="display:none" class="s4-notdlg noindex">
                <a id="linkTurnOffAcc" href="#" class="ms-accessible ms-acc-button" onclick="SetIsAccessibilityFeatureEnabled(false);UpdateAccessibilityUI();document.getElementById('linkTurnOnAcc').focus();return false;">
                    <!--MS:<SharePoint:EncodedLiteral runat="server" text="&amp;lt;%$Resources:wss,master_turnoffaccessibility%&amp;gt;" EncodeMethod="HtmlEncode">-->
                    <!--ME:</SharePoint:EncodedLiteral>-->
                </a>
            </div>
        <!--ME:</SharePoint:SPSecurityTrimmedControl>-->
        <div id="ms-designer-ribbon">
            <!--SID:02 {Ribbon}-->
            <!--PS: Start of READ-ONLY PREVIEW (do not modify) --><div class="DefaultContentBlock" style="background:rgb(0, 114, 198); color:white; width:100%; padding:8px; height:64px; overflow:hidden;">The SharePoint ribbon will be here when your file is either previewed on or applied to your site.</div><!--PE: End of READ-ONLY PREVIEW -->
        </div>
        <!--MS:<SharePoint:SPSecurityTrimmedControl runat="server" AuthenticationRestrictions="AnonymousUsersOnly">-->
            <!--MS:<wssucw:Welcome runat="server" EnableViewState="false">-->
            <!--ME:</wssucw:Welcome>-->
        <!--ME:</SharePoint:SPSecurityTrimmedControl>-->
        <!--CE: End Ribbon Snippet-->

Два тега <div> в SharePoint


<div id="s4-workspace">
            <div id="s4-bodyContainer">

Разметка, добавленная перед закрывающим тегом </body> и двумя закрывающими тегами </div>


<div data-name="ContentPlaceHolderMain">
                    <!--CS: Start PlaceHolderMain Snippet-->
                    <!--SPM:<%@Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"%>-->
                    <!--MS:<SharePoint:AjaxDelta ID="DeltaPlaceHolderMain" IsMainContent="true" runat="server">-->
                        <!--MS:<asp:ContentPlaceHolder ID="PlaceHolderMain" runat="server">-->
                            <div class="DefaultContentBlock" style="border:medium black solid; background:yellow; color:black; margin:20px; padding:10px;">
            This div, which you should delete, represents the content area that your Page Layouts and pages will fill. Design your Master Page around this content placeholder.
        
                            </div>
                        <!--ME:</asp:ContentPlaceHolder>-->
                    <!--ME:</SharePoint:AjaxDelta>-->
                    <!--CE: End PlaceHolderMain Snippet-->
                </div>

См. также