sharepoint designer что это

Sharepoint designer что это

Как Вы уже знаете, технология Microsoft SharePoint – это бесплатное серверное решение, базирующееся на популярном стандарте ASP.NET. На основе служб SharePoint, с помощью браузера, легко организовывать мощные узлы для коллективной работы пользователей. Тем не менее, средства, предоставляемые браузером, довольно ограниченные и, по сути дела, не дают пользователю большой свободы выбора в оформлении узлов. В особенности, это касается и наполнения их различными HTML- и ASPX-элементами и дизайна веб-страниц, который, в большинстве случаев, диктуется шаблонами главных страниц узлов SharePoint.

Программа SharePoint Designer формально принадлежит семейству офисных программ, т. е. пакету Microsoft Office 2007, и является прямым наследником Microsoft FrontPage. Однако она не входит в стандартные комплекты поставки Office 2007 и должна приобретаться отдельно. Загрузить полнофункциональную пробную версию (с ограниченным сроком пользования и ознакомительной лицензией) можно бесплатно с веб-узла Microsoft.

Будучи типичным веб-редактором, Microsoft Office SharePoint Designer 2007 применяется в следующих целях:

Начало работы в SharePoint Designer

Программа Microsoft SharePoint Designer 2007 – это типичный веб-редактор, который позволяет создавать как обычные веб-страницы, так и более сложные конструкции, например, активные серверные страницы стандарта ASP.NET, а также решения на основе служб SharePoint (базирующихся, как мы знаем, целиком на той же самой технологии ASP.NET ).

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

Интерфейс SharePoint Designer прост и интуитивен. Центральную часть экрана (рис. 5.1) занимает область документа, представляющая содержимое веб-страницы, редактирующейся в данный момент. Как и в большинстве веб-редакторов, область документа может быть представлена в одном из вариантов:

Помимо строки меню и панелей инструментов, вызываемых при помощи меню Вид, имеется ряд панелей, объединяющихся в Области задач. Они занимают две большие области слева и справа по бокам от основной области редактируемого документа. В областях задач находится ряд панелей, посредством которых легко выполнить те или иные команды. Например, при помощи панели Список папок можно управлять содержимом веб-узла и просматривать различные папки с файлами. Панель Свойства CSS предназначена для управления каскадными таблицами стилей.

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

Ввод и редактирование текста

Для добавления текста в документ:

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

Для того, чтобы применить какое-либо форматирование к фрагменту текста, выделите этот фрагмент и примените нужный инструмент на панели Стандартная и Форматирование, находящиеся под строкой меню, подобно тому, как Вы делаете это, в текстовых редакторах, в частности, в Microsoft Word. Например, можно применить к фрагменту курсивное начертание шрифта.

Добавление элементов

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

SharePoint Designer предусматривает добавление элементов трех типов:

Несмотря на существенные идеологические различия между перечисленными типами элементов (они прояснятся в следующих трех главах соответственно), вставка любого из элементов в веб-страницу осуществляется примерно одинаковым способом. Мы рассмотрим технику добавления элемента в документ на примере вставки в него горизонтальной линии.

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

В результате горизонтальная линия появится в документе (рис. 5.5).

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

Для последующего прямого форматирования вставленного элемента удобнее всего применять контекстное меню, поскольку по самому набору команд в нем несложно догадаться, какая именно из них служит для редактирования элемента.

Для редактирования линии

В результате элемент (линия) приобретет выбранное форматирование, что будет отражено соответствующим образом в коде веб-страницы.

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

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

Сохранение и предварительный просмотр веб-страницы

Управление файлами в SharePoint Designer также осуществляется привычным способом. Нажатие кнопки Сохранить на панели инструментов (рис. 5.7) приводит к появлению стандартного диалога сохранения документа, при помощи которого легко сохранить веб-cтраницу в файле желаемого формата.

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

Разумеется, SharePoint поддерживает многооконный режим редактирования. Можно создать новый документ, например веб-страницу, определив первоначально его тип, а затем редактировать любую из открытых в данный момент веб-страниц, переключаясь между ними посредством закладок в верхней части области документа.

