К этому шагу мы уже научились создавать типы страниц, теперь стоит задаться вопросом, а как же наша страница и её содержимое (поля, которые мы задали для страницы) будет показываться пользователю?
В свойствах шаблона есть следующие поля:
В теле шаблона сразу есть некоторый текст. Для тех кто знаком с ASP.NET и технологией MasterPage, никаких вопрос возникнуть не должно! А вот для тех, кто не знаком могут прочитать про MasterPage страницы, но в принципе это не обязательно, главное сказать, что вся верстка должна находится в нутрии тегов <asp:Content>…</asp:Content>.
Кстати блоков <asp:Content>...</asp:Content> может быть несколько, об этом тоже позже.
Давай те добавим наш первый html код:
Теперь мы должны обозначить в нашем шаблоне места, куда мы поставим значения наших полей: Title, Keywords, Description.
Для этого поставьте курсор между тегами <title></title> и на панели инструментов нажмите очень удобную кнопку (2):
Появится вспомогательное диалоговое окно:
Выберите из выпадающего списка “Choose field” нужное нам поле, нам нужно поле Title. Помимо созданных нами полей есть еще несколько системных, по названию можно догадаться о их назначении.
И нажимаем “Insert”.
Наш шаблон будет выглядеть вот так:
Проделайте тоже для поля Keywords и Description. В итоге Ваш шаблон должен выглядеть так:
Т.к. мы хотим этот шаблон использовать как основу для всех остальных шаблонов, так же как и тип страницы “Базовая страница”, мы должны указать место куда будет загружаться содержимое дочерних шаблонов.
Для этого существуют шаблоны. Шаблон – это html верстка, со специальной разметкой областей, в которые в дальнейшем будут вставляться данные из соответствующих полей типа страницы.
Когда мы с Вами создавали наши типы станиц, мы ставили галочку ”Create matching template” и для каждого нашего типа создавался свой собственный шаблон.
В Umbraco можно наследовать шаблоны (делать их вложенными), но об этом чуть позже.
Шаблоны в Umbraco хранятся в разделе “Settings”.
В разделе "Templates":
Забегая немного в перед: верстку я буду стараться использовать самую простую! Поэтому графическое оформление у нашего сайта будет минимальное, но картинки, JavaScript и CSS мы все таки использовать будем.
Давай те выберем шаблон “Базовая страница”.
В свойствах шаблона есть следующие поля:
- Name – Название шаблона (любое)
- Alias – Псевдоним шаблона (внутреннее название шаблона, любой)
- Master Template – главный шаблон, от которого будет наследоваться текущей, более подробно с этой настройкой разберемся позже.
- Большая текстовая область – непосредственно код шаблона, в ИЕ 7 у меня подсветка синтаксиса НЕ РАБОТАЕТ!
В теле шаблона сразу есть некоторый текст. Для тех кто знаком с ASP.NET и технологией MasterPage, никаких вопрос возникнуть не должно! А вот для тех, кто не знаком могут прочитать про MasterPage страницы, но в принципе это не обязательно, главное сказать, что вся верстка должна находится в нутрии тегов <asp:Content>…</asp:Content>.
Кстати блоков <asp:Content>...</asp:Content> может быть несколько, об этом тоже позже.
Давай те добавим наш первый html код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title> </title>
<meta name="keywords" content=""/>
<meta name="description" content=""/>
</head>
<body>
</body>
</html>Теперь мы должны обозначить в нашем шаблоне места, куда мы поставим значения наших полей: Title, Keywords, Description.
Для этого поставьте курсор между тегами <title></title> и на панели инструментов нажмите очень удобную кнопку (2):
Появится вспомогательное диалоговое окно:
Выберите из выпадающего списка “Choose field” нужное нам поле, нам нужно поле Title. Помимо созданных нами полей есть еще несколько системных, по названию можно догадаться о их назначении.
И нажимаем “Insert”.
Наш шаблон будет выглядеть вот так:
Проделайте тоже для поля Keywords и Description. В итоге Ваш шаблон должен выглядеть так:
Т.к. мы хотим этот шаблон использовать как основу для всех остальных шаблонов, так же как и тип страницы “Базовая страница”, мы должны указать место куда будет загружаться содержимое дочерних шаблонов.
Может возникнуть вопрос, а зачем нам делать вложенные шаблоны, вложенные типы и т.д. А ответ очень простой, для экономии нашего с вами и времени и упрощения дальнейшей работы. У нас на сайте в будущем будет несколько типов страниц (текстовая, новости, каталог, фотогалерея) и у каждой из них будет Title, Keywords и Description. Все эти поля будут иметь разные значения, но выводится, будут в одном и том же месте, по одному и тому де принципу. Поэтому, мы их вынесем один раз в Базовый тип и базовый шаблон и забудем о них;-)
Поставьте курсор после тега <body>. В панели управления есть кнопка (5), нажмите её для вставки специальной области. Появится диалоговое окно:
Введите название области в поле “Name” - phBasePageContext и нажмите кнопку “Insert”.
И добавьте еще одну область с названием phBasePageHeader перед закрытием тега </head>. Если первая секция будет использоваться для вставки контекста, вторая для подключения различных файлов.
Поставьте курсор после тега <body>. В панели управления есть кнопка (5), нажмите её для вставки специальной области. Появится диалоговое окно:
Введите название области в поле “Name” - phBasePageContext и нажмите кнопку “Insert”.
И добавьте еще одну область с названием phBasePageHeader перед закрытием тега </head>. Если первая секция будет использоваться для вставки контекста, вторая для подключения различных файлов.
И нажмите кнопку “Cохранить”(1):
Комментариев нет:
Отправить комментарий