Для того, чтобы оценить вид отредактированного документа в браузере (рис. 5.8), достаточно нажать на панели инструментов Стандартная кнопку Просмотр в Windows Internet Explorer, либо просто нажать функциональную клавишу на клавиатуре.

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

Лабораторная работа 5.1. Создание нового веб-узла

Как и другие веб-редакторы, SharePoint Designer позволяет редактировать не только сами веб-страницы, но и осуществлять управление веб-узлом (по-другому, веб-сайтом ), в целом. В рамках этого упражнения создадим новый простой веб-узел с одной пустой html-страницей.

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

Проделайте следующие шаги по дальнейшему редактированию узла.

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

Лабораторная работа 5.2. Родительские и дочерние веб-узлы

Посвятим это упражнение созданию в SharePoint Designer дочернего узла. Например, на веб-сайте конторы «Рога и Копыта» создадим дочерний веб-сайт «Отдела копыт».

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

Лабораторная работа 5.3: Открытие веб-узла SharePoint

Рассмотрим, как в SharePoint Designer можно открыть для редактирования существующий веб-узел SharePoint. В качестве примера будем использовать тот же самый узел конторы «Рога и Копыта», который разрабатывался нами пока только в браузере.

Источник

Что такое SharePoint?

Организации используют microsoft SharePoint для создания веб-сайтов. Вы можете использовать его в качестве безопасного места для хранения, организации, обмена информацией и доступа к ней с любого устройства. Вам нужен только веб-браузер, например Microsoft Edge, Internet Explorer, Chrome или Firefox. Хотите узнать больше? Начало работы с SharePoint.

Взгляните на последнюю версию SharePoint. При создании нового сайта группы вы увидите его для SharePoint и SharePoint Server 2019.

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

sharepoint designer что это. Смотреть фото sharepoint designer что это. Смотреть картинку sharepoint designer что это. Картинка про sharepoint designer что это. Фото sharepoint designer что это

SharePoint: продукты и файлы для загрузки

Название «SharePoint» может относиться к одному или нескольким продуктам и технологиям SharePoint, включая указанные ниже.

SharePoint в Microsoft 365 Облачная служба, расположенная в Microsoft, для предприятий любого размера. Вместо того чтобы устанавливать и развертывать SharePoint Server локально, любой бизнес может подписаться на планMicrosoft 365 или на SharePoint Online службу. Ваши сотрудники могут создавать сайты для обмена документами и информацией с коллегами, партнерами и клиентами. Чтобы начать хранить файлы на сайте группы, см. раздел Настройка Microsoft 365 файлов и общего доступа.Попробуйте Microsoft 365.

SharePoint Server Организации могут развертывать SharePoint Server локально или с помощью подписки Office 365 корпоративный, чтобы воспользоваться всеми новейшими функциями. Кроме того, в нем предлагаются дополнительные функции и возможности, такие как современные страницы сайтов, современные веб-части и разработки, современные списки и библиотеки, современный поиск, интеграция с PowerApps, Power BI и MS Flow и SharePoint домашней страницей. Скачать SharePoint Server 2019.

SharePoint Designer 2013 Бесплатная программа выпущена в 2013 г. Используется для создания мощных решений с поддержкой рабочего процесса. Используется для изменения внешних типов контента для решения для внешних данных на основе Business Connectivity Services. Скачать SharePoint Designer 2013.

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

Дополнительные сведения о том, как попробовать, приобрести или использовать SharePoint и технологий, см. в SharePoint продукта.

Если вы знакомы с SharePoint и хотите узнать, что изменилось в последнее время, см. новые обновления в SharePoint и Различия между SharePoint Server 2016 и 2019.

Источник

Обзор программы Microsoft SharePoint Designer

Хотите создать свой корпоративный сайт или продающий лендинг, но нет знаний в устройстве HTML-страниц? Обратите внимание на приложение SharePoint Designer от компании Microsoft.

Из преимуществ:

Разработано зарекомендовавшим себя на рынке производителем;

Имеется подробная инструкция и справка по работе на русском языке;

Интерфейс поддерживает русский язык;

Вес программы 250-300 МБ. Не требует производительной и мощной аппаратной среды.

Из недостатков стоит отметить, что хоть приложение и входит в семейство MS Office, но инсталлируется отдельно.

Базовые функции MS SharePoint Designer

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

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

Интерфейс приложения очень напоминает редактор Word. Также наверху расположена панель с инструментами. Но в отличие от Word есть возможность открывать и редактировать сразу несколько страниц в одной оболочке.

Программа укомплектована 11 панелями с инструментами. Можно настроить на отображение все, или только те, что нужны вам в данный момент.

Весь набор текста на будущей странице сайта производится также, как и в редакторе Word. Может быть также установлен фон и другие визуальные эффекты. Единственный минус — это настройка форматирования по центру или ширине. Здесь придется воспользоваться окном кода. А правописание русского уже интегрировано в платформу.

Для вставки помимо текста различных элементов предусмотрен достаточно скудный список, но для начального уровня вполне допустимый: спецсимволы, меню, изображения, таблицы. Для всего остального нужно знания кода. Кроме этого, хочется отметить, что Microsoft SharePoint Designer работает со слоями. В основном весь функционал программы достался приложению от предшественника — утилиты Front Page.

Программа позволяет создавать страницы сайта тремя различными способами:

Из явных преимуществ редактора хочется отметить поддержку технологии CSS. Это каскадные таблицы стилей. Вы в минимально короткий срок можете изменить всю стилистику сайта. Просто внесите исправления на Главную страницу и воспользуйтесь технологией CSS. Фон, стиль, дизайн будет изменен на всех второстепенных страницах ресурса.

Выбирая приложение Microsoft SharePoint Designer, вы сможете попробовать свои возможности в области программирования и создания Webресурсов. Возможностей программы вполне достаточно, чтобы собрать свой первый сайт, прочувствовать нюансы, попробовать использовать не только готовые конструкторные решения, но и элементы программирования через коды.

Официальная справка к программе и инструкция по работе написана сухим, формализованным языком, поэтому для начала работы используйте дополнительные справочные материалы. Отличным подспорьем в этом деле могут стать видео-уроки, размещенные в открытом доступе наYOUTUBE каналах.

Источник

Обзор Дизайнера в SharePoint

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

Узнайте, как использовать Дизайнер для оформления сайта SharePoint. Дизайне — это компонент публикации, доступный на сайтах публикации в SharePoint и Office 365.

Общие сведения о Дизайнере

Если вы хотите, чтобы ваш сайт SharePoint представлял бренд вашей организации и не выглядел как обычная страница SharePoint, вы можете создать собственный вариант оформления с помощью Дизайнера. Дизайнер — это компонент SharePoint, который упрощает создание полностью настраиваемого и выверенного оформления с помощью средств веб разработки, с которыми вы уже знакомы. Этот компонент публикации доступен на сайтах публикации в SharePoint и Office 365.

Используя Дизайнер, вы можете спроектировать дизайн веб-сайта с помощью любого средства веб-разработки или HTML-редактора, который вы предпочитаете, применяя только HTML и CSS, после чего дизайн передается в SharePoint. Дизайнер — это главный ресурс и интерфейс, в котором можно управлять всеми аспектами пользовательского дизайна.

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

На высоком уровне дизайнер выполнит следующие задачи.

Изучит основные концепции проектирования SharePoint. Дополнительные сведения см. в статье Обзор модели страниц в SharePoint.

Создаст макет дизайна с помощью HTML и CSS. Создание дизайна — основной навык веб-дизайнера, который в этой статье не рассматривается.

Реализует дизайн с помощью Дизайнера. В этой статье представлен обзор Дизайнера и описывается его использование для реализации визуального дизайна.

Использование Дизайнера для оформления сайта

Если посмотреть на Дизайнер, вы увидите ряд ссылок с левой стороны, представляющие высокоуровневые задачи, которые необходимо выполнить. В зависимости от дизайна и требований для сайта не все эти задачи потребуется выполнить, при этом они необязательно выполняются в указанном порядке. Тем не менее эта последовательность служит отправной точкой.

Подготовка к работе

Прежде чем использовать Дизайнер, необходим дизайн. Вы можете создать собственный или использовать готовый шаблон веб-сайта. «Дизайн» — это просто группа файлов, которые реализуют дизайн сайта, например:

по крайней мере один HTML-файл, который будет преобразован в главную страницу SharePoint;

один или несколько CSS-файлов;

другие вспомогательные файлы.

При создании макета сайта на HTML и CSS вы, скорее всего, получите несколько HTML-файлов, в которых реализуются различные страницы или типы страниц. Помните, что только один из этих файлов будет преобразован в главную страницу (если у не несколько каналов устройства, где у каждого канала есть собственная главная страница — см. следующий раздел). После создания других элементов сайта, например макетов страниц и шаблонов отображения, с помощью Дизайнера можно перенести разметку из HTML-макета в HTML- и CSS-файлы, связанные с макетом страницы или шаблоном отображения.

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

Управление каналами устройств

Даже перед проектированием сайта следует учесть, на какие устройства будет ориентирован сайт и каким будет пользовательский интерфейс на каждом устройстве. Например, можно оптимизировать дизайн вашего сайта для определенного класса смартфонов и планшетных ПК.

В зависимости от того, какие каналы вы определите, может потребоваться несколько дизайнов, а значит и несколько HTML-файлов, каждый из которых преобразуется в отдельную главную страницу. Кроме того, каждый HTML-файл (и каждая главная страница) может ссылаться на собственный CSS-файл. Перед проектированием сайта каналы устройств следует проанализировать в первую очередь.

С помощью каналов устройств можно отображать один сайт публикации разными способами, сопоставляя различные дизайны с разными устройствами. У каждого канала может быть собственная главная страница, связанная с таблицей стилей, которая оптимизирована для определенного устройства. Каждый канал указывает подстроки агента пользователя для одного или нескольких устройств, например «ОС Windows Phone». Эти правила определяют, какие устройства включены в каждый канал. Когда посетители просматривают сайт, каждый канал захватывает трафик для заданного устройства или класса устройств, таких как Windows Phone, и посетители видят сайт с дизайном, оптимизированным для их устройства.

Каналы устройств создаются и хранятся в списке SharePoint, в которых учитывается порядок, потому что у каналов устройств также есть рейтинг. Каналы устройств в списке упорядочены сверху вниз, а правила включения обрабатываются в заданном порядке. Это означает, что каналы устройств с наиболее конкретными правилами должны находиться вверху. Например, канал для «Windows Phone 7.0» должен идти перед каналом для «ОС Windows Phone».

Отправка файлов дизайна

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

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

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

Изменение главных страниц

Создание главной страницы с фирменной символикой, которая содержит все требуемые функции SharePoint, например элементы навигации и поиска, по сути, состоит из трех этапов:

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

предварительный просмотр главной страницы и устранение ошибок;

добавление фрагментов кода SharePoint на главную страницу.

Каждый из этих трех шагов выполняется на другой странице в Дизайнере.

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

Основная функция Дизайнера — преобразование HTML-дизайна в главную страницу SharePoint. Для успешного отображения главной страницы SharePoint она должна содержать множество элементов ASP.NET и элементов, относящихся к SharePoint. При преобразовании HTML-файла в главную страницу Дизайнер создает MASTER-файл, содержащий все эти обязательные элементы, поэтому вам не следует о них волноваться. Во время преобразования некоторые элементы HTML-разметки (например, комментарии) также добавляются в исходный HTML-файл.

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

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

Предварительный просмотр главной страницы

Кроме преобразования главной страницы, Дизайнер позволяет просмотреть ее в том виде, в котором она отображается на сервер (а не так, как она показана в редакторе HTML). Так вы сможете динамически изучить главную страницу и исправить любые проблемы, которые могут помешать ее отрисовке. Например, HTML-файл должен быть XML-совместимым, поэтому необходимо исправить небольшие проблемы с разметкой, например добавить закрывающие теги для всех элементов. Чтобы исправить ошибки, следует отредактировать HTML-файл, сохранить его и обновить страницу на сервере.

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

Добавление фрагментов

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

поиск фрагментов в коллекции фрагментов и их настройка;

копирование фрагментов на главную HTML-страницу;

предварительный просмотр и изменение стиля фрагментов с помощью CSS.

Поиск фрагментов в коллекция фрагментов и их настройка

В коллекции фрагментов вы можете сразу увидеть, какие компоненты доступны для редактируемого типа файла: главной страницы или макета страницы. Выберите фрагмент на ленте. В таблице свойств справа можно настроить свойства этого экземпляра фрагмента. Затем нажмите кнопку Обновить, чтобы обновить HTML-фрагмент в левой части экрана.

Копирование фрагментов на главную HTML-страницу

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

Предварительный просмотр и изменение стиля фрагментов с помощью CSS

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

По умолчанию большинство фрагментов наследуют стили из главной таблицы стилей SharePoint, corev15.css. Для задания стиля фрагмента необходимо указать, какие стили применяются к фрагменту, и переопределить с помощью настраиваемой каскадной таблицы стилей (CSS). Для определения этих стилей по умолчанию можно использовать средства браузера, например инструменты разработчика в Internet Explorer. В режиме предварительного просмотра главной страницы на сервере в Internet Explorer нажмите клавишу F12, нажмите кнопку Найти, а затем выберите параметр Выбрать элемент щелчком. После этого вы сможете щелкнуть фрагмент и посмотреть, какие именно стили следует переопределить, добавив CSS в ту или иную таблицу стилей, с которой связана ваша главная страница.

Изменение шаблонов отображения

При локальной установке SharePoint Server вы можете отображать результаты выполнения поисковых запросов в виде контента на страницах с помощью веб-части «Поиск контента» и других веб-частей на основе поиска. В веб-частях на основе поиска используются шаблоны отображения для двух основных целей:

для сопоставления управляемых свойств, которые возвращаются в списке результатов, со свойствами, которые будут доступны для JavaScript, включая любой пользовательский код JavaScript, который вы реализуете;

для показа и настройки стиля отображения этих свойств с помощью HTML и CSS.

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

Если вам требуется создать настраиваемый шаблон отображения, скопируйте, а затем измените один из существующих шаблонов отображения. Это полезно, так как шаблоны по умолчанию содержат полезные сведения в комментариях в HTML-файле. Кроме того, вы получите правильную базовую структуру страницы и основу для выполнения основных задач, например сопоставления полей ввода.

Изменение макетов страниц

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

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

После создания макета страницы со связанным HTML-файлом, оставшиеся действия аналогичны созданию главной страницы.

Изучите макет страницы и исправьте ошибки, а затем сохраните HTML-версию.

Добавьте фрагменты в макет страницы (настройте, скопируйте, просмотрите и задайте стиль).

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

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

Создание тем и вариантов оформления

Для Office 365 (но не для локальных экземпляров SharePoint) Дизайнер позволяет создавать темы и составные представления. Тема — это набор шрифтов и цветов, которые можно применить к пользовательскому макету (т. е. к главной странице). Темы задаются в XML-файлах, отправляемых в коллекцию тем. Чтобы главная страница поддерживала темы, необходимо добавить на нее специальную разметку, которую SharePoint распознает и использует для вставки элементов темы, таких как шрифты и цвета.

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

Публикация и применение дизайна

Большинство ресурсов, используемых дизайнов, такие как изображения, HTML-файлы, CSS-файлы и файлы JavaScript, будут храниться в коллекции главных страниц. Коллекция главных страниц — это библиотека документов SharePoint с включенным по умолчанию управлением версиями, которая создает основные и вспомогательные (черновые) версии при каждом изменении файла.

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

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

Создание пакета конструктора

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

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

Источник

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *